Question

我可以使用fab按钮进行卡视图。我可以将fab按钮锚定在卡片视图中，但在这里我要制作一个看起来像BottomAppBar（材料设计）的卡片视图。

代码

 <?xml version="1.0" encoding="utf-8"?>
    <androidx.coordinatorlayout.widget.CoordinatorLayout 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"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        tools:context=".fragments.ViewHistoryFragment"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        style="@style/Widget.MaterialComponents.BottomAppBar">

    <!--    style="@style/Widget.MaterialComponents.BottomAppBar"-->

        <com.google.android.material.card.MaterialCardView
            android:id="@+id/cv"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            style="@style/Widget.MaterialComponents.CardView">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:background="#C3EFC2">


                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="sdfkjgasdfjasdf"/>
                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="sdfkjgasdfjasdf"/>

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="sdfkjgasdfjasdf"/>

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="sdfkjgasdfjasdf"/>


            </LinearLayout>

        </com.google.android.material.card.MaterialCardView>

        <com.google.android.material.floatingactionbutton.FloatingActionButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_anchor="@id/cv"
            android:src="@mipmap/ic_launcher"
            android:layout_marginEnd="@dimen/margin8"
           app:layout_anchorGravity="bottom|right|end"
            app:borderWidth="@dimen/margin8"
            app:backgroundTint="#343433" />

    </androidx.coordinatorlayout.widget.CoordinatorLayout>

我想要这种类型的，这意味着我希望在矿卡视图中使用该托架的直径。 attached my wanted output

任何人的建议都会受到赞赏。

Answer 1

您可以向MaterialCardView和EdgeTreatment申请：

    BottomAppBarTopEdgeTreatment bottomAppBarTopEdgeTreatment = new BottomAppBarTopEdgeTreatment(
            fabMargin),
            roundedCornerRadius,
            cradleVerticalOffset
    );
    bottomAppBarTopEdgeTreatment.setFabDiameter(fabSize);

    MaterialCardView cardView = findViewById(R.id.card);
    cardView.setShapeAppearanceModel( cardView.getShapeAppearanceModel().toBuilder()
            .setTopEdge(bottomAppBarTopEdgeTreatment)
            .build());

然后将Fab锚定到CardView：

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/fab"
    app:layout_anchorGravity="top|center"
    app:layout_anchor="@id/card"
    .../>

<com.google.android.material.card.MaterialCardView
    android:id="@+id/card"
    ../>

带有Fab按钮的卡片视图，例如“材料”底部的应用栏

1 个答案: