After adding 4 items in my menu.xml file for the BottomNavigationView it shows only selected item title and hides all other titles. Can I force showing the title and the icon. here is my code.
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_home"
android:enabled="true"
android:icon="@drawable/ic_home_24dp"
android:title="@string/text_home"
app:showAsAction="ifRoom" />
<item
android:id="@+id/action_category"
android:enabled="true"
android:icon="@drawable/ic_grid_24dp"
android:title="@string/text_category"
app:showAsAction="ifRoom" />
<item
android:id="@+id/action_me"
android:enabled="true"
android:icon="@drawable/ic_me_24dp"
android:title="@string/text_me"
app:showAsAction="ifRoom" />
<item
android:id="@+id/action_setting"
android:enabled="true"
android:icon="@drawable/ic_cog_24dp"
android:title="@string/text_setting"
app:showAsAction="ifRoom" />
</menu>
<android.support.design.widget.BottomNavigationView
android:id="@+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="@android:color/white"
android:elevation="6dp"
android:translationZ="6dp"
app:menu="@menu/bottom_navigation_main" />
Starting on support library 28-alpha, we can use app:labelVisibilityMode
attribute on BottomNavigation component. The value we can use, there are labeled
, unlabeled
, selected
, and auto
.
labeled
will keep all labels visible.unlabeled
will show only icons.selected
will only show the label for the selected item and shift
items. auto
will choose labeled or selected based on the number of items we
have labeled for 1–3 items and selected for 3+ items.This is some example of using it :
<android.support.design.widget.BottomNavigationView
android:id="@+id/mainBottomNav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:elevation="@dimen/dimen_8dp"
app:menu="@menu/bottom_menu"
app:labelVisibilityMode="labeled"/>
It's just simply like this:
Kotlin
bottomNavigationView.labelVisibilityMode=LabelVisibilityMode.LABEL_VISIBILITY_LABELED
Java
bottomNavigationView.setLabelVisibilityMode(LabelVisibilityMode.LABEL_VISIBILITY_LABELED)
after support library 28.0.0, support LabelVisibilityMode.
xml config: app:labelVisibilityMode="labeled"
<android.support.design.widget.BottomNavigationView
android:id="@+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="0dp"
android:background="?bottom_tint_color"
app:elevation="@dimen/padding_4"
app:labelVisibilityMode="labeled"
app:itemIconTint="?drawer_tint_color"
app:itemTextColor="?drawer_tint_color"
app:menu="@menu/bottom_navigation_lite"/>
or
you can call :
BottomNavigationView.setLabelVisibilityMode(LabelVisibilityMode.LABEL_VISIBILITY_LABELED);
Try this code,
activity_main.xml :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:design="http://schemas.android.com/apk/res-auto"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.segunfamisa.sample.bottomnav.MainActivity">
<FrameLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#f1f1f1">
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="@+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="start"
design:menu="@menu/bottom_nav_items" />
</LinearLayout>
fragment_menu.xml :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/fragment_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.segunfamisa.sample.bottomnav.MenuFragment">
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:textColor="@android:color/white"
android:gravity="center"
/>
</RelativeLayout>
Make this file inside menu folder,
bottom_nav_items.xml :
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_home"
android:enabled="true"
android:icon="@android:drawable/ic_dialog_map"
android:title="One"
app:showAsAction="ifRoom"/>
<item
android:id="@+id/action_category"
android:enabled="true"
android:icon="@android:drawable/ic_dialog_info"
android:title="Two"
app:showAsAction="ifRoom"/>
<item
android:id="@+id/action_me"
android:enabled="true"
android:icon="@android:drawable/ic_dialog_email"
android:title="Three"
app:showAsAction="ifRoom"/>
<item
android:id="@+id/action_setting"
android:enabled="true"
android:icon="@android:drawable/ic_popup_reminder"
android:title="Four"
app:showAsAction="ifRoom"/>
</menu>
MainActivity.java :
public class MainActivity extends AppCompatActivity {
private static final String SELECTED_ITEM = "arg_selected_item";
private BottomNavigationView mBottomNav;
private int mSelectedItem;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mBottomNav = (BottomNavigationView) findViewById(R.id.navigation);
disableShiftMode(mBottomNav);
mBottomNav.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
selectFragment(item);
return true;
}
});
MenuItem selectedItem;
if (savedInstanceState != null) {
mSelectedItem = savedInstanceState.getInt(SELECTED_ITEM, 0);
selectedItem = mBottomNav.getMenu().findItem(mSelectedItem);
} else {
selectedItem = mBottomNav.getMenu().getItem(0);
}
selectFragment(selectedItem);
}
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);
item.setShiftingMode(false);
// set once again checked value, so view will be updated
item.setChecked(item.getItemData().isChecked());
}
} catch (NoSuchFieldException e) {
//Timber.e(e, "Unable to get shift mode field");
} catch (IllegalAccessException e) {
//Timber.e(e, "Unable to change value of shift mode");
}
}
@Override
protected void onSaveInstanceState(Bundle outState) {
outState.putInt(SELECTED_ITEM, mSelectedItem);
super.onSaveInstanceState(outState);
}
@Override
public void onBackPressed() {
MenuItem homeItem = mBottomNav.getMenu().getItem(0);
if (mSelectedItem != homeItem.getItemId()) {
// select home item
selectFragment(homeItem);
} else {
super.onBackPressed();
}
}
private void selectFragment(MenuItem item) {
Fragment frag = null;
// init corresponding fragment
switch (item.getItemId()) {
case R.id.action_home:
frag = MenuFragment.newInstance(getString(R.string.text_home),
getColorFromRes(R.color.color_home));
break;
case R.id.action_category:
frag = MenuFragment.newInstance(getString(R.string.text_notifications),
getColorFromRes(R.color.color_notifications));
break;
case R.id.action_me:
frag = MenuFragment.newInstance(getString(R.string.text_search),
getColorFromRes(R.color.color_search));
break;
case R.id.action_setting:
frag = MenuFragment.newInstance(getString(R.string.text_home),
getColorFromRes(R.color.color_home));
break;
}
// update selected item
mSelectedItem = item.getItemId();
// uncheck the other items.
for (int i = 0; i < mBottomNav.getMenu().size(); i++) {
MenuItem menuItem = mBottomNav.getMenu().getItem(i);
menuItem.setChecked(menuItem.getItemId() == item.getItemId());
}
updateToolbarText(item.getTitle());
if (frag != null) {
FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
ft.add(R.id.container, frag, frag.getTag());
ft.commit();
}
}
private void updateToolbarText(CharSequence text) {
ActionBar actionBar = getSupportActionBar();
if (actionBar != null) {
actionBar.setTitle(text);
}
}
private int getColorFromRes(@ColorRes int resId) {
return ContextCompat.getColor(this, resId);
}
MenuFragment.java :
public class MenuFragment extends Fragment {
private static final String ARG_TEXT = "arg_text";
private static final String ARG_COLOR = "arg_color";
private String mText;
private int mColor;
private View mContent;
private TextView mTextView;
public static Fragment newInstance(String text, int color) {
Fragment frag = new MenuFragment();
Bundle args = new Bundle();
args.putString(ARG_TEXT, text);
args.putInt(ARG_COLOR, color);
frag.setArguments(args);
return frag;
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_menu, container, false);
}
@Override
public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
// retrieve text and color from bundle or savedInstanceState
if (savedInstanceState == null) {
Bundle args = getArguments();
mText = args.getString(ARG_TEXT);
mColor = args.getInt(ARG_COLOR);
} else {
mText = savedInstanceState.getString(ARG_TEXT);
mColor = savedInstanceState.getInt(ARG_COLOR);
}
// initialize views
mContent = view.findViewById(R.id.fragment_content);
mTextView = (TextView) view.findViewById(R.id.text);
// set text and background color
mTextView.setText(mText);
mContent.setBackgroundColor(mColor);
}
@Override
public void onSaveInstanceState(Bundle outState) {
outState.putString(ARG_TEXT, mText);
outState.putInt(ARG_COLOR, mColor);
super.onSaveInstanceState(outState);
}
}
whatever you need to do is just disable BottomNavigationView Shift mode, using this method in you code.
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);
item.setShiftingMode(false);
// set once again checked value, so view will be updated
item.setChecked(item.getItemData().isChecked());
}
} catch (NoSuchFieldException e) {
//Timber.e(e, "Unable to get shift mode field");
} catch (IllegalAccessException e) {
//Timber.e(e, "Unable to change value of shift mode");
}
}
call this method like this,
mBottomNav = (BottomNavigationView) findViewById(R.id.navigation);
disableShiftMode(mBottomNav);
It will work.I am attaching screenshot here,
Above one i find a bit longer solution for this problem. I had a simpler solution for it.
Add this class in your app:
class BottomNavigationViewHelper {
@SuppressLint("RestrictedApi")
public static void removeShiftMode(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);
item.setShiftingMode(false);
// set once again checked value, so view will be updated
item.setChecked(item.getItemData().isChecked());
}
} catch (NoSuchFieldException e) {
Log.e("ERROR NO SUCH FIELD", "Unable to get shift mode field");
} catch (IllegalAccessException e) {
Log.e("ERROR ILLEGAL ALG", "Unable to change value of shift mode");
}
}
}
and then add this in your activity where bottomnavigationview is available
BottomNavigationViewHelper.removeShiftMode(bottomNavigationView);//disable BottomNavigationView shift mode
This will disable shifting mode of navigationview and text and icon will be shown always.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With