FlycoTabLayout优化

优化点：MsgView按需创建

优化前代码

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:mv="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipChildren="false"
    android:clipToPadding="false">

    <TextView
        android:id="@+id/tv_tab_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:gravity="center"
        android:singleLine="true"/>

    <com.flyco.tablayout.widget.MsgView
        android:id="@+id/rtv_msg_tip"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textColor="#ffffff"
        android:textSize="@dimen/msg_view_textSize"
        android:visibility="gone"
        mv:mv_backgroundColor="@color/red_ff0000"
        mv:mv_isRadiusHalfHeight="true"
        mv:mv_strokeColor="#ffffff"
        mv:mv_strokeWidth="1dp"/>

</RelativeLayout>

如上代码： MsgView在布局内是隐藏的状态，实际在使用时，并不是每一个tab都会显示红点或者特殊文字。此处的写法会导致每个tab创建时都会创建一个隐藏的MsgView实例

优化思路

使用ViewStub优化，在确实需要显示时，再通过viewstub渲染出来

优化代码

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipChildren="false"
    android:clipToPadding="false">

    <TextView
        android:id="@+id/tv_tab_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:gravity="center"
        android:singleLine="true" />

    <ViewStub
        android:id="@+id/vb_rtv_msg_tip"
        android:inflatedId="@+id/rtv_msg_tip"
        android:layout_width="wrap_content"
        android:layout="@layout/msg_view"
        android:layout_height="wrap_content" />

</RelativeLayout>

以SlidingTablayout为例优化代码，以下是优化前的代码

/**
 * 显示未读消息
 *
 * @param position 显示tab位置
 * @param num      num小于等于0显示红点,num大于0显示数字
 */
public void showMsg(int position, int num) {
    if (position >= mTabCount) {
        position = mTabCount - 1;
    }

    View tabView = mTabsContainer.getChildAt(position);
    MsgView tipView = tabView.findViewById(R.id.rtv_msg_tip);
    if (tipView != null) {
        UnreadMsgUtils.show(tipView, num);

        if (mInitSetMap.get(position) != null && mInitSetMap.get(position)) {
            return;
        }

        setMsgMargin(position, 4, 2);
        mInitSetMap.put(position, true);
    }
}

优化后的代码

/**
 * 显示未读消息
 *
 * @param position 显示tab位置
 * @param num      num小于等于0显示红点,num大于0显示数字
 */
public void showMsg(int position, int num) {
    if (position >= mTabCount) {
        position = mTabCount - 1;
    }

    View tabView = mTabsContainer.getChildAt(position);
    MsgView tipView = getMsgView(tabView);
    if (tipView != null) {
        UnreadMsgUtils.show(tipView, num);
        if (mInitSetMap.get(position) != null && mInitSetMap.get(position)) {
            return;
        }

        setMsgMargin(position, 4, 2);
        mInitSetMap.put(position, true);
    }
}

@Nullable
private MsgView getMsgView(View tabView) {
    MsgView tipView = tabView.findViewById(R.id.rtv_msg_tip);
    if(tipView == null){
        ViewStub viewStub = tabView.findViewById(R.id.vb_rtv_msg_tip);
        if(viewStub!=null){
            tipView = (MsgView) viewStub.inflate();
        }
    }
    return tipView;
}