Android recyclerView橫條指示器實現(xiàn)淘寶菜單模塊

更新時間：2020年02月28日 08:45:12 作者：一般的帥gg

這篇文章主要為大家詳細(xì)介紹了recyclerView橫條指示器實現(xiàn)淘寶菜單模塊，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下

電商首頁菜單模塊，可以橫向滑動，底部的滑動位置指示器該如何實現(xiàn)呢？

實現(xiàn)思路：

1.上方橫滑列表可以直接使用RecyclerView實現(xiàn)；

2.下方的指示器：

（1）.計算出RecyclerView劃出屏幕的距離w1和剩余寬度w2的比例y，y = w1 / （總寬度w3 - 可使視區(qū)域?qū)挾葁4）；

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

（3）.指示器布局實現(xiàn)：

<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）.代碼調(diào)用：

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);
  //整體的總寬度，注意是整體，包括在顯示區(qū)域之外的
  //滾動條表示的總范圍
  int temp = rcvClassifyTypes.computeHorizontalScrollRange();
  if (temp > range) {
   range = temp;
  }
  //滑塊的偏移量
  int offset = rcvClassifyTypes.computeHorizontalScrollOffset();
  //可視區(qū)域長度
  int extent = rcvClassifyTypes.computeHorizontalScrollExtent();
  //滑出部分在剩余范圍的比例
  float proportion = (float) (offset * 1.0 / (range - extent));
  //計算滾動條寬度
  float transMaxRange = parentLayout.getWidth() - childline.getWidth();
  //設(shè)置滾動條移動
  childline.setTranslationX(transMaxRange * proportion);
 }
});

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: