web-dev-qa-db-fra.com

Supprimer les étiquettes BottomNavigationView

Google a publié une nouvelle bibliothèque de support v25 avec BottomNavigationView

 enter image description here

y at-il un moyen de supprimer les étiquettes des éléments?

40
Ali Zarei

J'espère que je ne suis pas trop en retard pour la fête ici.

Mais à partir de la Design Support Library 28.0.0-alpha1vous pouvez utiliser la propriété

app:labelVisibilityMode="unlabeled"

 BottomNavigationView without labels

vous pouvez également utiliser d'autres valeurs "auto", "libellé" et "sélectionné".

62
Abdul-Aziz-Niazi

Voudriez-vous ce style?

Si c'est le cas, je vous recommande d'essayer BottomNavigationViewEx .

20
ittianyu

Malheureusement, cette première version de BottomNavigationView est venue avec beaucoup de limitations. Et pour l'instant, vous ne pouvez pas supprimer les titres en utilisant simplement l'API de conception de support. Donc, pour résoudre cette limitation alors que Google ne l'implémente pas, vous pouvez faire (en utilisant la réflexion):

1. Définissez les titres vides dans le fichier bottom_navigation_menu.xml.

2. Etend le BottomNavigationView:

    public class MyBottomNavigationView extends BottomNavigationView {

      public MyBottomNavigationView(Context context, AttributeSet attrs) {
          super(context, attrs);
          centerMenuIcon();
      }

      private void centerMenuIcon() {
          BottomNavigationMenuView menuView = getBottomMenuView();

          if (menuView != null) {
              for (int i = 0; i < menuView.getChildCount(); i++) {
                BottomNavigationItemView menuItemView = (BottomNavigationItemView) menuView.getChildAt(i);

                AppCompatImageView icon = (AppCompatImageView) menuItemView.getChildAt(0);

                FrameLayout.LayoutParams params = (LayoutParams) icon.getLayoutParams();
                params.gravity = Gravity.CENTER;

                menuItemView.setShiftingMode(true);
              }
          }
      }

      private BottomNavigationMenuView getBottomMenuView() {
          Object menuView = null;
          try {
              Field field = BottomNavigationView.class.getDeclaredField("mMenuView");
              field.setAccessible(true);
              menuView = field.get(this);
          } catch (NoSuchFieldException | IllegalAccessException e) {
              e.printStackTrace();
          }

          return (BottomNavigationMenuView) menuView;
      }
    }

3. Ajoutez au layout.xml cette customView

Pour plus de détails, j'ai implémenté ceci sur Github

18
Sanf0rd

1. Définissez Android:title=""; dans menu/abc.xml

2. Crée la classe d'assistance ci-dessous qui utilise la réflexion 

import Android.support.design.internal.BottomNavigationMenuView;
import Android.support.design.widget.BottomNavigationView;
import Android.support.v7.widget.AppCompatImageView;
import Android.util.Log;
import Android.view.Gravity;
import Android.widget.FrameLayout;

import Java.lang.reflect.Field;

public class BottomNavigationViewHelper {
    public static void disableShiftMode(BottomNavigationView view) {
        BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0);
        try {
            Field shiftingMode = menuView.getClass().getDeclaredField("mShiftingMode");
            shiftingMode.setAccessible(true);
            shiftingMode.setBoolean(menuView, false);
            shiftingMode.setAccessible(false);
            for (int i = 0; i < menuView.getChildCount(); i++) {
                BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i);
                //noinspection RestrictedApi
                item.setShiftingMode(false);
                item.setPadding(0, 15, 0, 0);
                // set once again checked value, so view will be updated
                //noinspection RestrictedApi
                item.setChecked(item.getItemData().isChecked());
            }
        } catch (NoSuchFieldException e) {
            Log.e("BNVHelper", "Unable to get shift mode field", e);
        } catch (IllegalAccessException e) {
            Log.e("BNVHelper", "Unable to change value of shift mode", e);
        }
    }
} 

3. Dans votre activité principale, ajoutez ces lignes:

mBottomNav = (BottomNavigationView) findViewById(R.id.navigation);
BottomNavigationViewHelper.disableShiftMode(mBottomNav);
12
user8144524

Approche sans réflexion:

private void removeTextLabel(@NonNull BottomNavigationView bottomNavigationView, @IdRes int menuItemId) {
    View view = bottomNavigationView.findViewById(menuItemId);
    if (view == null) return;
    if (view instanceof MenuView.ItemView) {
        ViewGroup viewGroup = (ViewGroup) view;
        int padding = 0;
        for (int i = 0; i < viewGroup.getChildCount(); i++) {
            View v = viewGroup.getChildAt(i);
            if (v instanceof ViewGroup) {
                padding = v.getHeight();
                viewGroup.removeViewAt(i);
            }
        }
        viewGroup.setPadding(view.getPaddingLeft(), (viewGroup.getPaddingTop() + padding) / 2, view.getPaddingRight(), view.getPaddingBottom());
    }
}
9
Nikola Despotoski

C'est une solution temporaire. Il suffit d’ajouter: app:itemTextColor="@Android:color/transparent" Cela le rendra quelle que soit la couleur de fond qui apparaît désactivée. Cela donne à l’icône une apparence élevée.

4
liveneato

Je voulais supprimer à la fois l'animation shift et les libellés. Aucune des solutions ici ne fonctionnait bien pour moi. Voici donc celle que j'ai construite à partir de tout ce que j'ai appris ici:

public void removeLabels(@IdRes int... menuItemIds) {
    getViewTreeObserver().addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
        @Override public boolean onPreDraw() {
            getViewTreeObserver().removeOnPreDrawListener(this);

            // this only needs to be calculated once for an unchecked item, it'll be the same value for all items
            ViewGroup uncheckedItem = findFirstUncheckedItem(menuItemIds);
            View icon = uncheckedItem.getChildAt(0);
            int iconTopMargin = ((LayoutParams) uncheckedItem.getChildAt(0).getLayoutParams()).topMargin;
            int desiredTopMargin = (uncheckedItem.getHeight() - uncheckedItem.getChildAt(0).getHeight()) / 2;
            int itemTopPadding = desiredTopMargin - iconTopMargin;

            for (int id : menuItemIds) {
                ViewGroup item = findViewById(id);
                // remove the label
                item.removeViewAt(1);
                // and then center the icon
                item.setPadding(item.getPaddingLeft(), itemTopPadding, item.getPaddingRight(),
                        item.getPaddingBottom());
            }

            return true;
        }
    });
}

@SuppressLint("RestrictedApi")
private ViewGroup findFirstUncheckedItem(@IdRes int... menuItemIds) {
    BottomNavigationItemView item = findViewById(menuItemIds[0]);
    int i = 1;
    while (item.getItemData().isChecked()) {
        item = findViewById(menuItemIds[i++]);
    }
    return item;
}

Ajoutez simplement cette méthode à votre BottomNavigationView personnalisée et appelez-la en passant les identifiants des éléments de menu.

2
Fred Porciúncula

Je recommanderais de le mettre en œuvre vous-même, comme l'a indiqué sanf0rd dans sa réponse . Mais AppCompatImageView ne fonctionne pas pour moi. Je l'ai changé en ImageView. Et changé getChildAt en findViewById

De plus, je cache toutes les étiquettes des éléments non sélectionnés.

private void centerMenuIcon() {
    BottomNavigationMenuView menuView = getBottomMenuView();
    if (menuView != null) {
        for (int i = 0; i < menuView.getChildCount(); i++) {
            BottomNavigationItemView menuItemView = (BottomNavigationItemView) menuView.getChildAt(i);
            TextView smallText = (TextView) menuItemView.findViewById(R.id.smallLabel);
            smallText.setVisibility(View.INVISIBLE);
            //TextView largeText = (TextView) menuItemView.findViewById(R.id.largeLabel);
            ImageView icon = (ImageView) menuItemView.findViewById(R.id.icon);
            FrameLayout.LayoutParams params = (LayoutParams) icon.getLayoutParams();
            params.gravity = Gravity.CENTER;
            menuItemView.setShiftingMode(true);
        }
    }
}
1
Mikolasan