ConstraintLayout在底部工作表视图中无法正常工作

时间:2018-11-02 02:06:23

标签: android android-layout android-constraintlayout android-relativelayout

问题

在底表中使用时,ConstraintLayout不能按预期工作。在这种情况下,ConstraintLayout包含2张图像,其中包括手柄和1张底页中内容的视图。应该将内容视图放置在未发生的手柄图像下方。

实施

<androidx.constraintlayout.widget.ConstraintLayout
            android:id="@+id/bottomSheet"
            android:layout_width="match_parent"
            android:layout_height="350dp"
            app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">

            <ImageView
                android:id="@+id/bottom_handle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:background="@drawable/ic_bottom_sheet_handle"
                android:contentDescription="@string/saved_bottomsheet_handle_content_description"
                android:elevation="16dp"
                android:src="@drawable/ic_save_planet_dark_48dp"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="@dimen/bottom_sheet_elevation_height"
                android:background="@color/bottom_sheet_handle_elevation"
                android:contentDescription="@string/saved_bottomsheet_handle_content_description"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@id/bottom_handle" />

            <FrameLayout
                android:id="@+id/savedContentContainer"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@android:color/white"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@id/bottom_handle" />

        </androidx.constraintlayout.widget.ConstraintLayout>

结果

内容视图中的操作栏浮动在手柄视图的后面。

enter image description here

预期结果

手柄位于内容视图和操作栏上方。

enter image description here

可能的解决方案

我宁愿在ConstraintLayout而不是RelativeLayout上使用,RelativeLayout在这里也可以使用。

<RelativeLayout
            android:id="@+id/bottomSheet"
            android:layout_width="match_parent"
            android:layout_height="350dp"
            android:elevation="16dp"
            app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">

            <ImageView
                android:id="@+id/bottom_handle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:background="@drawable/ic_bottom_sheet_handle"
                android:contentDescription="@string/saved_bottomsheet_handle_content_description"
                android:elevation="16dp"
                android:layout_alignParentTop="true"
                android:layout_centerHorizontal="true"
                android:src="@drawable/ic_save_planet_dark_48dp" />

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="@dimen/bottom_sheet_elevation_height"
                android:background="@color/bottom_sheet_handle_elevation"
                android:contentDescription="@string/saved_bottomsheet_handle_content_description"
                android:layout_alignBottom="@id/bottom_handle"/>

            <FrameLayout
                android:layout_below="@id/bottom_handle"
                android:id="@+id/savedContentContainer"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@android:color/white" />

        </RelativeLayout>

2 个答案:

答案 0 :(得分:1)

尝试通过在约束布局中更改

<FrameLayout
 ....

     android:layout_height="wrap_content"
     android:layout_width= "wrap_content"
>

答案 1 :(得分:1)

不建议按照documentation中所述,为match_parent的孩子使用ConstraintLayout

  

重要提示:不建议将MATCH_PARENT用于包含在   ConstraintLayout。可以通过使用定义类似的行为   MATCH_CONSTRAINT与相应的左/右或上/下   约束设置为“父”。

在您的情况下,将match_parent的高度设置为FrameLayout会使它采用父级的高度,而不受约束。

您应该为match_parent添加底部约束,并使用FrameLayout0dp来设置高度:

match_constraint