電商首頁選單模組，可以橫向滑動，底部的滑動位置指示器該如何實現呢？

實現思路：

1.上方橫滑列表可以直接使用RecyclerView實現；

2.下方的指示器：

（1）.計算出RecyclerView劃出螢幕的距離w1和剩餘寬度w2的比例y，y = w1 / （總寬度w3 - 可使視區域寬度w4）；

（2）.計算出指示器該移動的距離w5= y * （指示器的總寬度w6- 滑塊寬度w7）；

（3）.指示器佈局實現：

<RelativeLayout
    android:id="@ id/parent_layout"
    android:layout_marginTop="10dp"
    android:layout_width="80dp"
    android:layout_height="4dp"
    android:layout_gravity="center"
    android:background="@drawable/bg_store_classify_normal">

    <View
      android:id="@ id/main_line"
      android:layout_width="40dp"
      android:layout_height="4dp"
      android:layout_centerVertical="true"
      android:background="@drawable/bg_store_classify_selected" />
</RelativeLayout>

（4）.程式碼呼叫：

rcvClassifyTypes.addOnScrollListener(new RecyclerView.OnScrollListener() {
  @Override
  public void onScrollStateChanged(RecyclerView recyclerView,int newState) {
    super.onScrollStateChanged(recyclerView,newState);
 
  }
 
  @Override
  public void onScrolled(RecyclerView recyclerView,int dx,int dy) {
    super.onScrolled(recyclerView,dx,dy);
    //整體的總寬度，注意是整體，包括在顯示區域之外的
    //滾動條表示的總範圍
    int temp = rcvClassifyTypes.computeHorizontalScrollRange();
    if (temp > range) {
      range = temp;
    }
    //滑塊的偏移量
    int offset = rcvClassifyTypes.computeHorizontalScrollOffset();
    //可視區域長度
    int extent = rcvClassifyTypes.computeHorizontalScrollExtent();
    //滑出部分在剩餘範圍的比例
    float proportion = (float) (offset * 1.0 / (range - extent));
    //計算滾動條寬度
    float transMaxRange = parentLayout.getWidth() - childline.getWidth();
    //設定滾動條移動
    childline.setTranslationX(transMaxRange * proportion);
  }
});

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援我們。