Highlighting a panel in scrollview on click

barx · Jun 20, 2012

Hey guys

I'm creating a sort of preference screen as the PreferenceActivity Lib doesn't do what i need.

To create it I use a scrollview and panel containing required views for that item (e.g. 2 labels and a checkbox for a checkbox item). Got these adding nicely. Now, when an item is clicked / tapped, i want it to highlight to the touch like a listview does, I use the following code and it seems to work nice on a emulator running 2.2 froyo, but when run on a real device the color flashes for a brief second and then returns to black. Any ideas why this happens and how to get it working correctly. It's almost as though the _touch event needs 'de-bouncing'? android version tried on real device are 2.3.3. I very nearly put 2.1 as well but just remembered i flashed the backside off my x10 mini pro and put 2.3.3 on it

B4X:

Sub Panel_Touch (Action As Int, X As Float, Y As Float) As Boolean
   Dim p As Panel
   p = Sender
   
   If Action = Activity.ACTION_DOWN Then
      p.Background = StockDrawable.GetAndroidDrawable("list_selector_background_pressed")
   Else
      p.Color = Colors.Black
   End If
   Return True
End Sub

Thanks

stevel05 · Jun 20, 2012

It's probably just down to the speed (or lack of) on the emulator. The best way to ensure consistency would be to use a timer to reset the background.

klaus · Jun 20, 2012

The behaviour you describle looks normal to me, you change the color when ACTION_DOWN = True but as soon as you move the finger you set back the 'standard' background.
But to give you a concrete answer you need to give some more information.
Are the Labels and the CheckBox for each entry on a Panel ?
What happens if you click on a Label or on a CheckBox ?
For me you shouldn't use the Panel_Touch event but either the Click events of the Labels or the Click event of the Panel.
Are the Label and CheckBox backgrounds transparent ?
etc.

The BEST would be to post your project as zip file or at least a smaller project showing the problem so we could test it in the same conditions as you do.

Best regards.

barx · Jun 20, 2012

Ok, thanks for the quick responses. Klaus wouldn't the click event only trigger one way, i.e it wouldn't return to black when you lift your finger?

Anyways, .zip attached, it's nothing special, more of a mock up to see if I could produce the prefs screen.

I changed the Action line to

B4X:

If Action <> Activity.ACTION_UP Then

and it is very nearly there now, only issue now is if you tap and then drag, it doesn't return black when lifting finger up. If you tap and then release without dragging the the desired effect is produced

NJDude · Jun 20, 2012

Assuming you tap on the panel only, the attached sample might do what you need, or give you an idea.

I'm using a timer to delay the color resetting.

barx · Jun 20, 2012

Cheers for the sample NJDude but unfortunately it doesn't give the required effect. I want to tap and the panel changes color while the finger is on the screen and not change back until the finger is lifted. Would have thought it would be an easy task, but as usual with everything i try.....

NJDude · Jun 20, 2012

Oh, ok, what about now?

thedesolatesoul · Jun 20, 2012

Hi Barx,
I know the effect you want is similar to what a listview has.
The 'highlight' is removed when either:
a. The touch is removed
b. The listview is scrolled a certain amount

The correct solution is to create and stored a deltaX and deltaY, and when the drag is greater than a threshold (for e.g. 5 pixels) then remove the highlight.

To give you an idea:

B4X:

Sub Panel_Touch (Action As Int, X As Float, Y As Float) As Boolean
    Dim p As Panel
    p = Sender
    
    If Action = Activity.ACTION_DOWN Then
        state = HIGHLIGHTED
    Else if state = HIGHLIGHTED and Action = Activity.ACTION_MOVE then
        deltaX = abs(X - LastX)
        deltaY = abs(Y - LastY)
  
        'On a larger drag remove the highlight
        if deltaX > 5dip or deltaY > 5dip then    
           state = UNHIGHLIGHTED
        end if
    Else if Action = Activity.ACTION_UP then
        state = UNHIGHLIGHTED
    End If

    if state = HIGHLIGHTED then
        p.Color = Colors.White
    else
        p.Color = Colors.Black
    end if
     LastX = X
     LastY = Y
    Return True
End Sub

barx · Jun 21, 2012

OK, sorry for the sudden quietness last night. Computer decided it was going to connect to any devices last night so turned off and went bed.

@NJDude - You example works fine..........................until used on a panel that is held in a scrollview. It then becomes same as my best effort which is if you scroll the scollview whilst an item is highlighted then the highlight sticks. I'm assuming its to do with the scrollview consuming the touch event or effecting the panels touch event. When i log the touches, after a MOVE, no UP is registered. Any ideas dude?

@tds - I see what you are doing in the code, and think i will try to implement it to test. It doesn't look as though it would work as is. There is no LastX and LastY for example. Also, without sounding cynical, you should be looking at this issue too as your Clo*****es app suffers the same fate.

Going to keep at it once I get in from work.

Thanks again

thedesolatesoul · Jun 21, 2012

barx said:
@tds - I see what you are doing in the code, and think i will try to implement it to test. It doesn't look as though it would work as is. There is no LastX and LastY for example. Also, without sounding cynical, you should be looking at this issue too as your Clo*****es app suffers the same fate.

Thanks again

I know, but this is fairly low on my priority list since it doesnt look too bad.
I havent tested anything yet, but when the scrollview starts scrolling I think it takes all the events. I *may* get some time today to look at it.
Clo*****es = ClogPuppies

klaus · Jun 21, 2012

Sorry, in my previous post I misunderstoud your question.
The attached version should do what you expect.
You are right the Touch UP event is consumed by the ScrollView .
So I added a Timer that sets the background to black, the Timer is fired by the ScrollView position change.

Best regards.

barx · Jun 21, 2012

thedesolatesoul said:
I know, but this is fairly low on my priority list since it doesnt look too bad.
I havent tested anything yet, but when the scrollview starts scrolling I think it takes all the events. I *may* get some time today to look at it.
Clo*****es = ClogPuppies

Didn't know if the name was public yet and didn't want to give the game away

barx · Jun 21, 2012

klaus said:
Sorry, in my previous post I misunderstoud your question.
The attached version should do what you expect.
You are right the Touch UP event is consumed by the ScrollView .
So I added a Timer that sets the background to black, the Timer is fired by the ScrollView position change.

Best regards.

Appears to work nice klaus, thanks for your input

Highlighting a panel in scrollview on click

barx

Well-Known Member

stevel05

Expert

klaus

Expert

barx

Well-Known Member

Attachments

NJDude

Expert

Attachments

barx

Well-Known Member

NJDude

Expert

Attachments

thedesolatesoul

Expert

barx

Well-Known Member

thedesolatesoul

Expert

klaus

Expert

Attachments

barx

Well-Known Member

barx

Well-Known Member

Similar Threads

Highlighting a panel in scrollview on click

Well-Known Member

Expert

Expert

Well-Known Member

Attachments

Expert

Attachments

Well-Known Member

Expert

Attachments

Expert

Well-Known Member

Expert

Expert

Attachments

Well-Known Member

Well-Known Member

Similar Threads

Privacy & Transparency

Privacy & Transparency