Synchronisation de deux ScrollView

Question

Situation : J'ai deux ScrollView à l'intérieur de chacun des deux HorizontalScrollView d'un TableRow.

Objectif : Lorsque je fais glisser l'un des ScrollView, un autre ScrollView doit défiler autant. Par exemple, si j'ai une liste de noms dans le ScrollView de gauche et les numéros de téléphone correspondants dans le ScrollView de droite, le défilement d'un ScrollView ne doit pas détruire la délimitation originale entre les noms et les numéros de téléphone.

Peut-on l'implémenter avec onTouchEvent ? Si oui, comment dois-je l'implémenter (sur les deux ou l'un des ScrollViews) ?

Aidez-moi s'il vous plaît, gourous d'Android !

Answer 1

J'ai une solution simple qui fonctionne pour moi :

• sous-classe à la fois ScrollView et de remplacer leurs onScrollChanged événement pour mettre à jour ScrollManager lorsque le défilement change :

  public interface ScrollNotifier {   
      public void setScrollListener(ScrollListener scrollListener);
  
      public ScrollListener getScrollListener();
  }
  
  public class SyncedScrollView extends ScrollView implements ScrollNotifier {
  
      //...
  
      private ScrollListener scrollListener = null;
  
      @Override
      protected void onScrollChanged(int l, int t, int oldl, int oldt) {
          super.onScrollChanged(l, t, oldl, oldt);
          if (scrollListener != null)
              scrollListener.onScrollChanged(this, l, t, oldl, oldt);
      }
      @Override
      public void setScrollListener(ScrollListener scrollListener) {
          this.scrollListener = scrollListener;
      }
      @Override
      public ScrollListener getScrollListener() {
          return scrollListener;
      }
  }

• créer un ScrollManager classe qui coordonne le défilement de plusieurs participants

  public interface ScrollListener {
      void onScrollChanged(View syncedScrollView, int l, int t, int oldl,
          int oldt);
  }
  
  public class ScrollManager implements ScrollListener {
      private static final int SCROLL_HORIZONTAL = 1;
      private static final int SCROLL_VERTICAL = 2;
  
      private ArrayList<ScrollNotifier> clients = new ArrayList<ScrollNotifier>(4);
  
      private volatile boolean isSyncing = false;
      private int scrollType = SCROLL_HORIZONTAL;
  
      public void addScrollClient(ScrollNotifier client) {
          clients.add(client);
          client.setScrollListener(this);
      }
  
      // TODO fix dependency on all views being of equal horizontal/ vertical
      // dimensions
      @Override
      public void onScrollChanged(View sender, int l, int t, int oldl, int oldt) {
          // avoid notifications while scroll bars are being synchronized
          if (isSyncing) {
              return;
          }
  
          isSyncing = true;
  
          // remember scroll type
          if (l != oldl) {
              scrollType = SCROLL_HORIZONTAL;
          } else if (t != oldt) {
              scrollType = SCROLL_VERTICAL;
          } else {
              // not sure why this should happen
              isSyncing = false;
              return;
          }
  
          // update clients
          for (ScrollNotifier client : clients) {
              View view = (View) client;
              // don't update sender
              if (view == sender) {
                  continue;
              }
  
              // scroll relevant views only
              // TODO Add support for horizontal ListViews - currently weird things happen when ListView is being scrolled horizontally
              if ((scrollType == SCROLL_HORIZONTAL && view instanceof HorizontalScrollView)
                      || (scrollType == SCROLL_VERTICAL && view instanceof ScrollView)
                      || (scrollType == SCROLL_VERTICAL && view instanceof ListView)) {
                  view.scrollTo(l, t);
              }
          }
  
          isSyncing = false;
      }
  }

• créez la personnalisation ScrollView et définir les ScrollManager pour une notification sur les deux

  private void setupScrolling() {
      ScrollNotifier view;
      ScrollManager scrollManager = new ScrollManager();
  
      // timeline horizontal scroller
      view = (ScrollNotifier) findViewById(R.id.epgtimeline_container);
      scrollManager.addScrollClient(view);
  
      // services vertical scroller
      view = (ScrollNotifier) findViewById(R.id.epgservices_container);
      scrollManager.addScrollClient(view);
  
      // content area scrollers
      view = (ScrollNotifier) findViewById(R.id.epgevents_container_inner);
      scrollManager.addScrollClient(view);
      view = (ScrollNotifier) findViewById(R.id.epgevents_container_outer);
      scrollManager.addScrollClient(view);
  }

Answer 2

Merci à andig pour une si grande solution de synchronisation de scrollview .

Mais il y a un petit décalage entre les deux scrollviews lors de la projection.

J'écris donc ici une solution étendue pour supprimer ce décalage entre les deux scrollviews.

J'ai simplement utilisé la classe OverScroller et géré manuellement l'événement fling dans SyncedScrollView.

Il suffit de remplacer SyncedScrollView par le code ci-dessous. Utilisez d'autres classes de La solution d'andig

import android.content.Context;
import android.support.v4.view.ViewCompat;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.OverScroller;
import android.widget.ScrollView;

/**
 * Created by mitul.varmora on 11/7/2016.
 * SyncedScrollView
 * https://stackoverflow.com/questions/3527119/sync-two-scrollview
 */
public class SyncedScrollView extends ScrollView implements ScrollNotifier {

    private ScrollListener scrollListener = null;

    private OverScroller scroller;
    private Runnable scrollerTaskRunnable;

    public SyncedScrollView(Context context) {
        super(context);
        init();
    }

    public SyncedScrollView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public SyncedScrollView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {

        scroller = new OverScroller(getContext());
        scrollerTaskRunnable = new Runnable() {
            @Override
            public void run() {
                scroller.computeScrollOffset();

                smoothScrollTo(0, scroller.getCurrY());

                if (!scroller.isFinished()) {
                    SyncedScrollView.this.post(this);
                } else {
                    //deceleration ends here, do your code
                    ViewCompat.postInvalidateOnAnimation(SyncedScrollView.this);
                }
            }
        };
    }

    @Override
    protected void onScrollChanged(int l, int t, int oldl, int oldt) {
        super.onScrollChanged(l, t, oldl, oldt);
        if (scrollListener != null)
            scrollListener.onScrollChanged(this, l, t, oldl, oldt);
    }

    @Override
    public ScrollListener getScrollListener() {
        return scrollListener;
    }

    @Override
    public void setScrollListener(ScrollListener scrollListener) {
        this.scrollListener = scrollListener;
    }

    @Override
    public void fling(int velocityY) {

        scroller.forceFinished(true);
        scroller.fling(getScrollX(), getScrollY(), 0, velocityY, 0, 0, 0, getChildAt(0).getHeight());
        post(scrollerTaskRunnable);
    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
//        return super.onTouchEvent(ev);
        boolean eventConsumed = super.onTouchEvent(ev);
        if (eventConsumed && ev.getAction() == MotionEvent.ACTION_UP) {
            if (scroller.isFinished()) {
                //do your code
            }
        }
        return eventConsumed;
    }
}