Creative View Pager easy to use ! This view pager library combines a header list which is scrolling automatically in coordination with the page contents.

We already discuss some Creative View Pager animation library like :

But today i am going to show an animation library that looks like the top bubbles scrolling with the pages content. See the demo :

Demo : Creative View Pager animation library
Demo : Creative View Pager animation library

Let move to implementation part of Creative View Pager Android Library:


dependencies {
    implementation 'com.tbuonomo:creative-viewpager:1.0.1'


In your XML layout

Add CreativeViewPager in your activity’s layout


You will see a fake preview in Android Studio of the creative view.

Custom XML Attributes

Attribute Description
contentHorizontalPadding The start and end padding in dp of the content pages relative to the parent layout (by default 32dp)
contentItemMargin Margin in dp of each content item (by default 8dp)
headerItemMargin Margin in dp of each header item (by default 8dp)
headerItemSize The size in dp of the header items (by default 92dp)


Create your own adapter extending CreativeViewAdapter

class NatureCreativePagerAdapter(val context: Context) : CreativePagerAdapter

By default, you have to override the 3 methods instantiateHeaderIteminstantiateContentItem and getCount.

override fun instantiateHeaderItem(inflater: LayoutInflater, container: ViewGroup, position: Int): View {
    // Inflate page layout
    val headerRoot = inflater.inflate(R.layout.item_creative_content_nature, container, false)

    // Bind the views
    val title: TextView = headerRoot.findViewById(
    val image: ImageView = headerRoot.findViewById(

    title.text = context.getString(R.string.item_nature_title, position)

    return headerRoot

  override fun instantiateContentItem(inflater: LayoutInflater, container: ViewGroup, position: Int): View {
    // Inflate the header view layout
    val contentRoot = inflater.inflate(R.layout.item_creative_header_profile, container,

    // Bind the views
    val imageView = contentRoot.findViewById<ImageView>(

    imageView.setImageDrawable(ContextCompat.getDrawable(context, NatureItem.values()[position].userDrawable))
    return contentRoot

  override fun getCount(): Int {
    return NatureItem.values().size

If you want to have the cool colored background effect when you’re sliding the view pager, you have to override the two methods and provide the bitmap used for specific position.

override fun isUpdatingBackgroundColor(): Boolean {
    return true

  override fun requestBitmapAtPosition(position: Int): Bitmap? {
    // Return the bitmap used for the position
    return BitmapFactory.decodeResource(context.resources,

App demo

Two Invites App : Creative View Pager animation library
Two Invites App : Creative View Pager animation library

In your Activity / Fragment

Finally, set your adapter to the CreativeViewPager in your activity or fragment.


Don’t forget to star the project if you like it! star == heart

By Tell Me How

It is a technology blog and admin has excellent experience in programming from 5+ year. You can contact us at

Share your thoughts

3 thoughts on “Creative View Pager Android Animation Library”
  1. Hi @TellMeHow,

    Thanks for your interest in my library!
    You can check out this other library for displaying cool dots indicators for ViewPager.

    Best regards.

Leave a Reply

Loading Facebook Comments ...
Loading Disqus Comments ...