问题
I am trying to change the textSize of BottomNavigationView from android support library 25.0.0
<android.support.design.widget.BottomNavigationView
android:id="@+id/bottom_navigation_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="@color/colorPrimaryDark"
android:foregroundTint="@color/colorAccent"
app:itemIconTint="@android:color/white"
app:itemTextColor="@android:color/white"
app:layout_anchor="@id/lyt_container"
app:layout_anchorGravity="bottom"
app:itemTextAppearance="@style/TextStyleBNV"
app:menu="@menu/nav_menu" />
<style name="TextStyleBNV">
<item name="android:textSize">@dimen/twelve_sp</item>
<item name="android:padding">0dp</item>
<item name="textAllCaps">false</item>
</style>
Is there anything i am missing.
回答1:
Unfortunately this first version of BottomNavigationView came with a lot of limitations. And for now you can't change titles size just using the support design API. So to solve this limitation while google doesn't implement it, you can do:
In your dimen.xml you can put:
<dimen name="design_bottom_navigation_text_size" tools:override="true">30sp</dimen>
<dimen name="design_bottom_navigation_active_text_size" tools:override="true">30sp</dimen>
Doing this you are overriding the default value of dimen that the internal classes of BottomNavigationView use. So be carreful.
回答2:
You can change BottomNavigationView text appearance by defining your own styles for Component Attributes itemTextAppearanceActive and itemTextAppearanceInactive. By default they have textAppearanceCaption check section Theme Attribute Mapping in the docs Bottom Navigation.
<android.support.design.widget.BottomNavigationView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:itemTextAppearanceActive="@style/BottomNavigationView.Active"
app:itemTextAppearanceInactive="@style/BottomNavigationView"
app:menu="@menu/bottom_navigation_main" />
styles.xml
<style name="BottomNavigationView" parent="@style/TextAppearance.AppCompat.Caption">
<item name="android:textSize">10sp</item>
</style>
<style name="BottomNavigationView.Active" parent="@style/TextAppearance.AppCompat.Caption">
<item name="android:textSize">11sp</item>
</style>
回答3:
you can change it like this. you have to only khow the id of labels that google support used
BottomNavigationView bottomNavigationView = (BottomNavigationView) fragmentActivity.findViewById(R.id.bottom_navigation);
TextView textView = (TextView) bottomNavigationView.findViewById(R.id.menu_item_home).findViewById(R.id.largeLabel);
textView.setTextSize(8);
LargeLabel is the id of label that google used in its library
回答4:
Another solution is to use Spannable to adjust the size color, font or other a text attributes ....
private static class MenuSpannable extends MetricAffectingSpan{
int color = Color.RED;
int size = 40;
public MenuSpannable() {
setSelected(false);
}
@Override
public void updateMeasureState(TextPaint p) {
p.setColor(color);
p.setTextSize(size);
/* p.setText --- whatever --- */
}
@Override
public void updateDrawState(TextPaint tp) {
tp.setColor(color);
tp.setTextSize(size);
/* tp.setText --- whatever --- */
}
private void setSelected(boolean selected){
if(selected){
color = Color.RED;
size = 40;
}else{
color = Color.BLUE;
size = 20;
}
}
}
And then set the span for any menu item...
@Override
protected void onCreate(Bundle savedInstanceState) {
BottomNavigationView mBottomNavigationView = (BottomNavigationView)findViewById(R.id.bottom_menu);
final Menu menu = mBottomNavigationView.getMenu();
final Font font = Font.getFromContext(this);
for(int i = 0; i < menu.size(); i++) {
SpannableString spannableString = new SpannableString(menu.getItem(i).getTitle());
spannableString.setSpan(new MenuSpannable(),0,spannableString.length(),0);
menu.getItem(i).setTitle(spannableString);
}
}
In case you want the text to change with the selection state
mBottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
Menu menu = mBottomNavigationView.getMenu();
for(int i = 0; i < menu.size(); i++) {
MenuSpannable menuSpannable = new MenuSpannable();
menuSpannable.setSelected(item.getItemId() == menu.getItem(i).getItemId());
SpannableString sString = new SpannableString(menu.getItem(i).getTitle());
sString.setSpan(menuSpannable,0,sString.length(),0);
menu.getItem(i).setTitle(sString);
}
return false;
}
});
回答5:
To do this, I just decided to override the navigation item layout :
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:id="@+id/icon"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="@dimen/design_bottom_navigation_margin"
android:layout_marginBottom="@dimen/design_bottom_navigation_margin"
android:duplicateParentState="true" />
<android.support.design.internal.BaselineLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:clipToPadding="false"
android:paddingBottom="10dp"
android:duplicateParentState="true">
<TextView
android:id="@+id/smallLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="@dimen/design_bottom_navigation_text_size"
android:singleLine="true"
android:duplicateParentState="true" />
<TextView
android:id="@+id/largeLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="invisible"
android:textSize="@dimen/design_bottom_navigation_active_text_size"
android:singleLine="true"
android:duplicateParentState="true" />
</android.support.design.internal.BaselineLayout>
</merge>
Just make sure you name it design_bottom_navigation_item
回答6:
I used the snippet below to change the NavigationView style using the Material design.
<style name="MyBottomNavigationView" parent="Widget.MaterialComponents.BottomNavigationView">
<item name="itemIconTint">@color/bottom_navigation_item_selector</item>
<item name="itemTextColor">@color/bottom_navigation_item_selector</item>
<item name="itemTextAppearanceActive">@style/MyBottomNavigationView.TextAppearance</item>
<item name="itemTextAppearanceInactive">@style/MyBottomNavigationView.TextAppearance</item>
</style>
<style name="MyBottomNavigationView.TextAppearance" parent="TextAppearance.MaterialComponents.Caption">
<item name="android:textSize">11sp</item>
<item name="fontFamily">@font/exo2_medium</item>
</style>
Then set the style to the BottomNavigationView element
<com.google.android.material.bottomnavigation.BottomNavigationView
...
style="@style/MyBottomNavigationView" />
回答7:
Add the TabTextStyle code inside the UpdateBarTextColor (this void exist in BottomBarPageRenderer)
void UpdateBarTextColor()
{
if (_disposed || _bottomBar == null)
{
return;
}
//This is linked to styles.xml to set size of text
_bottomBar.SetTextAppearance(Resource.Style.TabTextStyle);
//Set color of text and icon in BottomNavBar
_bottomBar.SetActiveTabColor(Element.BarTextColor.ToAndroid(Color.FromHex("#0094F0")));
// The problem SetActiveTabColor does only work in fiexed mode // haven't found yet how to set text color for tab items on_bottomBar, doesn't seem to have a direct way
}
And then add this inside the styles.xml:
<style name="TabTextStyle" parent="@android:style/TextAppearance.Medium">
<item name="android:textSize">8dp</item>
</style>
回答8:
Unfortunately overriding dimen did not work for me at com.android.support:design:28.0.0
Finally I was able to change the text size by using <font size="8"></font> tag for each title string resource used in menu.xml.
For example I have a menu declared here menu_bottom_navigation.xml, which has item like:
<item
...
android:title="@string/main_navi_item_home"
.../>
In string.xml, set the target resource like:
<string name="main_navi_item_home"><font size="8">Home</font></string>
来源：https://stackoverflow.com/questions/40172219/custom-textsize-of-bottomnavigationview-support-android