Android imitation Tik Tok sliding layout up and down

  • 2021-11-14 07:08:01
  • OfStack

Vibrato slides up and down, monitors and plays, and automatically absorbs the top and bottom for your reference. The specific contents are as follows

Implementation using RecyclerView+PagerSnapHelper


public class DouYinLayoutManager extends LinearLayoutManager implements RecyclerView.OnChildAttachStateChangeListener{
  // Judge whether to slide up or down 
  private int mDrift;
  private OnViewPagerListener onViewPagerListener;
  // Ceiling and bottom suction 
  private PagerSnapHelper pagerSnapHelper;

  public OnViewPagerListener getOnViewPagerListener() {
    return onViewPagerListener;
  }

  public void setOnViewPagerListener(OnViewPagerListener onViewPagerListener) {
    this.onViewPagerListener = onViewPagerListener;
  }

  public DouYinLayoutManager(Context context) {
    super(context);
  }

  public DouYinLayoutManager(Context context, int orientation, boolean reverseLayout) {
    super(context, orientation, reverseLayout);
    pagerSnapHelper = new PagerSnapHelper();
  }

  /**
   *  When manager Completely add to recycleview Will be called in 
   * @param view
   */
  @Override
  public void onAttachedToWindow(RecyclerView view) {
    view.addOnChildAttachStateChangeListener(this);
    pagerSnapHelper.attachToRecyclerView(view);
    super.onAttachedToWindow(view);
  }

  @Override
  public boolean canScrollVertically() {
    return super.canScrollVertically();
  }

  @Override
  public int scrollVerticallyBy(int dy, RecyclerView.Recycler recycler, RecyclerView.State state) {
    mDrift = dy;
    return super.scrollVerticallyBy(dy, recycler, state);

  }

  @Override
  public void onChildViewAttachedToWindow(@NonNull View view) {
    if (mDrift > 0){
      // Slide upwards 
      if (onViewPagerListener != null && Math.abs(mDrift) == view.getHeight()){
        onViewPagerListener.onPageSelected(false,view);
      }
    }else {
      // Slide downwards 
      if (onViewPagerListener != null && Math.abs(mDrift) == view.getHeight()){
        onViewPagerListener.onPageSelected(true,view);
      }
    }
  }

  @Override
  public void onChildViewDetachedFromWindow(@NonNull View view) {
    if (mDrift >= 0){
      // Slide upwards 
      if (onViewPagerListener != null){
        onViewPagerListener.onPageRelease(true,view);
      }
    }else {
      // Slide downwards 
      if (onViewPagerListener != null){
        onViewPagerListener.onPageRelease(false,view);
      }
    }
  }

  @Override
  public void onScrollStateChanged(int state) {
    switch (state){
      case RecyclerView.SCROLL_STATE_IDLE:
        // Currently displayed item
        View snapView = pagerSnapHelper.findSnapView(this);
        if (onViewPagerListener != null){
          onViewPagerListener.onPageSelected(false,snapView);
        }
        break;
    }
    super.onScrollStateChanged(state);

  }
}

recyclerView. setLayoutManager () will do


recyclerView = findViewById(R.id.recyclerView_dy);
    douYinLayoutManager = new DouYinLayoutManager(this, OrientationHelper.VERTICAL,false);
    recyclerView.setLayoutManager(douYinLayoutManager);
    recyclerView.setAdapter(new MyAdapter());

    douYinLayoutManager.setOnViewPagerListener(new OnViewPagerListener() {
      @Override
      public void onPageRelease(boolean isNest, View position) {
        releaseVideo(position);
      }

      @Override
      public void onPageSelected(boolean isButten, View position) {
        playVideo(position);
      }
    });
  }

Code: MyUiDemo


Related articles: