Android的选项卡布局选项卡圆角 [英] Android Tab Layout tabs with round corners

查看:577
本文介绍了Android的选项卡布局选项卡圆角的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这类型的问题已经被问过,但没有得到任何正确的,工作的解决方案,所以我再次发布此question.Sorry再次询问,浪费你的时间。
请给一些可行的解决方案。还是让我知道,如果我做错什么。
先谢谢了。

预计标签:

不过,说我爱:

即将标签

在页面加载标签来了像预期标签的形象,但选择后,未来像即将标签的形象。
MainXML code:

 < android.support.design.widget.TabLayout
                机器人:ID =@ + ID /标签
                风格=@风格/ MyCustomTabLayout
                机器人:layout_width =match_parent
                机器人:layout_height =WRAP_CONTENT
                机器人:背景=@绘制/ background_img_jpeg
                安卓了minHeight =10dp
                机器人:填充=10dp
                应用:tabGravity =补
                应用:tabIndicatorColor =@色/透明
                应用:tabMode =固定
                应用:tabTextColor =@色/蓝色/>

@风格/ MyCustomTabLayout

 <样式名称=MyCustomTabLayout父=Widget.Design.TabLayout>
        <项目名称=tabBackground> @绘制/ tab_bg< /项目>
    < /风格>

@绘制/ tab_bg

 <选择的xmlns:机器人=htt​​p://schemas.android.com/apk/res/android>
    <项目的android:state_selected =真
        机器人:可绘制=@绘制/ tab_bgselected/>
    <项目机器人:可绘制=@绘制/ tab_bgnotselected/>
    < /选择>

@绘制/ tab_bgselected

 <?XML版本=1.0编码=UTF-8&GT?;
<层列表的xmlns:机器人=htt​​p://schemas.android.com/apk/res/android>    <项目的android:底部=0dp机器人:顶部=0dp
          机器人:左=0dp机器人:右=0dp>
        <形状机器人:形状=矩形>
            [固体机器人:色=@色/蓝色/>
            <角落
                机器人:topLeftRadius =10dp
                机器人:bottomLeftRadius =10dp>
            < /角落>
        < /形状>
    < /项目>
< /层列表>

像这样的 @绘制/ tab_bgnotselected

和在code后面,我已经写了:

  tabLayout.setOnTabSelectedListener(新TabLayout.OnTabSelectedListener(){
            @覆盖
            公共无效onTabSelected(TabLayout.Tab标签){
                尝试{
                    mViewPager.setCurrentItem(tab.getPosition());
                    TabPosition = tab.getPosition();
                    TabCount = tabLayout.getTabCount();                    尝试{
                        如果(TabPosition == 0){
                            GradientDrawable绘制=(GradientDrawable)getResources()getDrawable(R.drawable.policy_tab_blue)。
                            drawable.setCornerRadii(新浮法[] {10,10,0,0,0,0,10,10}); //这将创建一个角落radious到左侧                        }其他{
                            GradientDrawable绘制=(GradientDrawable)getResources()getDrawable(R.drawable.policy_tab_white)。
                            drawable.setCornerRadii(新浮法[] {0,0,10,10,10,10,0,0}); //这将创建一个角落radious到右侧                        }
                    }赶上(例外五){
                        e.printStackTrace();
                    }
                    Log.i(TabPosition:--->中,TabPosition +);
                    Log.i(TabCount:--->中,TabCount +);                }赶上(例外五){
                    e.printStackTrace();
                }
            }            @覆盖
            公共无效onTabUnselected(TabLayout.Tab标签){
                尝试{                }赶上(例外五){
                    e.printStackTrace();
                }
            }            @覆盖
            公共无效onTabReselected(TabLayout.Tab标签){            }
        });


解决方案

我认为你应该使用 4形状:
   1)作为左键未选择
   2)作为选择左键
   3)作为右边的按钮不选择
   4)作为选择右边的按钮

然后写选择要使用按钮背景,见范例左键(为右只是类似):

 <选择
    的xmlns:机器人=htt​​p://schemas.android.com/apk/res/android><项目的android:state_selected =真正的>
<形状机器人:形状=矩形>
  <角落
    机器人:topRightRadius =10dp
    机器人:bottomLeftRadius =10dp/>
  <梯度
    机器人:startColor =#000
    机器人:ENDCOLOR =#000
    机器人:gradientRadius =400
    机器人:角= - 270/>
< /形状>
< /项目><项目>
    <形状机器人:形状=矩形>
      <梯度
        机器人:角=90
        机器人:startColor =#880f0f10
        机器人:centerColor =#8858585a
        机器人:ENDCOLOR =#88a9a9a9/>
   <角落
      机器人:topRightRadius =10dp
      机器人:bottomLeftRadius =10dp/>
< /形状>
< /项目>

在这里详细的访问。 TABS href=\"http://stackoverflow.com/questions/8599755/rounded-corners-for-tabs-in-android\">圆角

This type of Question has already been asked before but not got any proper,working solution so I am again posting this question.Sorry for asking again and wasting your time. Please give some working solution. Or let me know if I am doing anything wrong. Thanks in advance.

Expected Tabs:

But coming Like:

Coming Tabs

On page Load tabs are coming like "Expected Tabs" image but after selection coming like "Coming Tabs" image. MainXML code:

 <android.support.design.widget.TabLayout
                android:id="@+id/tabs"
                style="@style/MyCustomTabLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/background_img_jpeg"
                android:minHeight="10dp"
                android:padding="10dp"
                app:tabGravity="fill"
                app:tabIndicatorColor="@color/TRANSPARENT"
                app:tabMode="fixed"
                app:tabTextColor="@color/blue" />

@style/MyCustomTabLayout

<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
        <item name="tabBackground">@drawable/tab_bg</item>
    </style>

@drawable/tab_bg

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true"
        android:drawable="@drawable/tab_bgselected" />
    <item android:drawable="@drawable/tab_bgnotselected" />
    </selector>

@drawable/tab_bgselected

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:bottom="0dp"  android:top="0dp"
          android:left="0dp" android:right="0dp" >
        <shape android:shape="rectangle">
            <solid android:color="@color/blue" />
            <corners
                android:topLeftRadius="10dp"
                android:bottomLeftRadius="10dp">
            </corners>
        </shape>
    </item>
</layer-list>

Like that @drawable/tab_bgnotselected

And in code behind i have written:

tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                try {
                    mViewPager.setCurrentItem(tab.getPosition());
                    TabPosition = tab.getPosition();
                    TabCount = tabLayout.getTabCount();

                    try {
                        if (TabPosition == 0) {
                            GradientDrawable drawable = (GradientDrawable) getResources().getDrawable(R.drawable.policy_tab_blue);
                            drawable.setCornerRadii(new float[]{10,10,0,0,0,0,10,10}); // this will create the corner radious to left side

                        } else {
                            GradientDrawable drawable = (GradientDrawable) getResources().getDrawable(R.drawable.policy_tab_white);
                            drawable.setCornerRadii(new float[]{0,0,10,10,10,10,0,0}); // this will create the corner radious to right side

                        }
                    } catch (Exception e) {
                        e.printStackTrace();
                    }
                    Log.i("TabPosition:--->", TabPosition + "");
                    Log.i("TabCount:--->", TabCount + "");

                } catch (Exception e) {
                    e.printStackTrace();
                }
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {
                try {

                } catch (Exception e) {
                    e.printStackTrace();
                }
            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {

            }
        });

解决方案

I think you should use 4 shapes: 1) for left button not selected 2) for left button selected 3) for right button not selected 4) for right button selected

And then write selector to use for button background, see example for the left button (for the right just the similar):

<selector
    xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_selected="true">
<shape android:shape="rectangle">
  <corners
    android:topRightRadius="10dp"
    android:bottomLeftRadius="10dp"/>
  <gradient
    android:startColor="#000"
    android:endColor="#000"
    android:gradientRadius="400"
    android:angle="-270"/>
</shape>
</item>

<item>
    <shape android:shape="rectangle">
      <gradient
        android:angle="90"
        android:startColor="#880f0f10"
        android:centerColor="#8858585a"
        android:endColor="#88a9a9a9"/>
   <corners
      android:topRightRadius="10dp"
      android:bottomLeftRadius="10dp"/>
</shape>
</item>

for more detail visit here. Rounded corners for TABS in android

这篇关于Android的选项卡布局选项卡圆角的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆