Hi,
I am building a touch scroller component and I have a problem with event propagation within the layers of the component. More precisely, when the scrolled element that is holding a button is under the upper or lower part of the scroller where there is the gradient to represent the scroller shadow, the touch down on the button is not received.
When the element is under the gap that is between the upper and lower shadows, the button receives the event correctly.
Here is how I did the layering. The fleshes represent the parent-child hierarchy.
The layer called “content” is a different component that can hold different elements and permits different organisation of elements. This is also the part that moves along the “y” axis and holds a mask that limits the content view to the visible area.
In this situation, the element has buttons and it should be clickable even when under the shadows.
If I take off the shadows, buttons are clickable everywhere as expected. I don’t really understand why the shadows block those touch events.
Is my layering not good? Is there a technique to pass those events through? Is there a best practice for these situations?
Thanks a lot!
Greg