Synchronize the position of two ScrollView views

Question

I am trying to synchronize the positions of two ScrollViews. I'm trying to do this to display a tv guide listing.

I have created a custom class that extends RelativeLayout to display the guide. This relative layout has four children: an imageview in the top left corner, a HorizontalScrollView to display the column headers in the top right, a ScrollView to display the row headers at the bottom left, and a ScrollView in the bottom right that contains the listings. This ScrollView then contains a HorizontalScrollView, which in turn contains a LinearLayout with multiple child views that display the data. I hope this explains it clearly, but here's a diagram to make it clearer:

 ____________
|__|___hsv___|
|  |         |
|  | sv ->   |
|  |  hsv -> |
|sv|   ll -> |
|  |    etc  |
|  |         |
|__|_________|

I set it up like this because I wanted the guide listings to scroll both horizontally and vertically, but there's no scroll view that does this. Also, I want the row and column headers to display no matter what position the guide listings are at, but I want them to be lined up properly. So I'm trying to find a way to synchronize the positions of the two hsv's, and to also synchronize the positions of the two sv's. I'm also trying to do it in a way that avoids just running a handler every few milliseconds to poll one view and call scrollTo on the other.

I'm in no way sure that this is the best way to do it, but this is what I've come up with. If anybody has any other suggestions, please feel free!

Answer 1

Wouldn't it be worth implementing onTouchEvent(MotionEvent me) in all your panels? When one of your panels is scrolled, this method would be called, and it can make sure that all the others are kept synchronized.

Answer 2

Handling the touch events does not work 100%. The amount of scrolls in different views may not be in sync always.

Answer 3

Handling the touch events is not enough, because if you do a fast flinge the scrolling goes on for a while after releasing the touch. The solution is to override the computeScroll() method. Have a look at https://github.com/chrisjenx/ParallaxScrollView how it is done there.