कैसे क्षैतिज recyclerview

Question

किसी भी विचार कैसे recyclerview सूची के लिए एक पेज सूचक बनाने के लिए के लिए एक पेज सूचक बनाने के लिए?

Answer 1

सबसे पहले आप हलकों के लिए एक और RecyclerView बना सकते हैं और पहले RecyclerView की OnScrollListener में इस कोड डाल करने के लिए की है।

int[] firstVisibleItemPositions = new int[appList.size()]; 
int[] lastVisibleItemPositions = new int[appList.size()]; 

int position = ((StaggeredGridLayoutManager) listView.getLayoutManager()).findFirstVisibleItemPositions(firstVisibleItemPositions)[0]; 
View currentView = circlesList.getChildAt(position); 
int lastPosition = ((StaggeredGridLayoutManager) listView.getLayoutManager()).findLastVisibleItemPositions(lastVisibleItemPositions)[0]; 
View lastView = circlesList.getChildAt(lastPosition); 
ImageView circle; 
if (dx>0) { 
    if (currentView != null && lastPosition != position) { 
     circle = (ImageView) currentView.findViewById(R.id.img); 
     circle.setImageResource(R.drawable.empty_circle); 
    } 
    if (lastView != null && lastPosition != position) { 
     circle = (ImageView) lastView.findViewById(R.id.img); 
     circle.setImageResource(R.drawable.selected_circle); 
    } 
}else if (dx<0){ 
    if (currentView != null && lastPosition != position) { 
     circle = (ImageView) currentView.findViewById(R.id.img); 
     circle.setImageResource(R.drawable.selected_circle); 
    } 
    if (lastView != null && lastPosition != position) { 
     circle = (ImageView) lastView.findViewById(R.id.img); 
     circle.setImageResource(R.drawable.empty_circle); 
    } 
} 

Answer 2

आप RecyclerView.ItemDecoration का उपयोग करके एक संकेतक जोड़ सकते हैं।

बस तल पर कुछ लाइनों या हलकों आकर्षित और layoutManager.findFirstVisibleItemPosition() का उपयोग मौजूदा सक्रिय आइटम प्राप्त करने के लिए। चूंकि पेजर पूरी चौड़ाई भरते हैं, इसलिए यह प्रदर्शित आइटम प्राप्त करने का एक अर्जित तरीका है। यह हमें माता-पिता को बाएं किनारे की तुलना करके स्क्रॉलिंग दूरी की गणना करने की अनुमति देता है।

आप नीचे एक नमूना सजावट है कि कुछ लाइनों आकर्षित करता है और उन दोनों के बीच एनिमेट होने

public class LinePagerIndicatorDecoration extends RecyclerView.ItemDecoration { 

    private int colorActive = 0xFFFFFFFF; 
    private int colorInactive = 0x66FFFFFF; 

    private static final float DP = Resources.getSystem().getDisplayMetrics().density; 

    /** 
    * Height of the space the indicator takes up at the bottom of the view. 
    */ 
    private final int mIndicatorHeight = (int) (DP * 16); 

    /** 
    * Indicator stroke width. 
    */ 
    private final float mIndicatorStrokeWidth = DP * 2; 

    /** 
    * Indicator width. 
    */ 
    private final float mIndicatorItemLength = DP * 16; 
    /** 
    * Padding between indicators. 
    */ 
    private final float mIndicatorItemPadding = DP * 4; 

    /** 
    * Some more natural animation interpolation 
    */ 
    private final Interpolator mInterpolator = new AccelerateDecelerateInterpolator(); 

    private final Paint mPaint = new Paint(); 

    public LinePagerIndicatorDecoration() { 
    mPaint.setStrokeCap(Paint.Cap.ROUND); 
    mPaint.setStrokeWidth(mIndicatorStrokeWidth); 
    mPaint.setStyle(Paint.Style.STROKE); 
    mPaint.setAntiAlias(true); 
    } 

    @Override 
    public void onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state) { 
    super.onDrawOver(c, parent, state); 

    int itemCount = parent.getAdapter().getItemCount(); 

    // center horizontally, calculate width and subtract half from center 
    float totalLength = mIndicatorItemLength * itemCount; 
    float paddingBetweenItems = Math.max(0, itemCount - 1) * mIndicatorItemPadding; 
    float indicatorTotalWidth = totalLength + paddingBetweenItems; 
    float indicatorStartX = (parent.getWidth() - indicatorTotalWidth)/2F; 

    // center vertically in the allotted space 
    float indicatorPosY = parent.getHeight() - mIndicatorHeight/2F; 

    drawInactiveIndicators(c, indicatorStartX, indicatorPosY, itemCount); 


    // find active page (which should be highlighted) 
    LinearLayoutManager layoutManager = (LinearLayoutManager) parent.getLayoutManager(); 
    int activePosition = layoutManager.findFirstVisibleItemPosition(); 
    if (activePosition == RecyclerView.NO_POSITION) { 
     return; 
    } 

    // find offset of active page (if the user is scrolling) 
    final View activeChild = layoutManager.findViewByPosition(activePosition); 
    int left = activeChild.getLeft(); 
    int width = activeChild.getWidth(); 

    // on swipe the active item will be positioned from [-width, 0] 
    // interpolate offset for smooth animation 
    float progress = mInterpolator.getInterpolation(left * -1/(float) width); 

    drawHighlights(c, indicatorStartX, indicatorPosY, activePosition, progress, itemCount); 
    } 

    private void drawInactiveIndicators(Canvas c, float indicatorStartX, float indicatorPosY, int itemCount) { 
    mPaint.setColor(colorInactive); 

    // width of item indicator including padding 
    final float itemWidth = mIndicatorItemLength + mIndicatorItemPadding; 

    float start = indicatorStartX; 
    for (int i = 0; i < itemCount; i++) { 
     // draw the line for every item 
     c.drawLine(start, indicatorPosY, start + mIndicatorItemLength, indicatorPosY, mPaint); 
     start += itemWidth; 
    } 
    } 

    private void drawHighlights(Canvas c, float indicatorStartX, float indicatorPosY, 
           int highlightPosition, float progress, int itemCount) { 
    mPaint.setColor(colorActive); 

    // width of item indicator including padding 
    final float itemWidth = mIndicatorItemLength + mIndicatorItemPadding; 

    if (progress == 0F) { 
     // no swipe, draw a normal indicator 
     float highlightStart = indicatorStartX + itemWidth * highlightPosition; 
     c.drawLine(highlightStart, indicatorPosY, 
      highlightStart + mIndicatorItemLength, indicatorPosY, mPaint); 
    } else { 
     float highlightStart = indicatorStartX + itemWidth * highlightPosition; 
     // calculate partial highlight 
     float partialLength = mIndicatorItemLength * progress; 

     // draw the cut off highlight 
     c.drawLine(highlightStart + partialLength, indicatorPosY, 
      highlightStart + mIndicatorItemLength, indicatorPosY, mPaint); 

     // draw the highlight overlapping to the next item as well 
     if (highlightPosition < itemCount - 1) { 
     highlightStart += itemWidth; 
     c.drawLine(highlightStart, indicatorPosY, 
      highlightStart + partialLength, indicatorPosY, mPaint); 
     } 
    } 
    } 

    @Override 
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) { 
    super.getItemOffsets(outRect, view, parent, state); 
    outRect.bottom = mIndicatorHeight; 
    } 
} 

कौन सा आप निम्नलिखित

---

की तरह एक परिणाम दे देंगे लगता है वहाँ भी एक है ब्लॉग पोस्ट कैसे सजावट काम करता है here और पूर्ण स्रोत कोड available at GitHub है के बारे में विस्तार में और अधिक हो जाता है

Answer 3

मैं एक ही जवाब है जो डेविड Medenjak द्वारा दिया जाता है, लेकिन recyclerview नीचे हलकों बनाने के लिए नकल की है। मैंने उपर्युक्त उत्तर में कोड की कुछ पंक्तियां अपडेट की हैं, कृपया एक नज़र डालें और तदनुसार उपयोग करें।

/** 
* Created by shobhan on 4/10/17. 
*/ 

public class CirclePagerIndicatorDecoration extends RecyclerView.ItemDecoration { 

    private int colorActive = 0x727272; 
    private int colorInactive = 0xF44336; 

    private static final float DP = Resources.getSystem().getDisplayMetrics().density; 

    /** 
    * Height of the space the indicator takes up at the bottom of the view. 
    */ 
    private final int mIndicatorHeight = (int) (DP * 16); 

    /** 
    * Indicator stroke width. 
    */ 
    private final float mIndicatorStrokeWidth = DP * 2; 

    /** 
    * Indicator width. 
    */ 
    private final float mIndicatorItemLength = DP * 16; 
    /** 
    * Padding between indicators. 
    */ 
    private final float mIndicatorItemPadding = DP * 4; 

    /** 
    * Some more natural animation interpolation 
    */ 
    private final Interpolator mInterpolator = new AccelerateDecelerateInterpolator(); 

    private final Paint mPaint = new Paint(); 

    public CirclePagerIndicatorDecoration() { 
     mPaint.setStrokeCap(Paint.Cap.ROUND); 
     mPaint.setStrokeWidth(mIndicatorStrokeWidth); 
     mPaint.setStyle(Paint.Style.FILL); 
     mPaint.setAntiAlias(true); 
    } 

    @Override 
    public void onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state) { 
     super.onDrawOver(c, parent, state); 

     int itemCount = parent.getAdapter().getItemCount(); 

     // center horizontally, calculate width and subtract half from center 
     float totalLength = mIndicatorItemLength * itemCount; 
     float paddingBetweenItems = Math.max(0, itemCount - 1) * mIndicatorItemPadding; 
     float indicatorTotalWidth = totalLength + paddingBetweenItems; 
     float indicatorStartX = (parent.getWidth() - indicatorTotalWidth)/2F; 

     // center vertically in the allotted space 
     float indicatorPosY = parent.getHeight() - mIndicatorHeight/2F; 

     drawInactiveIndicators(c, indicatorStartX, indicatorPosY, itemCount); 


     // find active page (which should be highlighted) 
     LinearLayoutManager layoutManager = (LinearLayoutManager) parent.getLayoutManager(); 
     int activePosition = layoutManager.findFirstVisibleItemPosition(); 
     if (activePosition == RecyclerView.NO_POSITION) { 
      return; 
     } 

     // find offset of active page (if the user is scrolling) 
     final View activeChild = layoutManager.findViewByPosition(activePosition); 
     int left = activeChild.getLeft(); 
     int width = activeChild.getWidth(); 

     // on swipe the active item will be positioned from [-width, 0] 
     // interpolate offset for smooth animation 
     float progress = mInterpolator.getInterpolation(left * -1/(float) width); 

     drawHighlights(c, indicatorStartX, indicatorPosY, activePosition, progress, itemCount); 
    } 

    private void drawInactiveIndicators(Canvas c, float indicatorStartX, float indicatorPosY, int itemCount) { 
     mPaint.setColor(Color.GRAY); 

     // width of item indicator including padding 
     final float itemWidth = mIndicatorItemLength + mIndicatorItemPadding; 

     float start = indicatorStartX; 
     for (int i = 0; i < itemCount; i++) { 
      // draw the line for every item 
      c.drawCircle(start + mIndicatorItemLength,indicatorPosY,itemWidth/6,mPaint); 
      // c.drawLine(start, indicatorPosY, start + mIndicatorItemLength, indicatorPosY, mPaint); 
      start += itemWidth; 
     } 
    } 

    private void drawHighlights(Canvas c, float indicatorStartX, float indicatorPosY, 
           int highlightPosition, float progress, int itemCount) { 
     mPaint.setColor(Color.RED); 

     // width of item indicator including padding 
     final float itemWidth = mIndicatorItemLength + mIndicatorItemPadding; 

     if (progress == 0F) { 
      // no swipe, draw a normal indicator 
      float highlightStart = indicatorStartX + itemWidth * highlightPosition; 
     /* c.drawLine(highlightStart, indicatorPosY, 
        highlightStart + mIndicatorItemLength, indicatorPosY, mPaint); 
     */ 
      c.drawCircle(highlightStart,indicatorPosY,itemWidth/6,mPaint); 

     } else { 
      float highlightStart = indicatorStartX + itemWidth * highlightPosition; 
      // calculate partial highlight 
      float partialLength = mIndicatorItemLength * progress; 
      c.drawCircle(highlightStart + mIndicatorItemLength,indicatorPosY,itemWidth/6,mPaint); 

      // draw the cut off highlight 
      /* c.drawLine(highlightStart + partialLength, indicatorPosY, 
        highlightStart + mIndicatorItemLength, indicatorPosY, mPaint); 
*/ 
      // draw the highlight overlapping to the next item as well 
      /* if (highlightPosition < itemCount - 1) { 
       highlightStart += itemWidth; 
       *//*c.drawLine(highlightStart, indicatorPosY, 
         highlightStart + partialLength, indicatorPosY, mPaint);*//* 
       c.drawCircle(highlightStart ,indicatorPosY,itemWidth/4,mPaint); 

      }*/ 
     } 
    } 

    @Override 
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) { 
     super.getItemOffsets(outRect, view, parent, state); 
     outRect.bottom = mIndicatorHeight; 
    } 
} 

और recyclerview करने के लिए इसे लागू करें, जैसे

Answer 4

मैं हलकों के लिए कोड बदल दिया है इस प्रकार है। कोड को रेखा खींचने के लिए हटा दिया गया है और इसे ड्रॉ सर्कल विधियों के साथ बदल दिया गया है। कृपया पूरा वर्ग नीचे खोजने के लिए:

सार्वजनिक वर्ग CirclePagerIndicatorDecoration फैली RecyclerView.ItemDecoration { निजी पूर्णांक colorActive = 0xDE000000; निजी int colorInactive = 0x33000000;

private static final float DP = Resources.getSystem().getDisplayMetrics().density; 

/** 
* Height of the space the indicator takes up at the bottom of the view. 
*/ 
private final int mIndicatorHeight = (int) (DP * 16); 

/** 
* Indicator stroke width. 
*/ 
private final float mIndicatorStrokeWidth = DP * 4; 

/** 
* Indicator width. 
*/ 
private final float mIndicatorItemLength = DP * 4; 
/** 
* Padding between indicators. 
*/ 
private final float mIndicatorItemPadding = DP * 8; 

/** 
* Some more natural animation interpolation 
*/ 
private final Interpolator mInterpolator = new AccelerateDecelerateInterpolator(); 

private final Paint mPaint = new Paint(); 

public CirclePagerIndicatorDecoration() { 

    mPaint.setStrokeWidth(mIndicatorStrokeWidth); 
    mPaint.setStyle(Paint.Style.STROKE); 
    mPaint.setAntiAlias(true); 
} 

@Override 
public void onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state) { 
    super.onDrawOver(c, parent, state); 

    int itemCount = parent.getAdapter().getItemCount(); 

    // center horizontally, calculate width and subtract half from center 
    float totalLength = mIndicatorItemLength * itemCount; 
    float paddingBetweenItems = Math.max(0, itemCount - 1) * mIndicatorItemPadding; 
    float indicatorTotalWidth = totalLength + paddingBetweenItems; 
    float indicatorStartX = (parent.getWidth() - indicatorTotalWidth)/2F; 

    // center vertically in the allotted space 
    float indicatorPosY = parent.getHeight() - mIndicatorHeight/2F; 

    drawInactiveIndicators(c, indicatorStartX, indicatorPosY, itemCount); 

    // find active page (which should be highlighted) 
    LinearLayoutManager layoutManager = (LinearLayoutManager) parent.getLayoutManager(); 
    int activePosition = layoutManager.findFirstVisibleItemPosition(); 
    if (activePosition == RecyclerView.NO_POSITION) { 
     return; 
    } 

    // find offset of active page (if the user is scrolling) 
    final View activeChild = layoutManager.findViewByPosition(activePosition); 
    int left = activeChild.getLeft(); 
    int width = activeChild.getWidth(); 
    int right = activeChild.getRight(); 

    // on swipe the active item will be positioned from [-width, 0] 
    // interpolate offset for smooth animation 
    float progress = mInterpolator.getInterpolation(left * -1/(float) width); 

    drawHighlights(c, indicatorStartX, indicatorPosY, activePosition, progress); 
} 

private void drawInactiveIndicators(Canvas c, float indicatorStartX, float indicatorPosY, int itemCount) { 
    mPaint.setColor(colorInactive); 

    // width of item indicator including padding 
    final float itemWidth = mIndicatorItemLength + mIndicatorItemPadding; 

    float start = indicatorStartX; 
    for (int i = 0; i < itemCount; i++) { 

     c.drawCircle(start, indicatorPosY, mIndicatorItemLength/2F, mPaint); 

     start += itemWidth; 
    } 
} 

private void drawHighlights(Canvas c, float indicatorStartX, float indicatorPosY, 
          int highlightPosition, float progress) { 
    mPaint.setColor(colorActive); 

    // width of item indicator including padding 
    final float itemWidth = mIndicatorItemLength + mIndicatorItemPadding; 

    if (progress == 0F) { 
     // no swipe, draw a normal indicator 
     float highlightStart = indicatorStartX + itemWidth * highlightPosition; 

     c.drawCircle(highlightStart, indicatorPosY, mIndicatorItemLength/2F, mPaint); 

    } else { 
     float highlightStart = indicatorStartX + itemWidth * highlightPosition; 
     // calculate partial highlight 
     float partialLength = mIndicatorItemLength * progress + mIndicatorItemPadding*progress; 

     c.drawCircle(highlightStart + partialLength, indicatorPosY, mIndicatorItemLength/2F, mPaint); 
    } 
} 

@Override 
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) { 
    super.getItemOffsets(outRect, view, parent, state); 
    outRect.bottom = mIndicatorHeight; 
} 

}

कई धन्यवाद, पौंड गुप्ता मुबारक कोडिंग !!!!! RecyclerView indicator:

Answer 5

किसी के मामले में जरूरत है, मैं (खोज का एक बहुत बाद) इस बात के लिए अपने खुद के पुस्तकालय लिखा था। यहां बताया गया है कि आप इसे कैसे करते हैं:

<com.kingfisher.easyviewindicator.RecyclerViewIndicator 
    android:id="@+id/circleIndicator" 
    android:layout_width="match_parent" 
    android:layout_height="20dp" 
    app:avi_animation_enable="true" 
    app:avi_drawable="@drawable/blue_radius" 
    app:avi_drawable_unselected="@drawable/gray_radius" 
    app:avi_height="10dp" 
    app:avi_margin="10dp" 
    app:avi_width="10dp" 
    app:layout_constraintTop_toBottomOf="@+id/recyclerView"> 

</com.kingfisher.easyviewindicator.RecyclerViewIndicator> 
// In code: 
recyclerView.setAdapter(new TestAdapter()); 
recyclerViewIndicator.setRecyclerView(recyclerView);