用于放大所选项目的底部导航栏

Question

我想在我的 Android 项目中创建一个底部导航栏。导航栏中有 5 个项目（只是项目图标。没有任何项目的名称）。我想以某种方式制作它，以便在选择一个项目时将其放大一点并显示其名称。我该怎么做？

P.S。 - 我改为尝试使用其中有图像按钮的图像视图。一个非放大图标图像按钮和相应的放大图标（+它的名称）图像按钮重叠，设置一个可见和另一个不可见，但这是一个坏主意。代码有效，但布局非常糟糕和混乱。

Answer 1

您可以使用 android 支持库中的 BottomNavigationView。

使用下面的依赖-

implementation 'com.android.support:design:26.1.0'

并在 xml 文件中为底部导航栏使用以下内容-

<android.support.design.widget.BottomNavigationView
    android:id="@+id/navigation"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:menu="@menu/navigation" />

注意 - 要使放大行为起作用，您的 BottomNavigationView 中需要有 3 个以上的项目。

Answer 2

回答提示：

答案：

这是默认行为，如果您使用最新的 support:design 库然后实现您的 BottomNavigationView。正如我上面的评论所述；在你的问题下方。

一些用于实现底部导航视图的链接（如果您用 google 搜索它们，您会很容易得到）：

1] How to Code a Bottom Navigation Bar for an Android App

2] Android Working with Bottom Navigation

提示：

但是从上述链接中获得的知识的问题是； Material 设计文档 告诉我们，如果底部导航有：

3 项 — 我们应该为所有项显示带有文本的图标（始终）。

4–5 项 — 我们应该只显示活动图标的文本，隐藏非活动项目（或视图）。

现在，你可能已经猜到我接下来要说什么了。

“这就是 Material 设计指南的建议，所以我们就这样做吧。”

但这次我不会。我不同意，你也不同意。我来告诉你为什么。

Material 设计指南并不总是正确的。

Whether you have 3 or 5 items in your Bottom Navigation, ALWAYS show text labels!

这样做，您将避免 Mystery Meat Navigation problem that plagues Material Design. Shoutout to Teo Yu Siang 意识到这一点！

Buttons or links that don’t explain to you what they do. Instead, you have to click on them to find out — Mystery Meat Navigation.

我敢肯定，至少在某些时候我们都是这件事的受害者。我们点击一个按钮，假设它会做某事，结果它却完全做了其他事情！

所以请帮自己和您的用户一个忙。始终显示底部导航图标的文本标签。

通过提及这个（例如）：bottomNavigation.setTitleState(AHBottomNavigation.TitleState.ALWAYS_SHOW);

我尽了自己的一份力量来提供良好的用户体验。其他就靠你了

提示 -- 来源和来源： Ultimate Guide to Bottom Navigation on Android

用于放大所选项目的底部导航栏

Bottom navigation bar to magnify selected item

android

android-bottomnav