Sincronizar la posición de dos vistas ScrollView

Question

Estoy tratando de sincronizar las posiciones de dos ScrollViews. Estoy tratando de hacer esto para mostrar una lista de guías de televisión.

He creado una clase personalizada que amplía RelativeLayout para mostrar la guía. Este diseño relativo tiene cuatro elementos secundarios: una vista de imagen en la esquina superior izquierda, un HorizontalScrollView para mostrar los encabezados de columna en la parte superior derecha, un ScrollView para mostrar los encabezados de fila en la parte inferior izquierda y un ScrollView en la parte inferior derecha que contiene los listados . Este ScrollView contiene un HorizontalScrollView, que a su vez contiene un LinearLayout con múltiples vistas secundarias que muestran los datos. Espero que esto lo explica con claridad, pero aquí es un diagrama para hacerlo más claro:

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

lo configuro como esto porque quería los listados de la guía para desplazarse horizontal y verticalmente, pero no hay vista de desplazamiento que hace esto . Además, quiero que los encabezados de fila y columna se muestren sin importar en qué posición estén las listas de guía, pero quiero que estén alineadas correctamente. Así que estoy tratando de encontrar una manera de sincronizar las posiciones de las dos hsv, y también sincronizar las posiciones de las dos sv's. También estoy tratando de hacerlo de una manera que evite simplemente ejecutar un controlador cada pocos milisegundos para sondear una vista y llamar a scrollTo por el otro.

No estoy seguro de que esta sea la mejor manera de hacerlo, pero esto es lo que se me ocurrió. Si alguien tiene alguna otra sugerencia, ¡siéntete libre!

Answer 1

¿No valdría la pena implementar onTouchEvent(MotionEvent me) en todos sus paneles? Cuando se desplaza uno de sus paneles, se llamará a este método y se asegurará de que todos los demás se mantengan sincronizados.

Answer 2

El manejo de los eventos táctiles no funciona al 100%. La cantidad de pergaminos en diferentes vistas puede no estar siempre sincronizada.

Answer 3

El manejo de los eventos táctiles no es suficiente, porque si realiza una flotación rápida, el desplazamiento continúa durante un tiempo después de soltar el toque. La solución es anular el método computeScroll(). Eche un vistazo a https://github.com/chrisjenx/ParallaxScrollView cómo se hace allí.

Answer 4

Usted puede echar un vistazo a este post: Link

lo que este hombre está haciendo realidad se crea ScrollViews personalizados y reemplaza el método onScrollChanged, añade un oyente y luego los sincroniza antes que se sienten atraídos por la pantalla .

Lo que puedes hacer ahora es agregar como fotograma principal a ScrollView en un HorizontalScrollView. La barra izquierda sería HorizontalScrollView, y la parte superior es ScrollView. A continuación, registra el ScrollView principal y el HorizontalScrollView principal en dos separados ScrollManagers (ver enlace arriba).

Luego deshabilite el desplazamiento de hsv y sv y agréguelos al ScrollManagers apropiado. Entonces todo debería funcionar bien.

-

PS. Si usara solo los oyentes y no el ScrollManager, tendría un retraso de sincronización de 1 fotograma.

Answer 5

He logrado el mismo diseño al hacer las cosas a continuación.

Encontrará SyncedScrollView en XML es ScrollView personalizado que se utiliza para sincronizar dos scrollviews.

Debe consultar a continuación dos respuestas de stackoverflow.

1. SynchedScrollView andig answer
2. optimizado cheque SynchedScrollView my answer

debajo 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> 

Cada célula es TextView aquí. lo que puede establecer dibujable fondo para dibujar cajas (Se parece a la tabla)

también usted puede añadir cabeceras izquierda, arriba encabezados y TextView cuerpo de forma dinámica para crear la tabla dinámica.

Ésta es captura de pantalla de diseño

Lo siento por mi Inglés pura.