BottomAppBarのアイコンは、通常のツールバーのアイコンと同じように、通常のアクションアイコンです。したがって、rightに位置合わせされるため、最初の図のように実際に配置することはできません。
ただし、次のようにBottomAppBar内に BottomNavigationView をネストすることで、視覚的に類似したものを実現できました。
<com.google.Android.material.bottomappbar.BottomAppBar
Android:id="@+id/bottom_app_bar"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:layout_gravity="bottom"
app:fabAlignmentMode="center"
app:fabAnimationMode="scale"
app:hideOnScroll="true"
app:layout_scrollFlags="scroll|enterAlways">
<com.google.Android.material.bottomnavigation.BottomNavigationView
Android:id="@+id/navigation"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:layout_marginRight="16dp"
app:menu="@menu/bottom_navigation_menu" />
</com.google.Android.material.bottomappbar.BottomAppBar>
<com.google.Android.material.floatingactionbutton.FloatingActionButton
Android:id="@+id/fab"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:src="@drawable/fab_icon"
app:layout_anchor="@id/bottom_app_bar" />
BottomNavigationViewに余分なAndroid:layout_marginRight="16dp"
属性があることに気付くかもしれません。削除しようとすると、BottomNavigationViewが右に押され、中央に正しく配置されていないことがわかります。したがって、右マージンを追加することにより、完全に位置合わせされます。
BottomNavigationViewの実装をガイドするチュートリアルは次のとおりです。 https://code.tutsplus.com/tutorials/how-to-code-a-bottom-navigation-bar-for-an-Android-app-- cms-30305
これが正しい方法かどうかはわかりませんが、機能します。ハッピーコーディング!