Android 开发 Tip 11 -- TabLayout 设置文字大小一致

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/crazy1235/article/details/71425135

转载请注明出处:http://blog.csdn.net/crazy1235/article/details/71425135


使用TabLayout的时候,有些tab的文字比较多时,会出现与其他tab的文字大小不一致的情况!

这里写图片描述


TabLayout 继承自 HorizontalScrollView

内部有几个关键的类:

  • SlidingTabStrip – TabLayout的唯一子View

  • Tab – 子item的实体类,包含text, icon, customView等属性

  • TabView – 每个Tab的布局

  • ViewPagerOnTabSelectedListener – – 监听滑动

  • TabLayoutOnPageChangeListener – 监听滑动


关于每个tab的文字大小的设置关键代码就在 TabView.onMeasure() 之中!

@Override
        public void onMeasure(final int origWidthMeasureSpec, final int origHeightMeasureSpec) {
            // ...

            // We need to switch the text size based on whether the text is spanning 2 lines or not
            if (mTextView != null) {
                final Resources res = getResources();
                float textSize = mTabTextSize;
                int maxLines = mDefaultMaxLines;

                if (mIconView != null && mIconView.getVisibility() == VISIBLE) {
                    // If the icon view is being displayed, we limit the text to 1 line
                    maxLines = 1;
                } else if (mTextView != null && mTextView.getLineCount() > 1) {
                    // Otherwise when we have text which wraps we reduce the text size
                    textSize = mTabTextMultiLineSize;
                }

                final float curTextSize = mTextView.getTextSize();
                final int curLineCount = mTextView.getLineCount();
                final int curMaxLines = TextViewCompat.getMaxLines(mTextView);

                if (textSize != curTextSize || (curMaxLines >= 0 && maxLines != curMaxLines)) {
                    // We've got a new text size and/or max lines...
                    boolean updateTextView = true;

                    if (mMode == MODE_FIXED && textSize > curTextSize && curLineCount == 1) {
                        // If we're in fixed mode, going up in text size and currently have 1 line
                        // then it's very easy to get into an infinite recursion.
                        // To combat that we check to see if the change in text size
                        // will cause a line count change. If so, abort the size change and stick
                        // to the smaller size.
                        final Layout layout = mTextView.getLayout();
                        if (layout == null || approximateLineWidth(layout, 0, textSize)
                                > getMeasuredWidth() - getPaddingLeft() - getPaddingRight()) {
                            updateTextView = false;
                        }
                    }

                    if (updateTextView) {
                        mTextView.setTextSize(TypedValue.COMPLEX_UNIT_PX, textSize);
                        mTextView.setMaxLines(maxLines);
                        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
                    }
                }
            }
        }

TabLayout内部设置了两种字体大小:

float mTabTextSize;
float mTabTextMultiLineSize;
final TypedArray ta = context.obtainStyledAttributes(mTabTextAppearance,
                android.support.v7.appcompat.R.styleable.TextAppearance);
        try {
            mTabTextSize = ta.getDimensionPixelSize(
                    android.support.v7.appcompat.R.styleable.TextAppearance_android_textSize, 0);
            mTabTextColors = ta.getColorStateList(
                    android.support.v7.appcompat.R.styleable.TextAppearance_android_textColor);
        } finally {
            ta.recycle();
        }
<style name="TextAppearance.Design.Tab" parent="TextAppearance.AppCompat.Button">
        <item name="android:textSize">@dimen/design_tab_text_size</item>
        <item name="android:textColor">?android:textColorSecondary</item>
        <item name="textAllCaps">true</item>
</style>
<dimen name="design_tab_text_size">14sp</dimen>

默认字体大小是14sp


final Resources res = getResources();
mTabTextMultiLineSize = res.getDimensionPixelSize(R.dimen.design_tab_text_size_2line);
<dimen name="design_tab_text_size_2line">12sp</dimen>

多行时字体大小为12sp


结合onMeasure()来分析!

若使字体大小保持一致,一种方式是修改 mTabTextSize 这个默认字体大小;另外一种方式就是修改 mTabTextMultiLineSize 这个字体大小!


方式一:

定义一个style,把默认字体大小设置成12sp!

<style name="TextAppearance.Design.Tab.Custom" parent="TextAppearance.AppCompat.Button">
        <item name="android:textSize">12sp</item>
        <item name="android:textColor">?android:textColorSecondary</item>
        <item name="textAllCaps">true</item>
    </style>

在TabLaout中引用

<android.support.design.widget.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabTextAppearance="@style/TextAppearance.Design.Tab.Custom"
           />

这里写图片描述


方式二:

把多行字体大小设置位于默认字体大小一致!

<dimen name="design_tab_text_size" tools:ignore="PrivateResource">14sp</dimen>

这里写图片描述

猜你喜欢

转载自blog.csdn.net/crazy1235/article/details/71425135
今日推荐