TabLayout标题文字不显示的解决操作

问题描述:

使用Design包的TabLayout实现类似网易选项卡动态滑动效果的时候,使用addTab()方法给TabLayout动态添加标题的时候,标题可能会出现不显示文字的情况。

分析:

真实情况并不是不显示文字,二而是ViewPager又给TabLayout添加了许多的标题,导致之前手动添加的标题又被挤到了后面。不信你多往后翻一翻就出来了。

解决办法:

不要为ViewPager手动使用addTab()方法添加标题,而应该先创建一个List集合,将其设置在PagerAdapter的getPageTitle方法中,代码如下:

 @Override
 public CharSequence getPageTitle(int position) {
  return mList_title.get(position);
 }

补充知识:Android中 TabLayout的TabItem文字和图片莫名不显示问题处理

Tablayout在没有设置适配器的时候,TabItem的文字和icon是正常显示的,可一旦设置上适配器文字和icon就直接消失,这个时候有两个解决办法(本人暂时只有两个)

1.效果图:

2. 正常写法设置适配器后的实图:

<android.support.design.widget.TabLayout
 android:id="@+id/fh_tab"
 app:tabIndicatorColor="@android:color/white"
 android:layout_marginTop="20dp"
 android:layout_below="@id/fh_title"
 android:layout_alignBottom="@+id/fh_iv"
 app:tabIndicatorHeight="4dp"
 app:tabTextColor="@color/tab_un_select"
 app:tabSelectedTextColor="@android:color/white"
 app:tabIndicatorFullWidth="false"
 android:layout_width="match_parent"
 android:layout_height="wrap_content">

 <android.support.design.widget.TabItem
  android:text="热点"
  android:icon="@drawable/ic_fire_gray"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />

 <android.support.design.widget.TabItem
  android:text="要闻"
  android:icon="@drawable/ic_news_state"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />

 <android.support.design.widget.TabItem
  android:text="时政"
  android:icon="@drawable/ic_politics_state"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />

 <android.support.design.widget.TabItem
  android:text="热点"
  android:icon="@drawable/ic_fire_gray"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />

 <android.support.design.widget.TabItem
  android:text="粤头条"
  android:icon="@drawable/ic_first_state"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />

 <android.support.design.widget.TabItem
  android:text="分类"
  android:icon="@drawable/ic_classify_state"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />

</android.support.design.widget.TabLayout>

解决方法一:自己定TabItem的样式(比较万能,但是指示器的长度不太 “听话”,就是不受app:tabIndicatorFullWidth = "false"的控制,(自己去设置指示器的长度也没用,想试请看最后的"设置指示器长度代码")) :

1.创建一个item_home_tab:

<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:gravity="center"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content">

 <ImageView
  android:id="@+id/iv"
  android:src="@drawable/ic_relative_true"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />

 <TextView
  android:layout_marginTop="3dp"
  android:textColor="@color/font2"
  android:id="@+id/tv"
  android:textSize="13sp"
  android:text="title"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />

</LinearLayout>

2.java中:

protected void init(){
 fhPager.setAdapter(adapter);
 fhPager.setCurrentItem(0);
 fhPager.setOffscreenPageLimit(1);
 fhTab.setSelectedTabIndicator(R.drawable.bg_submit);
 fhTab.setupWithViewPager(fhPager);

 Objects.requireNonNull(fhTab.getTabAt(0)).setCustomView(getview("热点", R.drawable.ic_fire_state));
 Objects.requireNonNull(fhTab.getTabAt(1)).setCustomView(getview("要闻", R.drawable.ic_news_state));
 Objects.requireNonNull(fhTab.getTabAt(2)).setCustomView(getview("时政", R.drawable.ic_politics_state));
 Objects.requireNonNull(fhTab.getTabAt(3)).setCustomView(getview("粤头条", R.drawable.ic_fire_state));
 Objects.requireNonNull(fhTab.getTabAt(4)).setCustomView(getview("分类", R.drawable.ic_classify_state));
}

private View getview(String title, int icon) {
 View view = LayoutInflater.from(getActivity()).inflate(R.layout.item_home_tab, null);
 TextView tv = view.findViewById(R.id.tv);
 ImageView iv = view.findViewById(R.id.iv);
 tv.setText(title);
 iv.setImageResource(icon);
 return view;
}

结果1:当Tablayout 的app:tabIndicatorFullWidth = "false"时出来的效果图:

结果2:当Tablayout 的app:tabIndicatorFullWidth = "true"出来的效果图:

解决办法二(指示器长度"听话"(受app:tabIndicatorFullWidth = "false"的控制),但是icon的大小就只能由系统来定):

fhPager.setAdapter(adapter);
fhPager.setCurrentItem(0);
fhPager.setOffscreenPageLimit(1);
fhTab.setSelectedTabIndicator(R.drawable.bg_submit);
fhTab.setupWithViewPager(fhPager);

//设置tabItem的文字和icon
fhTab.getTabAt(0).setText("热点").setIcon(R.drawable.ic_fire_state);
fhTab.getTabAt(1).setText("要闻").setIcon(R.drawable.ic_news_state);
fhTab.getTabAt(2).setText("时政").setIcon(R.drawable.ic_politics_state);
fhTab.getTabAt(3).setText("粤头条").setIcon(R.drawable.ic_first_state);
fhTab.getTabAt(4).setText("分类").setIcon(R.drawable.ic_classify_state);

结果1:当Tablayout 的app:tabIndicatorFullWidth = "false"时出来的效果图:

结果2:当Tablayout 的app:tabIndicatorFullWidth = "true"出来的效果图:

end...

设置TabLayout指示器的长度:

//指示器长度
public static void setIndicator(TabLayout tabs, int leftDip, int rightDip, int bottomDip) {
 if (tabs == null) {
  return;
 }
 Class<? extends TabLayout> tabLayout = tabs.getClass();

 Field tabStrip = null;
 try {
  tabStrip = tabLayout.getDeclaredField("mTabStrip");
 } catch (NoSuchFieldException e) {
  e.printStackTrace();
  return;
 }
 tabStrip.setAccessible(true);
 LinearLayout llTab = null;
 try {
  llTab = (LinearLayout) tabStrip.get(tabs);
 } catch (IllegalAccessException e) {
  e.printStackTrace();
  return;
 }
 int left = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, leftDip, Resources.getSystem().getDisplayMetrics());
 int right = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, rightDip, Resources.getSystem().getDisplayMetrics());
 int bottom = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, bottomDip, Resources.getSystem().getDisplayMetrics());
 for (int i = 0; i < llTab.getChildCount(); i++) {
  View child = llTab.getChildAt(i);
  child.setPadding(0, 0, 0, 0);
  LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.MATCH_PARENT, 1);
  params.leftMargin = left;
  params.rightMargin = right;
  params.bottomMargin = bottom;
  child.setLayoutParams(params);
  child.invalidate();
 }
}

以上这篇TabLayout标题文字不显示的解决操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

时间: 2020-08-20

android 控件同时监听单击和双击实例

不适用click而用touch 自定义监听: class myOnGestureListener extends GestureDetector.SimpleOnGestureListener { @Override public boolean onDoubleTap(MotionEvent e) { //点赞 mLoadingListener.onFinishedLoading("0");//取消点赞 是一个接口 //已经点赞 更换图片 1:已经点赞 0 :没有点赞 if (lik

解决TabLayout 不显示下划线问题

如下所示: tabLayout.setSelectedTabIndicatorColor(Color.TRANSPARENT); tabLayout.setFocusableInTouchMode(false); 如果没有上面那个再进入页面时候回有默认的下划线显示 所以设置成透明再设置不聚焦的模式就实现下划线消失了 补充知识:Android开发,Design包下TabLayout一些属性修改,字体.下划线颜色 由于时间较长没有用到tablayout,在一次使用中向改变tablayout滑动字体颜

解决Android popupWindow设置背景透明度无效的问题

有的时候当我们使用popwindow时将当前的activity当做View传给其他fragment使用时会导致我们设置背景变暗效果失效,导致这个原因的问题是因为我们传view后当弹出popupwindw的时候已经不再当前的activity了,所以会显示无效 因此在设置的时候我们这样处理: public void backgroundAlpha(float bgAlpha) { //MApp.getInstance().getMainActivity()就是你想要点击时要显示的主activity

解决Android webview设置cookie和cookie丢失的问题

Android页面嵌套了一个h5,H5页面内部有用户登陆页面,发现h5页面的登陆功能无法使用,一直登陆失败.和web那边商量一会,发现js写入的cookie丢失了.所有需要Android这边在重写写入一次. mWebView = view.findViewById(R.id.mall_view); settings = mWebView.getSettings(); settings.setJavaScriptEnabled(true); settings.setLoadsImagesAutom

Android布局自定义Shap圆形ImageView可以单独设置背景与图片

一.图片预览: 一.实现功能: 需求要实现布局中为圆形图片,图片背景与图标分开且合并到一个ImageView. 二.具体实现: XML中布局中定义ImageView,关健设置两个参数 Android:backgroup(设置背景),Android:src(设置ImageVIew中图片),圆形图片制作Drawable下定义xml shap样式(solid-color,size-width\hight) XML代码如下: <ImageView android:id="@+id/zhongjie

Android PopupWindow使用方法小结

前几天要用到PopupWindow,一时竟想不起来怎么用,赶紧上网查了查,自己写了个demo,并在此记录一下PopupWindow的用法. 使用场景 PopupWindow,顾名思义,就是弹窗,在很多场景下都可以见到它.例如ActionBar/Toolbar的选项弹窗,一组选项的容器,或者列表等集合的窗口等等. 基本用法 使用PopupWindow很简单,可以总结为三个步骤: 创建PopupWindow对象实例: 设置背景.注册事件监听器和添加动画: 显示PopupWindow. 其中,第二步是

Android view更改背景资源与padding消失的问题解决办法

Android view更改背景资源与padding消失的问题解决办法 这个需求一般不常用,不过遇到也挺郁闷的.这个应该算是SDK的一个bug,解决的办法,就是设置之前记录下来他的边距, 然后在设置回去. 具体方法 /** * 设置不改变padding的背景 * 因为android有设置背景后,padding无效的问题 * * @param view * @param resId * @autor wujiajun */ public static void setBackgroundResou

Android闹钟设置的解决方案

Android设置闹钟并不像IOS那样这么简单,做过Android设置闹钟的开发者都知道里面的坑有多深.下面记录一下,我解决Android闹钟设置的解决方案. 主要问题 1.API19开始AlarmManager的机制修改. 2.应用程序被Kill掉后,设置的闹钟不响. 3.6.0以上进入Doze模式会使JobScheduler停止工作. 4.手机设置重启后,闹钟失效问题. API19以上AlarmManager机制的修改 API19之前AlarmManager提供了三个设置闹钟的方法,由于业务

Android 背景透明度设置总结

一.写在前面的 在需求上遇到背景设置透明度还是比较常见的,设置透明度有几种方式,但是不同的场景应用下,不同的方式可能会出现一些问题.针对开发过程中的需求做以下总结. 二.先看效果图 图1. 图2. 图3. 图4 介绍:图1.蓝色头部和输入框背景初始状态 图2.点击按钮01,输入框的透明度不起作用,和title的透明度一样 图3.点击按钮02,背景透明度设置正常,但是可能会对全局的背景有影响 图4.点击按钮03,背景透明度设置正常,具体原因代码注释有提到 三.再加上代码 按钮点击 public v

Android使用TextView,设置onClick属性无效的解决方法

Android在布局文件中为View提供了onClick属性,使用方法如下: <TextView android:id="@+id/user" android:layout_width="@dimen/px_171" android:layout_height="fill_parent" android:onClick="iconClickListener" android:clickable="true&qu

android PopupWindow点击外部和返回键消失的解决方法

刚接手PopupWindow的时候,我们都可能觉得很简单,因为它确实很简单,不过运气不好的可能就会踩到一个坑: 点击PopupWindow最外层布局以及点击返回键PopupWindow不会消失 新手在遇到这个问题的时候可能会折腾半天,最后通过强大的网络找到一个解决方案,那就是跟PopupWindow设置一个背景 popupWindow.setBackgroundDrawable(drawable),这个drawable随便一个什么类型的都可以,只要不为空. Demo地址:SmartPopupWi

Android PopupWindow被输入法弹上去之后无法恢复原位的解决办法

问题描述: 我的PopupWindow位于屏幕底部,它上面有一个EditText输入框,而当我点击这个EditText的时候,随着输入法的弹出,我的PopupWindow也会随着上升,但是当我结束输入,关闭输入法的时候,PopupWindow却没有随着输入法一下下滑,而是停在屏幕中间,下面显示的是Activity的背景色.(小米手机上出现,三星note上没有出现) 解决办法: 给PopupWindow增加一个属性:popWindow.setSoftInputMode(WindowManager.

Android中给按钮同时设置背景和圆角示例代码

前言 最近在做按钮的时候遇到在给按钮设置一张图片作为背景的同时还要自己定义圆角,最简单的做法就是直接切张圆角图作为按钮就可以了,但是如果不这样该怎么办呢,看代码: 下面来看效果图 一.先建一个圆角的shape文件: <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android">