Git Product home page Git Product logo

circulerautoscrollingrecyclerview's Introduction

Circular auto scrolling RecyclerView

This is the implemention of a circular auto scrolling RecyclerView using Kotlin and RxJava

gif

Circular RecyclerView

A basic idea behind a circular view is to looping back to the same item in a different element of an array. The diagram below explains how. Let's say there are 3 items(item1, item2, item3) in our array. Since the array only need the first and last elements of its content, the logic can be more efficient by appending the first element to the end of the array and adding the last element to the front of the array.

img2

Auto scrolling

To make RecyclerView auto scroll, we have to call smoothScrollToPosition every specified interval of time. We can use Flowable.interval to emit sequential Long value. To stop auto scroll if a user swipes RecyclerView, we can listen to the scroll state change.

circulerautoscrollingrecyclerview's People

Contributors

tomoima525 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

circulerautoscrollingrecyclerview's Issues

How to add ItemDecorator ?

Hi,
I found quite useful, thanks so much,
I tried to use your code ,I have noticed that the item count in adapter = item.count + 2 (the first and the last one) I wanted to have itemdecorator and I used the one I have in my project which is working as expected, but as I used it here, the dots count become +2 as expected,
I set the itemcount in ItemDecorator -2
and some code but it crashes. Here is my code.
Please have a look .
I have changed the code here commenting the code which I has previously

//itemCount = parent.adapter.itemCount
itemCount = parent.adapter.itemCount-2

// val activePosition = layoutManager.findFirstVisibleItemPosition()
var activePosition = layoutManager.findFirstVisibleItemPosition()
if (layoutManager.findFirstVisibleItemPosition() > 0 && layoutManager.findFirstVisibleItemPosition() % (itemCount ) == 0) {
activePosition = 1
}

`
import android.content.Context
import android.content.res.Resources
import android.graphics.Canvas
import android.graphics.Paint
import android.graphics.Rect
import android.support.v7.widget.LinearLayoutManager
import android.support.v7.widget.RecyclerView
import android.util.Log
import android.view.View
import android.view.animation.AccelerateDecelerateInterpolator

class CirclePagerIndicatorDecoration(val context: Context, private val colorActive: Int, private val colorInactive: Int, private var itemCount: Int = 0) : RecyclerView.ItemDecoration() {

private val indicatorHeight = (DP * 16).toInt()
private val bottomMargin = (DP * 16).toInt()
private val indicatorStrokeWidth = DP * 2
private val indicatorItemLength = DP * 16
private val indicatorItemPadding = DP * 2
private val interpolator = AccelerateDecelerateInterpolator()

private val paint = Paint()

init {
paint.strokeCap = Paint.Cap.ROUND
paint.strokeWidth = indicatorStrokeWidth
paint.style = Paint.Style.FILL
paint.isAntiAlias = true
}

override fun onDrawOver(c: Canvas, parent: RecyclerView, state: RecyclerView.State) {
super.onDrawOver(c, parent, state)
//itemCount = parent.adapter.itemCount
itemCount = parent.adapter.itemCount-2

`
// center horizontally, calculate width and subtract half from center
val totalLength = indicatorItemLength * itemCount
val paddingBetweenItems = Math.max(0, itemCount - 1) * indicatorItemPadding
val indicatorTotalWidth = totalLength + paddingBetweenItems
val indicatorStartX = (parent.width - indicatorTotalWidth) / 2f
val indicatorPosY = parent.height - bottomMargin - indicatorHeight / 2f
drawInactiveIndicators(c, indicatorStartX, indicatorPosY, itemCount)

val layoutManager = parent.layoutManager as LinearLayoutManager

// val activePosition = layoutManager.findFirstVisibleItemPosition()

var activePosition = layoutManager.findFirstVisibleItemPosition()
if (layoutManager.findFirstVisibleItemPosition() > 0 && layoutManager.findFirstVisibleItemPosition() % (itemCount ) == 0) {
  activePosition = 1
}
val activeChild = layoutManager.findViewByPosition(activePosition)
if (activePosition == RecyclerView.NO_POSITION) {
  return
}

val left = activeChild.left
val width = activeChild.width
val progress = interpolator.getInterpolation(left * -1 / width.toFloat())

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

}

private fun drawInactiveIndicators(c: Canvas, indicatorStartX: Float, indicatorPosY: Float, itemCount: Int) {
paint.color = colorInactive

// width of item indicator including padding
val itemWidth = indicatorItemLength + indicatorItemPadding

var start = indicatorStartX
for (i in 0 until itemCount) {
  c.drawCircle(start + indicatorItemLength / 2, indicatorPosY, itemWidth / 5, paint)
  start += itemWidth
}

}

private fun drawHighlights(c: Canvas, indicatorStartX: Float, indicatorPosY: Float,
highlightPosition: Int, progress: Float, itemCount: Int) {
paint.color = colorActive
val itemWidth = indicatorItemLength + indicatorItemPadding

if (progress == 0f) {
  val highlightStart = indicatorStartX + itemWidth * highlightPosition
  c.drawCircle(highlightStart + indicatorItemLength / 2, indicatorPosY, itemWidth / 5, paint)
} else {
  val highlightStart = indicatorStartX + itemWidth * highlightPosition
  val partialLength = (indicatorItemLength) * progress
  c.drawCircle(highlightStart + partialLength + indicatorItemLength / 2, indicatorPosY, itemWidth / 5, paint)
}

}

override fun getItemOffsets(outRect: Rect, view: View, parent: RecyclerView, state: RecyclerView.State) {
super.getItemOffsets(outRect, view, parent, state)
outRect.bottom = indicatorHeight
}

companion object {
private val DP = Resources.getSystem().displayMetrics.density
}
}`

Its a Circular Scrolling View !

Can I fetch new data if the scrolling finish a round?
Meaning If Round 1 finish at the next 2nd Round it will fetch a new data.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.