将 ImageView 放在 ConstraintLayout 中的按钮顶部

Question

将ImageView或FrameLayout放在Button之上时，我遇到了constraintlayout布局问题。

当我尝试在FrameLayout上膨胀一个fragment时，作为活动一部分的按钮在片段 UI 顶部可见。

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="button"/>

    <FrameLayout
        android:background="@color/blue"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </FrameLayout>

</android.support.constraint.ConstraintLayout>

Answer 1

要将按钮和 FrameLayout 的约束设置为 Button：

    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"

框架布局：

    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/button"

Answer 2

要将任何视图放置在另一个视图之上，您必须提供如下适当的约束。

适当地给予顶部和底部约束，并且当我将所有约束（开始，结束，顶部，底部）赋予 FrameLayout 时，它的高度和宽度赋予 0dp（您不能使用高度来match_parent否则它会覆盖整个屏幕和重叠按钮）。

>

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
        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">


    <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="button"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"/>

    <FrameLayout
            android:background="@color/colorPrimary"
            android:layout_width="0dp"
            android:layout_height="0dp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toTopOf="@+id/button"/>
    
</android.support.constraint.ConstraintLayout>

Answer 3

您的代码看起来不错，但是如果您想在 ConstraintLayout 中告诉 1 个视图位于另一个视图上方，您可以转到设计选项卡并将较高的视图移至较低视图的上方：

例子：

在图像中，您可以看到按钮位于 frameLayout 下方，因此他将低于 frameLayout（frameLayout 将位于按钮上方）

---

此外，您在按钮上遗漏了一些限制：

  <Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="button"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@+id/frameLayout2" />

<FrameLayout
    android:id="@+id/frameLayout2"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
</FrameLayout>

如果所有这些都没有帮助你检查这个线程，正如@Xavier Rubio Jansana所说，那可能是因为海拔。

Answer 4

试试下面的代码

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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"
    android:layout_width="match_parent"
android:layout_height="match_parent">


    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:text="button"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="638dp"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginBottom="8dp"
        android:background="@color/appGrey"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button">

    </FrameLayout>

</android.support.constraint.ConstraintLayout>