Tabview with background images in android

Question

sorry for my bad English ,I am create Tabs similar to whats app but how to place image background in between tab and app name when i select any tab separate image image can be visible please help me any one sample image below i need like this any one tell me please

i am create tab view its working fine it just like whats app but i want like above image ,how to convert my tab like above images@koutuk — chanti shruthi, Dec 16 '15 at 05:22
Possible duplicate of [How to set the divider between Tabs in TabLayout of design support library?](http://stackoverflow.com/questions/32204184/how-to-set-the-divider-between-tabs-in-tablayout-of-design-support-library) — pRaNaY, Dec 16 '15 at 06:17
i using two classes for getting tab views SliddeTabLayout and SlideTabStrip@piyush Gupta — chanti shruthi, Dec 16 '15 at 06:25

Bhavesh Desai · Answer 1 · 2015-12-16T06:11:20.653

Try this

set your image in AppBarLayout background.

and replace your content layout xml file.

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.lcom53.toolbarapp.MainActivity">

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay"
    android:background="@drawable/photo"
    app:elevation="0dp">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        app:layout_scrollFlags="scroll|enterAlways"
        app:popupTheme="@style/AppTheme.PopupOverlay"
        app:elevation="0dp">


    </android.support.v7.widget.Toolbar>
    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="15dp"
        app:tabSelectedTextColor="#FFFFFF"
        app:tabTextAppearance="@style/MyCustomTabLayout" />
</android.support.design.widget.AppBarLayout>

<include layout="@layout/content_main" />
</android.support.design.widget.CoordinatorLayout>

Srikanth · Answer 2 · 2015-12-16T06:49:12.803

0

Add android:background="#00000000" or android:background="@drawable/img_transparent" in your appbar like this:

 <android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#00000000"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

edited Dec 16 '15 at 06:49

answered Dec 16 '15 at 06:41

Srikanth

1,555
12
20

Tabview with background images in android

2 Answers2