web-dev-qa-db-fra.com

Personnalisation de TextSize of BottomNavigationView android

J'essaie de modifier le texte Taille de BottomNavigationView à partir de la bibliothèque de support Android 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>

Y a-t-il quelque chose qui me manque?.

androidandroid-support-libraryandroiddesignsupport
27
silentsudo

Malheureusement, cette première version de BottomNavigationView est venue avec beaucoup de limitations. Et pour l'instant, vous ne pouvez pas modifier la taille des titres à l'aide de l'API de conception de support. Donc, pour résoudre cette limitation alors que Google ne l'implémente pas, vous pouvez faire: 

Dans votre dimen.xml, vous pouvez mettre:

    <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>

Ce faisant, vous remplacez la valeur par défaut de dimen utilisée par les classes internes de BottomNavigationView. Alors soyez prudent.

117
Sanf0rd

vous pouvez le changer comme ça. vous devez uniquement khower l'id des labels utilisés par google support

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 est l'identifiant du label utilisé par Google dans sa bibliothèque.

9
BoshRa

Vous pouvez modifier l'apparence du texte BottomNavigationView en définissant vos propres styles pour les attributs de composant itemTextAppearanceActive et itemTextAppearanceInactive. Par défaut, ils ont la variable textAppearanceCaption check section Mapping d'attributs de thèmes dans les documents Navigation inférieure .

<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>
6
Volodymyr Khodonovych

Une autre solution consiste à utiliser Spannable pour ajuster la taille de la couleur, de la police ou d'autres attributs du texte .... 

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;
            }
        }
}

Et puis définissez la durée pour tout élément de menu ...

@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);
        }
}

Si vous voulez que le texte change avec l'état de sélection

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;
            }
        });
1
Kvant

Pour ce faire, j'ai simplement décidé de remplacer la disposition des éléments de navigation: 

<?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>

Assurez-vous simplement de le nommer design_bottom_navigation_item

0
Pafoid