凹凸不平的底部导航栏

Question

我正在尝试创建一个底部导航栏，其中包含 5 个规则间隔的项目，并且图标下方没有标签。我找到了很多指导并遵循了它，但与我遵循的示例不同，我的导航栏显示非常不均匀。我怎样才能让它均匀分布？

This is what it looks like now:

我的 xml 视图（在相对布局中）：

<android.support.design.widget.BottomNavigationView
    android:id="@+id/navigation_search"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    app:itemBackground="@color/colorPrimary"
    app:itemIconTint="@android:color/white"
    app:itemTextColor="@android:color/white"
    app:menu="@menu/navigation" />

导航xml文件：

<?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/navigation_home"
    android:enabled="true"
    android:icon="@drawable/ic_home_black_24dp"
    android:title="Home"
    app:showAsAction="always" />

<item
    android:id="@+id/navigation_look"
    android:icon="@drawable/ic_find_in_page_black_24dp"
    android:title="Search"
    android:enabled="true"
    app:showAsAction="always"/>

<item
    android:id="@+id/navigation_basket"
    android:enabled="true"
    android:icon="@drawable/ic_shopping_basket_black_24dp"
    android:title="Basket"
    app:showAsAction="always"/>

<item
    android:id="@+id/navigation_favourite"
    android:icon="@drawable/ic_favorite_black_24dp"
    android:title="Favourite"
    android:enabled="true"
    app:showAsAction="always"/>


<item
    android:id="@+id/navigation_account"
    android:enabled="true"
    android:icon="@drawable/ic_person_black_24dp"
    android:title="Account"
    app:showAsAction="always"/>
</menu>

这就是我在 onCreate 中的 CategoryActivity.java 中的内容：

BottomNavigationView navigationSearch = (BottomNavigationView) 
findViewById(R.id.navigation_search);
navigationSearch.setOnNavigationItemSelectedListener(
            new BottomNavigationView.OnNavigationItemSelectedListener() {
                @Override
                public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                    switch (item.getItemId()) {
                        case R.id.navigation_home:
                            Intent main = new Intent(CategoryActivity.this, MainActivity.class);
                            startActivity(main);
                            break;
                        case R.id.navigation_look:
                            Intent search = new Intent(CategoryActivity.this, SearchActivity.class);
                            startActivity(search);
                            break;
                        case R.id.navigation_basket:
                            Intent basket = new Intent(CategoryActivity.this, BasketActivity.class);
                            startActivity(basket);
                            break;
                        case R.id.navigation_favourite:
                            Intent favourite = new Intent(CategoryActivity.this, FavouritesActivity.class);
                            startActivity(favourite);
                            break;
                        case R.id.navigation_account:
                            Intent account = new Intent(CategoryActivity.this, AccountActivity.class);
                            startActivity(account);
                            break;
                    }
                    return false;
                }
            });

Answer 1

您可以做的是在 Navigation.xml 中将 Title 属性指定为 android:title=""，然后使用 BottomNavigationViewHelper.disableShiftMode（您的 BottomNavigationView）[=10= 禁用切换模式]

Answer 2

我推荐你使用碎片

navigationSearch.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                Fragment selectedFragment = null;
                switch (item.getItemId())
                {
                    case R.id.navigation_home:
                        selectedFragment = HomeFragment.newInstance();
                        break;
                    case R.id.navigation_look:
                        selectedFragment = LookFragment.newInstance();
                        break;
                    case R.id.navigation_basket:
                        selectedFragment = BasketFragment.newInstance();
                        break;
                    case R.id.navigation_favourite:
                        selectedFragment = FavouriteFragment.newInstance();
                        break;
                    case R.id.navigation_account:
                        selectedFragment = AccountFragment.newInstance();
                        break;
                }
                FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
                transaction.replace(R.id.frame_layout,selectedFragment);
                transaction.commit();
                return true;
            }
        });
setDefaulFragment();

private void setDefaulFragment() {
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        transaction.replace(R.id.frame_layout,HomeFragment.newInstance());
        transaction.commit();
    }

activity_category.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/gradient"
    tools:context=".CategoryActivity">
    <FrameLayout
        android:id="@+id/frame_layout"
        android:animateLayoutChanges="true"
        android:layout_above="@+id/navigation"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_alignParentBottom="true"
        android:background="@color/colorPrimaryDark"
        app:itemIconTint="@drawable/nav_item_color_state"
        app:itemTextColor="@drawable/nav_item_color_state"
        app:menu="@menu/bottom_menu"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

</RelativeLayout>

示例片段： HomeFragment.java:

public class HomeFragment extends Fragment {
    View mFragment;

    public static HomeFragment newInstance(){
        HomeFragment homeFragment = new HomeFragment();
        return homeFragment ;
    }

    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        mFragment = inflater.inflate(R.layout.fragment_home,container,false);
        return mFragment;
    }
}

示例片段： fragment_home.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".HomeFragment">

<TextView
    android:text="Home Fragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

</FrameLayout>

Answer 3

使用水平方向的线性布局。您可以为每个项目提供 layout_weight 大约 20。线性布局的 WeightSum 为 100。使用片段加载数据。

Answer 4

我有同样的问题，但是有 4 个项目，有一个技巧，你应该在 findViewById 之后在你的 BottomNavigationView 上使用这个方法。

@SuppressLint("RestrictedApi")
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);
            // 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);
    }
}

抱歉，我真的无法更深入地解释解决方案，因为这是我很久以前根据 Whosebug 上的一些建议解决的问题，我不记得 theory/reasons 有一个需要这个，但这对我来说在 Android Oreo 上很好用，所以你可以做一些实验并找到更好的方法。

凹凸不平的底部导航栏

Uneven Bottom Navigation Bar

xml

android

android-layout

bottomnavigationview