QMUI_Android中QMUITabSegment用法

QMUITabSegment用于横向多个  Tab 的布局，包含多个特性：

1. 可以用 xml 或 QMUITabSegment 提供的 set 方法统一配置文字颜色、icon 位置、是否要下划线等。
2. 每个 Tab 都可以非常灵活的配置，内容上支持文字和 icon 的显示，icon 支持选中态，支持内容的排版对齐方向设置，支持显示红点，支持插入自定义的 View，支持监听双击事件等。
3. 可以通过 setupWithViewPager(ViewPager) 方法与 ViewPager 绑定。

QMUITabSegment的使用方法

xml布局中设置属性

app:qmui_tab_icon_position="top"    //设置tab的图片显示位置 （默认图片在文字左边）

app:qmui_tab_has_indicator="true"    //设置是否显示下划线  （true为显示下划线，false为隐藏下划线）

app:qmui_tab_indicator_height="2dp"    //设置下划线的高度  

app:qmui_tab_indicator_top="true"    //设置下划线是否现在上方 （true为下划线在上方，false为下划线在下方）

代码中设置文字颜色（选中、未选中）

 int normalColor = QMUIResHelper.getAttrColor(mContext, R.attr.qmui_config_color_gray_6);

 int selectColor = QMUIResHelper.getAttrColor(mContext, R.attr.qmui_config_color_blue);

 mTabSegment.setDefaultNormalColor(normalColor);    //设置tab正常下的颜色  

 mTabSegment.setDefaultSelectedColor(selectColor);    //设置tab选中下的颜色  

代码中设置图片Icon位置

 mTabSegment.setDefaultTabIconPosition(QMUITabSegment.ICON_POSITION_RIGHT);

代码中设置是否需要显示 indicator  

mTabSegment.setHasIndicator(true);

代码中设置 indicator 的位置

mTabSegment.setIndicatorPosition(false);

代码中设置 indicator的宽度是否随内容宽度变化 

mTabSegment.setIndicatorWidthAdjustContent(true);

QMUITabSegment.MODE_SCROLLABLE表示item内容自适应，超过父容器则滚动

QMUITabSegment.MODE_FIXED表示固定宽度，item内容均分  

mTabSegment.setMode(QMUITabSegment.MODE_SCROLLABLE);

代码中设置文字内容、图片（选中、未选中）

第一个参数：未选中图片

第二个参数：选中图片

第三个参数：标题

第四个参数：true表示滑动改变图片，false滑动不改变图片

        QMUITabSegment.Tab component = new QMUITabSegment.Tab(
                ContextCompat.getDrawable(this, R.mipmap.icon_tabbar_component),
                ContextCompat.getDrawable(this, R.mipmap.icon_tabbar_component_selected),
                "新闻", false
        );

如果你的 icon 显示大小和实际大小不吻合（修改图片大小）

        // 1. 设置icon 的 bounds
        // 2. Tab 使用拥有5个参数的构造器
        // 3. 最后一个参数（setIntrinsicSize）设置为false
        int iconShowSize = QMUIDisplayHelper.dp2px(this, 20);
        Drawable normalDrawable = ContextCompat.getDrawable(this, R.mipmap.icon_tabbar_component);
        normalDrawable.setBounds(0, 0, iconShowSize, iconShowSize);
        Drawable selectDrawable = ContextCompat.getDrawable(this, R.mipmap.icon_tabbar_component_selected);
        selectDrawable.setBounds(0, 0, iconShowSize, iconShowSize);

        QMUITabSegment.Tab component = new QMUITabSegment.Tab(
                normalDrawable,
                normalDrawable,
                "新闻", false, false
        );

代码中设置显示红点

        QMUITabSegment.Tab tab = mTabSegment.getTab(1);//获取要在哪个item上显示Item红点
        tab.setSignCountMargin(0, -QMUIDisplayHelper.dp2px(this, 4));//设置红点显示位置
        tab.setmSignCountDigits(5);//设置红点中数字显示的最大位数
        tab.showSignCountView(this,3);//第二个参数表示：显示的消息数

mTabSegment选项被选中的监听  

mTabSegment.addOnTabSelectedListener(new QMUITabSegment.OnTabSelectedListener() {//mTabSegment选项被选中的监听  
           /**  
            * 当某个 Tab 被选中时会触发  
            *  
            * @param index 被选中的 Tab 下标  
            */  
           @Override  
           public void onTabSelected(int index) {  
               mTabSegment.hideSignCountView(index);//隐藏红点  
           }  
           /**  
            * 当某个 Tab 被取消选中时会触发  
            *  
            * @param index 被取消选中的 Tab 下标  
            */  
           @Override  
           public void onTabUnselected(int index) {  
  
           }  
           /**  
            * 当某个 Tab 处于被选中状态下再次被点击时会触发  
            *  
            * @param index 被再次点击的 Tab 下标  
            */  
           @Override  
           public void onTabReselected(int index) {  
               mTabSegment.hideSignCountView(index);  
           }  
           /**  
            * 当某个 Tab 被双击时会触发  
            *  
            * @param index 被双击的 Tab 下标  
            */  
           @Override  
           public void onDoubleTap(int index) {  
  
           }  
       });