代码之家 › 专栏 › 技术社区 › Anton Shkurenko

选项卡之间的间距TabPageIndicator

viewpagerindicator android-viewpager tabs xml android

Anton Shkurenko · 技术社区 · 9 年前

我正在尝试实现我的设计师为我做的设计。

我无法将compoundDrawable移到文本附近(设置填充属性可以将其移得很远,但即使是0dp也不能使其靠近),并且我无法使制表符之间的间距保持恒定宽度。

下面是我得到的(不要看字体、文本颜色、下划线大小,目前正在开发中):

但我遇到了定制Jake‘s Wharton的麻烦 library

这里有一个几乎相同的问题: Space between elements of the indicator

<style name="SkillsPageIndicator" parent="Widget.TabPageIndicator">
        <item name="android:background">@drawable/tab_underline_indicator</item>
        <item name="android:textSize">@dimen/text_size_medium</item>
        <item name="android:paddingTop">35dp</item>
        <item name="android:paddingBottom">16dp</item>
        <item name="android:drawablePadding">0dp</item>
        <item name="android:gravity">center</item>
        <item name="android:width">100dp</item>
</style>

1 回复 | 直到 8 年前

Anton Shkurenko 9 年前

我编写了不那么干净的代码,但它对我很有用。我在这里分享它,以帮助任何需要它的人:

更改TabPageIndicator.addTab中的代码:

private void addTab(int index, CharSequence text, int iconResId) {
        final TabView tabView = new TabView(getContext());
        tabView.mIndex = index;
        tabView.setFocusable(true);
        tabView.setOnClickListener(mTabClickListener);
        tabView.setText(text);

        /**
         *  My parts (CullyCross):
         */

        Resources r = getResources();
        DisplayMetrics metrics = r.getDisplayMetrics();
        float screenWidth  = metrics.widthPixels;

        float width = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 100, metrics);
        int margin = (int)(screenWidth - 2 * width) / 4;

        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams((int)width, MATCH_PARENT);
        params.setMargins(margin, 0, margin, 0);


        /***********************/

        if (iconResId != 0) {
            tabView.setCompoundDrawablesWithIntrinsicBounds(iconResId, 0, 0, 0);
        }

        /**
         * original
         * mTabLayout.addView(tabView, new LinearLayout.LayoutParams(0, MATCH_PARENT, 1));
         */

        mTabLayout.addView(tabView, params);
    }