Question

我想要获得的是：Preview 我得到的Preview 如何达到想要的结果？我使用以下代码：

     <androidx.coordinatorlayout.widget.CoordinatorLayout
    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"
    tools:context=".Home"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >


    <com.google.android.material.bottomnavigation.BottomNavigationView

        android:id="@+id/navView"

        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"

        app:menu="@menu/navigation"

        app:labelVisibilityMode="labeled"

        />
    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_add_black_24dp"
        app:layout_anchorGravity="center"
        app:backgroundTint="@color/colorPrimary"
        app:fabSize="normal"
        app:layout_anchor="@id/navView"
        />

        <com.google.android.material.bottomappbar.BottomAppBar
            android:id="@+id/bottomAppBar"
            style="@style/Widget.MaterialComponents.BottomAppBar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            app:fabCradleRoundedCornerRadius="0dp"
            app:fabCradleMargin="0dp"
            app:backgroundTint="#FFFFFF"
            app:buttonGravity="bottom"
            />
    </androidx.coordinatorlayout.widget.CoordinatorLayout>

Answer 1

Implement your code in below code. For More explanation can be found in the design documentation.

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

  <!-- Other components and views -->

  <com.google.android.material.bottomappbar.BottomAppBar
      android:id="@+id/bar"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_gravity="bottom"
      app:navigationIcon="@drawable/ic_menu_24"/>

  <com.google.android.material.floatingactionbutton.FloatingActionButton
      android:id="@+id/fab"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      app:layout_anchor="@id/bar"/>

</android.support.design.widget.CoordinatorLayout>

Answer 2

您可以使用类似的内容：

  <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:fabCradleVerticalOffset="0dp"
      app:fabCradleRoundedCornerRadius="0dp"
      app:fabCradleMargin="0dp"
      app:contentInsetStart="0dp"
      >

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:menu="@menu/...."
        android:layout_gravity="bottom"
      />

  </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"
      app:layout_anchor="@id/bottom_app_bar"
      android:layout_gravity="bottom|center"
      />

是否有将浮动操作按钮与底部导航视图结合在一起的库？

2 个答案: