Search code examples
androidandroid-tabhostandroid-tabsandroid-design-library

Tab with icon using TabLayout in Android Design Library


I'm trying to use the new TabLayout in the android design library to create app bar with icons only.

like this: enter image description here

how can I do it using the new TabLayout Android Design Library.

is there a simple solution for this, or i have to use the setCustomView only. i'm trying to avoid using it. because i didn't get the tint color for the icon like this image above.

i try to write like this:

tabLayout.addTab(tabLayout.newTab().setIcon(R.drawable.ic_dashboard))

but the icon still stay in the same color when i select the tab


Solution

  • i solved it like this:

    tint_tab.xml

    <com.hannesdorfmann.appkit.image.TintableImageView
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     app:tint="@color/tab_color_selector"/>
    

    in you java code

    TintableImageView tab1 = (TintableImageView) LayoutInflater.from(this).inflate(R.layout.tint_tab, null);
    tab1.setImageResource(R.drawable.ic_dummy);
    mTabLayout.getTabAt(0).setCustomView(tab1)
    

    ref: https://github.com/sockeqwe/appkit/blob/master/image/src/main/java/com/hannesdorfmann/appkit/image/TintableImageView.java