CODEWITHSUNDEEP
androidviewpagerindicatorandroid-tablayout
Anshul Tyagi
Anshul Tyagi

Reputation: 2196

How to change gravity of indicator of widget TabLayout in Android

Here I'm trying to change the position of TabIndicator to top from bottom but not getting success. I want just like as image is showing. I have done everything but indicator is in bottom not in top and even I can't add dividers between Tabs too. Please look at my code and help me to solve this issue.

My code is like:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

 <com.cws.widget.MyTabLayout
    android:id="@+id/mainTabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="1dp"
    app:tabBackground="@color/drawer_tab_background"
    app:tabGravity="fill"
    app:tabIndicatorColor="@color/green"
    app:tabMode="fixed" />


<com.cws.widget.NonSiwpablePager
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
</LinearLayout>

And styles.xml

<style name="AppCompatTheme" parent="Theme.AppCompat.Light.NoActionBar"></style>

<style name="AppToolbarTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="android:windowNoTitle">true</item>
    <item name="colorPrimary">#000</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="colorControlNormal">#FFF</item>
</style>

MyTabLayout.java

public class MyTabLayout extends TabLayout {
public MyTabLayout(Context context) {
    super(context);
}

public MyTabLayout(Context context, AttributeSet attrs) {
    super(context, attrs);
}

public MyTabLayout(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    int height = 0;
    for (int i = 0; i < getChildCount(); i++) {
        View child = getChildAt(i);
        child.measure(widthMeasureSpec, View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED));
        int h = child.getMeasuredHeight();
        if (h > height) height = h;
    }
    heightMeasureSpec = View.MeasureSpec.makeMeasureSpec(height, View.MeasureSpec.EXACTLY);
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);

}
}

ViewPager.java

public class NonSiwpablePager extends ViewPager {
public NonSiwpablePager(Context context) {
    super(context);
}

public NonSiwpablePager(Context context, AttributeSet attrs) {
    super(context, attrs);
}

@Override
public boolean onTouchEvent(MotionEvent ev) {
    return false;
}

@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
    return false;
}
}

Upvotes: 1

Views: 1923

Answers (1)

curiousMind
curiousMind

Reputation: 2812

Firstly you need to remove that tab indicator, 

app:tabIndicatorHeight="0dp"

this line add into <com.cws.widget.MyTabLayout> xml file. and after that add that http://pastie.org/private/5lsxm7l8qoay4naobuddow as background 

app:tabBackground="@drawable/selector_tab"

Hope it will work for you

Upvotes: 1

Related Questions