android中心在tablayout

时间:2015-08-18 22:29:52

标签: android-viewpager android-tabs android-tablayout center-align

我正在使用android支持设计tablayout。这是我的代码:

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content""
        app:tabGravity="center"
        app:tabMode="scrollable"
        />

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

我的问题是标签始终左对齐。但是,我想将选定的选项卡居中(即使在开头,第一个(选定的)选项卡也应居中)。有没有办法做到这一点?感谢。

4 个答案:

答案 0 :(得分:14)

我看了一下TabLayout,tabContentStart只为其第一个孩子设置了填充 - &gt; SlidingTabStrip,所以我在两边手动设置:

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

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

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

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        super.onLayout(changed, l, t, r, b);
        View firstTab = ((ViewGroup)getChildAt(0)).getChildAt(0);
        View lastTab = ((ViewGroup)getChildAt(0)).getChildAt(((ViewGroup)getChildAt(0)).getChildCount()-1);
        ViewCompat.setPaddingRelative(getChildAt(0), (getWidth()/2) - (firstTab.getWidth()/2),0,(getWidth()/2) - (lastTab.getWidth()/2),0);
    }
}

TabLayout的第一个0索引子项是SlidingTabStrip。

答案 1 :(得分:5)

也许您正在寻找名为app:tabContentStart的xml属性。此属性允许您根据指定的值将活动选项卡向左推,该值在“dp”中设置(类似于左边缘的东西)。例如,尝试将代码放在这样:

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabMode="scrollable"
        app:tabContentStart="96dp"/> <-- Or whatever value you want here.

它并不完全以制表符为中心,但它会为您提供与Google Play商店标签类似的效果。

答案 2 :(得分:2)

public class MyTabLayout extends TabLayout {

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

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        super.onLayout(changed, l, t, r, b);
        if (!changed) return;
        int totalTabsWidth = 0;
        for (int i = 0; i < getTabCount(); i++)
            totalTabsWidth += ((ViewGroup) getChildAt(0)).getChildAt(i).getWidth();
        int padding = (getWidth() - totalTabsWidth) / 2;
        if (padding < 0) padding = 0;
        getChildAt(0).setPaddingRelative(padding, 0, padding, 0);
    }
}

答案 3 :(得分:0)

如果您的目标API为23或更高,请让我再分享一个选项以及SynerFlow建议的app:tabContentStart配置,这样可以让结尾标签居中而不是向左侧滑动滚动期间的边缘。但是,我仍然在23之前搞清楚API的方法。

final int TAB_CONTENT_START = 96;   

tabLayout.setOnScrollChangeListener(new View.OnScrollChangeListener() {

    @Override
    public void onScrollChange(View v, int scrollX, int scrollY, int oldScrollX, int oldScrollY) {

        final int maxAllowWidthOfTabBar = tabLayout.getMeasuredWidth() + TAB_CONTENT_START;
        if (scrollX > maxAllowWidthOfTabBar)
            tabLayout.setScrollX(maxAllowWidthOfTabBar);

    }
});