2017-08-25 36 views
1

我有我的应用程序一个TabLayout和它拥有的自定义视图:机器人 - TabLayout动态调整

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

    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerInParent="true" 
     android:orientation="horizontal"> 

     <com.myproject.app.utils.commons.IconImageView 
      android:id="@android:id/icon" 
      android:layout_width="wrap_content" 
      android:layout_height="20dp" 
      android:layout_marginRight="14dp" 
      android:layout_marginEnd="14dp" 
      app:iconStateListColor="@color/color_order_tab"/> 

     <TextView 
      android:id="@android:id/text1" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:textColor="@color/color_order_tab" 
      android:textSize="14sp" 
      android:fontFamily="sans-serif-medium"/> 

    </LinearLayout> 

</RelativeLayout> 

我想,只有当它选择在标签上显示的文本 - 已经完成的 - 并动态调整这些选项卡,有没有办法做到这一点? 如果我使用app:tabMode="fixed"选项卡不调整大小,如果我使用app:tabMode="scrollable"我的选项卡总是在我的屏幕左侧。如果我做android:layout_width="wrap_content"android:layout_gravity="center_horizontal" - TabLayout不填满整个屏幕.. 所以我需要:

  • 调整分页大小的文本时出现或消失;
  • 任何情况下,标签都应该填满屏幕。
+0

你怎么隐藏未使用这个应用程序时的文字:tabSelectedTextColor =“机器人:ATTR/textColorPrimary” 应用:tabTextColor =“@安卓:彩色/透明” – Killer

+0

不,我隐藏文本与设置文本= “”,空字符串。 – Den

+0

请检查答案 – Killer

回答

3

首先,您无法获得使用fixed模式所需的所有功能。与fixed模式一样,您无法调整标签大小。 您需要使用scrollable模式才能调整选项卡的大小。

如果我做的android:layout_width = “WRAP_CONTENT” 和 机器人:layout_gravity = “CENTER_HORIZONTAL” - TabLayout不填 屏幕

你可以设置一个父容器和设置背景这样就可以让您感受到设备宽度完整的标签布局。

<FrameLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:background="@android:color/holo_orange_light"> 

    <android.support.design.widget.TabLayout 
     android:id="@+id/tabs" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center_horizontal" 
     app:tabGravity="center" 
     app:tabMode="scrollable" /> 
</FrameLayout> 

然后,您可以添加,即您的自定义选项卡的标签在标签布局,并在这之后,你可以添加addOnTabSelectedListener来得到想要的结果:

@Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     mBinding = DataBindingUtil.setContentView(this, R.layout.activity_main); 

     View view = getLayoutInflater().inflate(R.layout.custom_tab, null); 
     ((TextView) view.findViewById(R.id.text)).setText("large text one"); 

     View view1 = getLayoutInflater().inflate(R.layout.custom_tab, null); 
     ((TextView) view1.findViewById(R.id.text)).setText("1"); 

     View view2 = getLayoutInflater().inflate(R.layout.custom_tab, null); 
     ((TextView) view2.findViewById(R.id.text)).setText("Large Text Text Text"); 

     View view3 = getLayoutInflater().inflate(R.layout.custom_tab, null); 
     ((TextView) view3.findViewById(R.id.text)).setText("One"); 


     View view4 = getLayoutInflater().inflate(R.layout.custom_tab, null); 
     ((TextView) view4.findViewById(R.id.text)).setText("Another large text"); 

     mBinding.tabs.addTab(mBinding.tabs.newTab().setCustomView(view)); 
     mBinding.tabs.addTab(mBinding.tabs.newTab().setCustomView(view1)); 
     mBinding.tabs.addTab(mBinding.tabs.newTab().setCustomView(view2)); 
     mBinding.tabs.addTab(mBinding.tabs.newTab().setCustomView(view3)); 
     mBinding.tabs.addTab(mBinding.tabs.newTab().setCustomView(view4)); 

     mBinding.tabs.getTabAt(0).getCustomView().findViewById(R.id.text).setVisibility(View.VISIBLE); 

     mBinding.tabs.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() { 
      @Override 
      public void onTabSelected(TabLayout.Tab tab) { 
       tab.getCustomView().findViewById(R.id.text).setVisibility(View.VISIBLE); 
      } 

      @Override 
      public void onTabUnselected(TabLayout.Tab tab) { 
       tab.getCustomView().findViewById(R.id.text).setVisibility(View.GONE); 
      } 

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

      } 
     }); 

    } 

正如你所看到的选项卡现在可以调整大小,只有选定标签上的文字可见。希望帮助

+1

伟大的,它的作品!谢谢。 – Den