同步两个ScrollView视图的位置

Question

我正在尝试同步两个 ScrollView 的位置。我正在尝试执行此操作以显示电视指南列表。

我创建了一个扩展RelativeLayout 的自定义类来显示指南。此相对布局有四个子项：左上角的 imageview、右上角显示列标题的 Horizo​​ntalScrollView、左下角显示行标题的 ScrollView 以及右下角包含列表的 ScrollView 。然后，此 ScrollView 包含一个 Horizo​​ntalScrollView，而 Horizo​​ntalScrollView 又包含一个带有多个显示数据的子视图的 LinearLayout。我希望这能清楚地解释它，但这里有一个图表可以使它更清楚：

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

我这样设置是因为我希望指南列表水平和垂直滚动，但没有滚动视图可以做到这一点。另外，我希望无论指南列表位于什么位置，行标题和列标题都会显示，但我希望它们正确排列。所以我试图找到一种方法来同步两个 hsv 的位置，并同步两个 sv 的位置。我还尝试以一种方式来避免每隔几毫秒运行一个处理程序来轮询一个视图并在另一个视图上调用scrollTo。

我不确定这是否是最好的方法，但这就是我想到的。如果有人有任何其他建议，请随意！

Answer 1

难道不值得实现 onTouchEvent (MotionEvent me) 在你的所有面板中？当滚动其中一个面板时，将调用此方法，它可以确保所有其他面板保持同步。

Answer 2

处理触摸事件并不能 100% 有效。不同视图中的滚动数量可能并不总是同步。

Answer 3

处理触摸事件是不够的，因为如果您快速滑动，则在释放触摸后滚动会继续一段时间。解决方案是重写computeScroll()方法。看看 https://github.com/chrisjenx/ParallaxScrollView 是如何完成的。

Answer 4

您可以看看这篇文章： 链接

这个人实际上在做什么，他创建了自定义 ScrollView 并覆盖onScrollChanged 方法添加一个侦听器，然后在将它们绘制到屏幕之前对它们进行同步。

您现在可以做的就是在 Horizo​​ntalScrollView 中添加一个 ScrollView 作为主框架。左边的栏是一个Horizo​​ntalScrollView，顶部的栏是一个ScrollView。然后，将主 ScrollView 和主 Horizo​​ntalScrollView 注册到两个单独的 ScrollManager（请参阅上面的链接）。

然后禁用 hsv 和 sv 的滚动并将它们添加到相应的 ScrollManagers 中。那么一切都应该工作正常。

-

PS。
如果您只使用侦听器本身而不使用 ScrollManager，则同步延迟将为 1 帧。

Answer 5

我通过执行以下操作实现了相同的布局。

你会发现xml中的SyncedScrollView是自定义的scrollview，用于同步两个scrollview。

您需要参考下面两个 stackoverflow 答案。

1. SyncedScrollView 和ig答案
2. 优化SyncedScrollView 我的答案

检查下面的xml，

<RelativeLayout
    android:id="@+id/activity_main_linear_before_all_scroll"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/activity_main_empty_box"
        android:layout_width="50dp"
        android:layout_height="30dp"
        android:text="xx"
        android:gravity="center" />

    <com.example.SyncedScrollView
        android:id="@+id/activity_main_observable_scrollview_1"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_below="@+id/activity_main_empty_box"
        android:fadeScrollbars="false"
        android:overScrollMode="never"
        android:scrollbars="none">

        <LinearLayout
            android:id="@+id/activity_main_linear_left_headers"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:layout_width="50dp"
                android:layout_height="30dp"
                android:gravity="center"
                android:padding="5dp"
                android:text="row 1" />

            <TextView
                android:layout_width="50dp"
                android:layout_height="30dp"
                android:gravity="center"
                android:padding="5dp"
                android:text="row 2" />

            <TextView
                android:layout_width="50dp"
                android:layout_height="30dp"
                android:gravity="center"
                android:padding="5dp"
                android:text="row 3" />

        </LinearLayout>

    </com.example.SyncedScrollView>

    <HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_toEndOf="@+id/activity_main_empty_box"
        android:layout_toRightOf="@+id/activity_main_empty_box"
        android:fadeScrollbars="false"
        android:overScrollMode="never">

        <RelativeLayout
            android:id="@+id/activity_main_body_relative"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <LinearLayout
                android:id="@+id/activity_main_top_headers"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <TextView
                    android:layout_width="50dp"
                    android:layout_height="30dp"
                    android:gravity="center"
                    android:padding="5dp"
                    android:text="column 1" />

                <TextView
                    android:layout_width="50dp"
                    android:layout_height="30dp"
                    android:gravity="center"
                    android:padding="5dp"
                    android:text="column 2" />

                <TextView
                    android:layout_width="50dp"
                    android:layout_height="30dp"
                    android:gravity="center"
                    android:padding="5dp"
                    android:text="column 3" />

            </LinearLayout>

            <com.example.SyncedScrollView
                android:id="@+id/activity_main_observable_scrollview_2"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_below="@+id/activity_main_top_headers"
                android:fadeScrollbars="false"
                android:overScrollMode="never"
                android:scrollbars="vertical">

                <LinearLayout
                    android:id="@+id/activity_main_body"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical">

                    <LinearLayout
                        android:id="@+id/activity_main_body_row_1"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:orientation="horizontal">

                        <TextView
                            android:layout_width="50dp"
                            android:layout_height="30dp"
                            android:gravity="center"
                            android:padding="5dp"
                            android:text="1,1" />

                        <TextView
                            android:layout_width="50dp"
                            android:layout_height="30dp"
                            android:gravity="center"
                            android:padding="5dp"
                            android:text="1,2" />

                        <TextView
                            android:layout_width="50dp"
                            android:layout_height="30dp"
                            android:gravity="center"
                            android:padding="5dp"
                            android:text="1,3" />

                    </LinearLayout>

                    <LinearLayout
                        android:id="@+id/activity_main_body_row_2"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:orientation="horizontal">

                        <TextView
                            android:layout_width="50dp"
                            android:layout_height="30dp"
                            android:gravity="center"
                            android:padding="5dp"
                            android:text="2,1" />

                        <TextView
                            android:layout_width="50dp"
                            android:layout_height="30dp"
                            android:gravity="center"
                            android:padding="5dp"
                            android:text="2,2" />

                        <TextView
                            android:layout_width="50dp"
                            android:layout_height="30dp"
                            android:gravity="center"
                            android:padding="5dp"
                            android:text="2,3" />

                    </LinearLayout>

                    <LinearLayout
                        android:id="@+id/activity_main_body_row_3"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:orientation="horizontal">

                        <TextView
                            android:layout_width="50dp"
                            android:layout_height="30dp"
                            android:gravity="center"
                            android:padding="5dp"
                            android:text="3,1" />

                        <TextView
                            android:layout_width="50dp"
                            android:layout_height="30dp"
                            android:gravity="center"
                            android:padding="5dp"
                            android:text="3,2" />

                        <TextView
                            android:layout_width="50dp"
                            android:layout_height="30dp"
                            android:gravity="center"
                            android:padding="5dp"
                            android:text="3,3" />

                    </LinearLayout>

                </LinearLayout>

            </com.example.SyncedScrollView>

        </RelativeLayout>

    </HorizontalScrollView>

</RelativeLayout>

这里每个单元格都是TextView。因此您可以设置背景可绘制来绘制框（它看起来像表格）

您也可以动态添加左标题、顶部标题和正文 TextView 来动态创建表格。

这是布局的屏幕截图

抱歉我的英语纯正。