同步两个ScrollView视图的位置

7
我正在尝试同步两个ScrollView的位置。我这样做是为了显示电视节目指南列表。我创建了一个扩展RelativeLayout的自定义类来显示指南。这个相对布局有四个子元素:左上角的ImageView、右上角用于显示列标题的HorizontalScrollView、左下角用于显示行标题的ScrollView,以及包含列表的右下角的ScrollView。然后,这个ScrollView包含一个HorizontalScrollView,它又包含一个LinearLayout和多个子视图,用于显示数据。希望这解释得清楚,但这里有一张图片使其更清晰:
 ____________
|__|___hsv___|
|  |         |
|  | sv ->   |
|  |  hsv -> |
|sv|   ll -> |
|  |    etc  |
|  |         |
|__|_________|

我这样设置是因为我希望指南列表可以水平和垂直滚动,但没有滚动视图可以做到这一点。此外,无论指南列表处于什么位置,我都希望行和列标题显示出来,但我希望它们能够正确对齐。因此,我正在尝试找到一种方法来同步两个hsv的位置,并同步两个sv的位置。我还尝试以一种避免每隔几毫秒就运行处理程序来轮询一个视图并在另一个视图上调用scrollTo的方式来实现它。
我不确定这是否是最好的方法,但这是我想到的。如果有其他建议,请随意提出!

@Billy...你已经找到解决方案了吗? - i_raqz
5个回答

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

1

在所有面板中都实现 onTouchEvent(MotionEvent me) 不是很值得吗?当滚动其中一个面板时,将调用此方法,并确保其他所有面板保持同步。


1
处理触摸事件是不够的,因为如果您快速滑动,即使释放触摸,滚动也会继续进行一段时间。解决方法是覆盖computeScroll()方法。请查看https://github.com/chrisjenx/ParallaxScrollView以了解如何在那里完成此操作。

0

我通过以下方式实现了相同的布局。

在xml中,您会发现SyncedScrollView是自定义滚动视图,用于同步两个滚动视图。

您需要参考以下两个stackoverflow答案:

  1. SynchedScrollView andig answer
  2. 优化SynchedScrollView我的回答

请查看下面的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以动态创建表格。
这是布局的屏幕截图 这是布局的屏幕截图 对于我的纯英语表示抱歉。

0

您可以查看这篇文章:链接

这个人实际上在做什么是创建自定义的ScrollView并覆盖方法onScrollChanged,添加监听器,然后在它们被绘制到屏幕之前进行同步。

现在您可以在HorizontalScrollView中添加一个ScrollView作为主框架。左侧栏将是一个HorizontalScrollView,顶部将是一个ScrollView。然后将主ScrollView和主HorizontalScrollView注册到两个单独的ScrollManagers中(请参见上面的链接)。

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

-

附注: 如果您只使用监听器本身而不是ScrollManager,则会有1帧的同步延迟。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接