以编程方式添加菜单项时，BottomNavigationView 布局损坏

Question

出于某种原因，BottomNavigationView 在布局中有一个视觉错误。 有谁知道有什么方法可以解决它？ 单击任何按钮或最小化应用程序并恢复它后，问题就会解决。

这是它应该看起来的样子：

当菜单通过 XML 膨胀时，一切正常。

<com.google.android.material.bottomnavigation.BottomNavigationView
        android:layout_width="match_parent"
        android:layout_height="56dp"
        ...
        app:menu="@menu/bottom_navigation_4_game" />

当我以编程方式添加 MenuItem 时：

navigationView.menu.clear()
navigationView.inflateMenu(R.menu.bottom_navigation4)

我们可能会在 LayoutInspector 中看到，实际上有 5 个项目，但其中两个是重叠的，没有看到：

问题可能出在BottomNavigationMenuView 。 在 LayoutInspector 中getWidth()返回 0。使视图无效并没有帮助。

Answer 1

如果您尝试使用 2 个不同的菜单项集创建动态 BottomNavigationView，

因此，不要动态添加菜单项，而是使用 2 个不同的 xml 布局（它们定义了 2 个不同的 app:menu 属性），然后根据条件在代码中在它们之间切换。

因此，XML 将如下所示：

<BottomNavigationView
                android:id="@+id/bottom_navigation"
                android:layout_width="match_parent"
                android:layout_height="@dimen/bottom_bar_height"
                app:elevation="8dp"
                app:itemIconTint="?attr/nav_item_color_state_red"
                app:itemTextColor="?attr/nav_item_color_state_red"
                app:labelVisibilityMode="labeled"
                app:menu="@menu/bottom_navigation_1" />


            <BottomNavigationView
                android:id="@+id/bottom_navigation_mini_player"
                android:layout_width="match_parent"
                android:layout_height="@dimen/bottom_bar_height"
                app:elevation="8dp"
                app:itemIconTint="?attr/nav_item_color_state_red"
                app:itemTextColor="?attr/nav_item_color_state_red"
                app:labelVisibilityMode="labeled"
                app:menu="@menu/bottom_navigation_2" />

Answer 2

我在应用程序中发现了一个奇怪的代码块，这是罪魁祸首。 事实证明，TransitionManager 并没有用 ConstraintLayout 结束它的转换。 这段代码： updateConstraints {}在动态更改 BottomNavigationView 后立即被调用，因此它的子视图转换被中断，我猜。

private fun updateConstraints(f: ConstraintSet.() -> Unit) {
    TransitionManager.beginDelayedTransition(root)
    val set = ConstraintSet().apply { clone(root) }
    set.f()
    set.applyTo(root)
}