Bubble Tab Animation Library Android

4
525
Bubble Tab animation library Android
Bubble Tab animation library Android

Today trend for making android app with all content in single page by using Tab and today in this article you can learn how to add bubble tab animation library android with put some bubble in your tabs and give your apps a supa fresh style !

Usage

Bubble Tab animation library Android
Bubble Tab animation

Download

In your module

compile 'com.github.florent37:bubbletab:1.0.0'

Add a BubbleTab with your icons on the layout.xml

Customisable parameters :

  • circleColor
  • circleRatio
  • image(0-10)
<com.github.florent37.bubbletab.BubbleTab
        android:id="@+id/bubbleTab"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:clipToPadding="false"
        android:background="@android:color/white"
        android:elevation="10dp"

        app:bubbleTab_circleColor="@color/colorAccent"
        app:bubbleTab_circleRatio="1.25"
        app:bubbleTab_image0="@drawable/ic_home"
        app:bubbleTab_image1="@drawable/ic_account"
        app:bubbleTab_image2="@drawable/ic_event"
        app:bubbleTab_image3="@drawable/ic_search"
        app:bubbleTab_image4="@drawable/ic_query"
        />

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

Then bound it with your viewPager

bubbleTab.setupWithViewPager(viewPager);

Customisation

To display your home icon with a different color / content if selected / unselected

Add a different drawable into bubbleTab_image0Colored

<com.github.florent37.bubbletab.BubbleTab
        
        app:bubbleTab_image0="@drawable/ìc_normal"
        app:bubbleTab_image0Colored="@drawable/ic_selected"

Hope you enjoyed!! Please comment below.

 

Share your thoughts

4 COMMENTS

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