最近在学习BottomNavigationView的使用,但是有些时候我们有特殊需求
如:
[Android官方BottomNavigationView添加Badge(角标),全部tab显示文字自动铺满]
如:
不需要label的缩放效果咋办呢?
下面给大家分享一下,2句代码去掉这个效果:
直接上代码:
BottomNavigationView bottomNavigationView = findViewById(R.id.navigation);
bottomNavigationView.setItemTextAppearanceActive(R.style.bottom_selected_text);
bottomNavigationView.setItemTextAppearanceInactive(R.style.bottom_normal_text);
style部分:
<!--自定义的颜色部分-->
<color name=\"font_hint\">#989898</color>
<color name=\"colorPrimary\">#3F51B5</color>
<!--没有选中的样式-->
<style name=\"bottom_normal_text\">
<item name=\"android:textColor\">@color/font_hint</item>
<item name=\"android:textSize\">14sp</item>
</style>
<!--选中的样式-->
<style name=\"bottom_selected_text\">
<item name=\"android:textColor\">@color/colorPrimary</item>
<item name=\"android:textSize\">14sp</item>
</style>
如果只想实现效果,到此就可以实现去掉缩放动画了。
下面是解析为什么要这样做。有兴趣的小伙伴可以看看啊
首先要设置lable显示样式就要定位到源码BottomNavigationItemView类中,里面在进行点击切换时进行样式的修改,
由于我在 布局中设置了app:labelVisibilityMode=\"labeled\"
<android.support.design.widget.BottomNavigationView
android:id=\"@+id/navigation\"
app:labelVisibilityMode=\"labeled\"
app:menu=\"@menu/tt_navigation\"/>
所以源码部分,也就是case 1:的情况如下
// 源码:
public void setChecked(boolean checked) {
//...省略部分代码
case 1:
if (checked) {
// 设置图片的样式,此处可以看出icon样式只是修改位置,大小没有变化
this.setViewLayoutParams(this.icon, (int)((float)this.defaultMargin + this.shiftAmount), 49);
// 对显示大文字的largeLabel进行缩放
this.setViewValues(this.largeLabel, 1.0F, 1.0F, 0);
// 对显示小文字的smallLabel进行缩放
this.setViewValues(this.smallLabel, this.scaleUpFactor, this.scaleUpFactor, 4);
} else {
// 效果同上面相反
this.setViewLayoutParams(this.icon, this.defaultMargin, 49);
this.setViewValues(this.largeLabel, this.scaleDownFactor, this.scaleDownFactor, 4);
this.setViewValues(this.smallLabel, 1.0F, 1.0F, 0);
}
//...省略部分代码
}
由于在调用setChecked设置checked的时候调用了this.setViewValues(),对显示大文字largeLabel和小文字smallLabel进行了缩放
private void setViewValues(@NonNull View view, float scaleX, float scaleY, int visibility) {
view.setScaleX(scaleX);
view.setScaleY(scaleY);
view.setVisibility(visibility);
}
但是缩放的比例却和this.scaleUpFactor和this.scaleDownFactor有关,此处就想了如果能让这2个缩放比例都是1或相等不就不用缩放了吗,。。。带着这样的疑问继续找这2个参数赋值的地方,来到了如下关键的地方
// 设置smallLabel的样式
public void setTextAppearanceInactive(@StyleRes int inactiveTextAppearance) {
TextViewCompat.setTextAppearance(this.smallLabel, inactiveTextAppearance);
this.calculateTextScaleFactors(this.smallLabel.getTextSize(), this.largeLabel.getTextSize());
}
// 设置largeLabel的样式
public void setTextAppearanceActive(@StyleRes int activeTextAppearance) {
TextViewCompat.setTextAppearance(this.largeLabel, activeTextAppearance);
this.calculateTextScaleFactors(this.smallLabel.getTextSize(), this.largeLabel.getTextSize());
}
在上面2个方法设置样式之后,通过calculateTextScaleFactors计算缩放比例并对this.scaleUpFactor和this.scaleDownFactor赋值
private void calculateTextScaleFactors(float smallLabelSize, float largeLabelSize) {
this.shiftAmount = smallLabelSize - largeLabelSize;
this.scaleUpFactor = 1.0F * largeLabelSize / smallLabelSize;
this.scaleDownFactor = 1.0F * smallLabelSize / largeLabelSize;
}
如果想让this.scaleUpFactor和this.scaleDownFactor相同,从上面的代码中可以看出,只有this.smallLabel.getTextSize() == this.smallLabel.getTextSize()2个的字体大小一样就行。这样就好,问题就解决了
只需要通过BottomNavigationView 对他们设置相同的字体就可以了,问题完美解决2行代码
BottomNavigationView bottomNavigationView = findViewById(R.id.navigation);
bottomNavigationView.setItemTextAppearanceActive(R.style.bottom_selected_text);
bottomNavigationView.setItemTextAppearanceInactive(R.style.bottom_normal_text);
继续阅读与本文标签相同的文章
Lambda运算符(C#)
《数字视频和高清:算法和接口》一1.12幅型比
-
第六届世界互联网大会“新看点”大盘点
2026-05-14栏目: 教程
-
特斯拉自动驾驶系统涨价遭质疑 马斯克:我们不能一直亏钱
2026-05-14栏目: 教程
-
首个二类资源区平价光伏电站正式并网发电
2026-05-14栏目: 教程
-
AI+5G科技创新 视频行业呈现轻应用化趋势
2026-05-14栏目: 教程
-
1.98亿滴滴用户添加了紧急联系人 每天百万个订单行程分享给亲友
2026-05-14栏目: 教程
