Android约束布局

时间:2018-02-12 01:53:13

标签: android android-constraintlayout

我正在使用布局我的屏幕。除了我希望我的ImageView在其宽度和高度上“match_parent”而不占用整个屏幕之外,一切都设置得很完美。我的布局是这样的:

Label 1
ImageView
Label 2
Button

我希望我的标签占据一些空间,然后我的底部占据屏幕底部。然后,我希望ImageView占用剩余的可用空间。这可能不会杀死我所有的约束吗?现在,当ImageView设置为match_parent时,它会占用整个屏幕并隐藏标签和按钮。

由于

这是代码,请注意,还有TextViews放置在图像的顶部特定位置因此所有空间:

<TextView
    android:id="@+id/wkm_cardiagram_orientation1"
    android:layout_width="match_parent"
    android:layout_height="15dp"
    android:layout_marginBottom="8dp"
    android:layout_marginTop="8dp"
    android:gravity="center"
    android:text="OrientationLabel1"
    android:textColor="@android:color/black"
    android:textSize="12sp"
    app:layout_constraintBottom_toTopOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.502"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.0" />



<ImageView
    android:id="@+id/wkm_cardiagram_img"
    android:layout_width="352dp"
    android:layout_height="416dp"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    android:layout_weight="0"
    android:scaleType="fitXY"
    android:src="@drawable/vehicle_schematic_image"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/wkm_cardiagram_orientation1" />


<Space
    android:id="@+id/pinpoint1"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.063"/>

<TextView
    android:id="@+id/wkm_cardiagram_fbumper"
    android:layout_width="76dp"
    android:layout_height="35dp"
    android:gravity="center"
    android:onClick="carDiagramClicked"
    android:text="FBumper"
    android:textColor="@color/inforRed1"
    android:textStyle="bold"
    app:layout_constraintBottom_toBottomOf="@id/pinpoint1"
    app:layout_constraintEnd_toEndOf="@id/pinpoint1"
    app:layout_constraintStart_toStartOf="@id/pinpoint1"
    app:layout_constraintTop_toTopOf="@id/pinpoint1" />


<Space
    android:id="@+id/pinpointRbumper"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.935"/>




<TextView
    android:id="@+id/wkm_cardiagram_rbumper"
    android:layout_width="93dp"
    android:layout_height="43dp"
    android:layout_alignStart="@+id/wkm_cardiagram_trunk"
    android:layout_below="@+id/wkm_cardiagram_trunk"
    android:gravity="center"
    android:onClick="carDiagramClicked"
    android:text="RBumper"
    android:textColor="@color/inforRed1"
    android:textStyle="bold"
    app:layout_constraintBottom_toBottomOf="@id/pinpointRbumper"
    app:layout_constraintEnd_toEndOf="@id/pinpointRbumper"
    app:layout_constraintStart_toStartOf="@id/pinpointRbumper"
    app:layout_constraintTop_toTopOf="@id/pinpointRbumper"/>


<Space
    android:id="@+id/pinpointFWindshield"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.335"/>

<TextView
    android:id="@+id/wkm_cardiagram_fwindshield"
    android:layout_width="116dp"
    android:layout_height="40dp"
    android:gravity="center"
    android:onClick="carDiagramClicked"
    android:text="FWindshield"
    android:textColor="@color/inforRed1"
    android:textStyle="bold"
    app:layout_constraintBottom_toBottomOf="@id/pinpointFWindshield"
    app:layout_constraintEnd_toEndOf="@id/pinpointFWindshield"
    app:layout_constraintStart_toStartOf="@id/pinpointFWindshield"
    app:layout_constraintTop_toTopOf="@id/pinpointFWindshield" />

<Space
    android:id="@+id/pinpointRWindshield"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.72"/>

<TextView
    android:id="@+id/wkm_cardiagram_rwindshield"
    android:layout_width="117dp"
    android:layout_height="29dp"
    android:gravity="center"
    android:onClick="carDiagramClicked"
    android:text="RWindshield"
    android:textColor="@color/inforRed1"
    android:textStyle="bold"
    app:layout_constraintBottom_toBottomOf="@id/pinpointRWindshield"
    app:layout_constraintEnd_toEndOf="@id/pinpointRWindshield"
    app:layout_constraintStart_toStartOf="@id/pinpointRWindshield"
    app:layout_constraintTop_toTopOf="@id/pinpointRWindshield" />

<Space
    android:id="@+id/pinpointTrunk"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.825"/>

<TextView
    android:id="@+id/wkm_cardiagram_trunk"
    android:layout_width="80dp"
    android:layout_height="33dp"
    android:layout_centerHorizontal="true"
    android:gravity="center"
    android:onClick="carDiagramClicked"
    android:text="Trunk"
    android:textColor="@color/inforRed1"
    android:textStyle="bold"
    app:layout_constraintBottom_toBottomOf="@id/pinpointTrunk"
    app:layout_constraintEnd_toEndOf="@id/pinpointTrunk"
    app:layout_constraintStart_toStartOf="@id/pinpointTrunk"
    app:layout_constraintTop_toTopOf="@id/pinpointTrunk"/>


<Space
    android:id="@+id/pinpointRoof"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.533"/>

<TextView
    android:id="@+id/wkm_cardiagram_roof"
    android:layout_width="113dp"
    android:layout_height="102dp"
    android:gravity="center"
    android:onClick="carDiagramClicked"
    android:text="Roof"
    android:textColor="@color/inforRed1"
    android:textStyle="bold"
    app:layout_constraintBottom_toBottomOf="@id/pinpointRoof"
    app:layout_constraintEnd_toEndOf="@id/pinpointRoof"
    app:layout_constraintStart_toStartOf="@id/pinpointRoof"
    app:layout_constraintTop_toTopOf="@id/pinpointRoof" />

/>

<Space
    android:id="@+id/pinpointHood"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.195"/>

<TextView
    android:id="@+id/wkm_cardiagram_hood"
    android:layout_width="103dp"
    android:layout_height="65dp"
    android:gravity="center"
    android:onClick="carDiagramClicked"
    android:text="Hood"
    android:textColor="@color/inforRed1"
    android:textStyle="bold"
    app:layout_constraintBottom_toBottomOf="@id/pinpointHood"
    app:layout_constraintEnd_toEndOf="@id/pinpointHood"
    app:layout_constraintStart_toStartOf="@id/pinpointHood"
    app:layout_constraintTop_toTopOf="@id/pinpointHood" />

<Space
    android:id="@+id/pinpointPsidefront"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.771"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.275"/>

    <TextView
        android:id="@+id/wkm_cardiagram_psidefront"
        android:layout_width="35dp"
        android:layout_height="90dp"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="PSideFront"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointPsidefront"
        app:layout_constraintEnd_toEndOf="@id/pinpointPsidefront"
        app:layout_constraintStart_toStartOf="@id/pinpointPsidefront"
        app:layout_constraintTop_toTopOf="@id/pinpointPsidefront"/>

<Space
    android:id="@+id/pinpointDsidefront"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.251"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.275"/>

    <TextView
        android:id="@+id/wkm_cardiagram_dsidefront"
        android:layout_width="35dp"
        android:layout_height="110dp"
        android:layout_marginEnd="12dp"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="DSideFront"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointDsidefront"
        app:layout_constraintEnd_toEndOf="@id/pinpointDsidefront"
        app:layout_constraintStart_toStartOf="@id/pinpointDsidefront"
        app:layout_constraintTop_toTopOf="@id/pinpointDsidefront"/>

<Space
    android:id="@+id/pinpointDsidefrontdoor"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.143"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.468"/>

    <TextView
        android:id="@+id/wkm_cardiagram_dsidefrontdoor"
        android:layout_width="28dp"
        android:layout_height="53dp"
        android:layout_above="@+id/wkm_cardiagram_dsidereardoor"
        android:layout_toStartOf="@+id/wkm_cardiagram_dsidefrontwindshield"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="DSideFrontDoor"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointDsidefrontdoor"
        app:layout_constraintEnd_toEndOf="@id/pinpointDsidefrontdoor"
        app:layout_constraintStart_toStartOf="@id/pinpointDsidefrontdoor"
        app:layout_constraintTop_toTopOf="@id/pinpointDsidefrontdoor"/>

<Space
    android:id="@+id/pinpointDsidefrontwindshield"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.236"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.468"/>

    <TextView
        android:id="@+id/wkm_cardiagram_dsidefrontwindshield"
        android:layout_width="28dp"
        android:layout_height="53dp"
        android:layout_alignBaseline="@+id/wkm_cardiagram_dsidefrontdoor"
        android:layout_alignBottom="@+id/wkm_cardiagram_dsidefrontdoor"
        android:layout_alignEnd="@+id/wkm_cardiagram_dsidefront"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="DSideFrontWindshield"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointDsidefrontwindshield"
        app:layout_constraintEnd_toEndOf="@id/pinpointDsidefrontwindshield"
        app:layout_constraintStart_toStartOf="@id/pinpointDsidefrontwindshield"
        app:layout_constraintTop_toTopOf="@id/pinpointDsidefrontwindshield"/>

<Space
    android:id="@+id/pinpointDsidefronttire"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.083"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.245"/>

    <TextView
        android:id="@+id/wkm_cardiagram_dsidefronttire"
        android:layout_width="40dp"
        android:layout_height="53dp"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="DSideFrontTire"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointDsidefronttire"
        app:layout_constraintEnd_toEndOf="@id/pinpointDsidefronttire"
        app:layout_constraintStart_toStartOf="@id/pinpointDsidefronttire"
        app:layout_constraintTop_toTopOf="@id/pinpointDsidefronttire"/>

<Space
    android:id="@+id/pinpointPsidefronttire"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.92"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.245"/>

    <TextView
        android:id="@+id/wkm_cardiagram_psidefronttire"
        android:layout_width="40dp"
        android:layout_height="53dp"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="PSideFrontTire"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointPsidefronttire"
        app:layout_constraintEnd_toEndOf="@id/pinpointPsidefronttire"
        app:layout_constraintStart_toStartOf="@id/pinpointPsidefronttire"
        app:layout_constraintTop_toTopOf="@id/pinpointPsidefronttire"/>


<Space
    android:id="@+id/pinpointDsidereartire"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.083"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.76"/>

    <TextView
        android:id="@+id/wkm_cardiagram_dsidereartire"
        android:layout_width="40dp"
        android:layout_height="48dp"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="DSideRearTire"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointDsidereartire"
        app:layout_constraintEnd_toEndOf="@id/pinpointDsidereartire"
        app:layout_constraintStart_toStartOf="@id/pinpointDsidereartire"
        app:layout_constraintTop_toTopOf="@id/pinpointDsidereartire"/>

<Space
    android:id="@+id/pinpointPsidereartire"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.92"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.76"/>

    <TextView
        android:id="@+id/wkm_cardiagram_psidereartire"
        android:layout_width="40dp"
        android:layout_height="48dp"
        android:layout_alignBaseline="@+id/wkm_cardiagram_rwindshield"
        android:layout_alignBottom="@+id/wkm_cardiagram_rwindshield"
        android:layout_marginStart="9dp"
        android:layout_toEndOf="@+id/wkm_cardiagram_psiderear"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="PSideRearTire"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointPsidereartire"
        app:layout_constraintEnd_toEndOf="@id/pinpointPsidereartire"
        app:layout_constraintStart_toStartOf="@id/pinpointPsidereartire"
        app:layout_constraintTop_toTopOf="@id/pinpointPsidereartire"/>

<Space
    android:id="@+id/pinpointDsiderearwindshield"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.233"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.59"/>

    <TextView
        android:id="@+id/wkm_cardiagram_dsiderearwindshield"
        android:layout_width="28dp"
        android:layout_height="53dp"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="DSideRearWindshield"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointDsiderearwindshield"
        app:layout_constraintEnd_toEndOf="@id/pinpointDsiderearwindshield"
        app:layout_constraintStart_toStartOf="@id/pinpointDsiderearwindshield"
        app:layout_constraintTop_toTopOf="@id/pinpointDsiderearwindshield"/>

<Space
    android:id="@+id/pinpointPsidefrontwindshield"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.77"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.468"/>

    <TextView
        android:id="@+id/wkm_cardiagram_psidefrontwindshield"
        android:layout_width="28dp"
        android:layout_height="53dp"
        android:layout_alignBaseline="@+id/wkm_cardiagram_psidefrontdoor"
        android:layout_alignBottom="@+id/wkm_cardiagram_psidefrontdoor"
        android:layout_toEndOf="@+id/wkm_cardiagram_roof"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="PSideFrontWindshield"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointPsidefrontwindshield"
        app:layout_constraintEnd_toEndOf="@id/pinpointPsidefrontwindshield"
        app:layout_constraintStart_toStartOf="@id/pinpointPsidefrontwindshield"
        app:layout_constraintTop_toTopOf="@id/pinpointPsidefrontwindshield"/>

<Space
    android:id="@+id/pinpointPsiderearwindshield"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.77"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.59"/>

    <TextView
        android:id="@+id/wkm_cardiagram_psiderearwindshield"
        android:layout_width="28dp"
        android:layout_height="53dp"
        android:layout_alignStart="@+id/wkm_cardiagram_psidefrontwindshield"
        android:layout_below="@+id/wkm_cardiagram_psidefrontwindshield"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="PSideRearWindshield"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointPsiderearwindshield"
        app:layout_constraintEnd_toEndOf="@id/pinpointPsiderearwindshield"
        app:layout_constraintStart_toStartOf="@id/pinpointPsiderearwindshield"
        app:layout_constraintTop_toTopOf="@id/pinpointPsiderearwindshield"/>

<Space
    android:id="@+id/pinpointDsidereardoor"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.14"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.59"/>

    <TextView
        android:id="@+id/wkm_cardiagram_dsidereardoor"
        android:layout_width="28dp"
        android:layout_height="53dp"
        android:layout_alignStart="@+id/wkm_cardiagram_dsidefrontdoor"
        android:layout_centerVertical="true"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="DSideRearDoor"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointDsidereardoor"
        app:layout_constraintEnd_toEndOf="@id/pinpointDsidereardoor"
        app:layout_constraintStart_toStartOf="@id/pinpointDsidereardoor"
        app:layout_constraintTop_toTopOf="@id/pinpointDsidereardoor"/>

<Space
    android:id="@+id/pinpointPsidereardoor"
    android:layout_width="1px"
    android:layout_height="1px"
    app:layout_constraintBottom_toBottomOf="@id/wkm_cardiagram_img"
    app:layout_constraintEnd_toEndOf="@id/wkm_cardiagram_img"
    app:layout_constraintHorizontal_bias="0.86"
    app:layout_constraintStart_toStartOf="@id/wkm_cardiagram_img"
    app:layout_constraintTop_toTopOf="@id/wkm_cardiagram_img"
    app:layout_constraintVertical_bias="0.584"/>

    <TextView
        android:id="@+id/wkm_cardiagram_psidereardoor"
        android:layout_width="25dp"
        android:layout_height="48dp"
        android:layout_alignStart="@+id/wkm_cardiagram_psidefrontdoor"
        android:layout_below="@+id/wkm_cardiagram_psidefrontdoor"
        android:gravity="center"
        android:onClick="carDiagramClicked"
        android:text="PSideRearDoor"
        android:textColor="@color/inforRed1"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@id/pinpointPsidereardoor"
        app:layout_constraintEnd_toEndOf="@id/pinpointPsidereardoor"
        app:layout_constraintStart_toStartOf="@id/pinpointPsidereardoor"
        app:layout_constraintTop_toTopOf="@id/pinpointPsidereardoor"/>

<TextView
    android:id="@+id/wkm_cardiagram_orientation2"
    android:layout_width="match_parent"
    android:layout_height="15dp"
    android:layout_marginTop="8dp"
    android:gravity="center"
    android:text="OrientationLabel2"
    android:textColor="@android:color/black"
    android:textSize="12sp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/wkm_cardiagram_img" />


<Button
    android:id="@+id/wkm_cardiagram_submit"
    android:layout_width="match_parent"
    android:layout_height="40dp"
    android:layout_gravity="center_horizontal|center"
    android:layout_marginTop="8dp"
    android:background="@color/btnBlueSelectedStart"
    android:gravity="center"
    android:text="Submit"
    android:paddingRight="5dp"
    android:paddingLeft="5dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintEnd_toStartOf="parent"
    android:textColor="@color/white"
   app:layout_constraintTop_toBottomOf="@id/wkm_cardiagram_orientation2"
    tools:layout_editor_absoluteX="0dp" />

2 个答案:

答案 0 :(得分:2)

试试这个。

<?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">

  <TextView
    android:id="@+id/label1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:textSize="24sp"
    tools:text="Label 1"/>

  <ImageView
    android:id="@+id/image_view"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintTop_toBottomOf="@+id/label1"
    app:layout_constraintBottom_toTopOf="@+id/label2"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    android:src="#aaaaee"/>

  <TextView
    android:id="@+id/label2"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    tools:text="Label 1"
    android:gravity="center_vertical"
    android:textSize="24sp"
    app:layout_constraintBottom_toTopOf="@+id/button"/>

  <Button
    android:id="@+id/button"
    android:layout_width="0dp"
    android:layout_height="64dp"
    android:background="#f7594d"
    android:textColor="@android:color/white"
    android:textSize="22sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    tools:text="BUTTON"/>

</android.support.constraint.ConstraintLayout>

它显示:

sample_image


处理ConstraintLayout时,视图主要由约束定义。

例如,您可以像这样定义一个简单的TextView。

<TextView
  android:id="@+id/label1"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:gravity="center_vertical"
  android:textSize="24sp"
  tools:text="Label 1"/>

使用ConstraintLayout时:

<TextView
  android:id="@+id/label1"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:gravity="center_vertical"
  android:textSize="24sp"
  app:layout_constraintLeft_toLeftOf="parent"
  app:layout_constraintRight_toRightOf="parent"
  tools:text="Label 1"/>

两者都给你相同的结果。我更喜欢第二种方式,但我认为这取决于你。


  - 修改

这是你的ImageView:

<ImageView
  android:id="@+id/wkm_cardiagram_img"
  android:layout_width="352dp"
  android:layout_height="416dp"
  android:layout_marginEnd="8dp"
  android:layout_marginStart="8dp"
  android:layout_marginTop="8dp"
  android:layout_weight="0"
  android:scaleType="fitXY"
  android:src="@drawable/vehicle_schematic_image"
  app:layout_constraintEnd_toEndOf="parent"
  app:layout_constraintStart_toStartOf="parent"
  app:layout_constraintTop_toBottomOf="@+id/wkm_cardiagram_orientation1" />

首先,如果要调整视图的大小,需要将宽度/高度设置为0.如果不是,请手动设置宽度/高度。

<ImageView
  android:id="@+id/wkm_cardiagram_img"
  android:layout_width="0dp"
  android:layout_height="0dp"
  android:layout_marginEnd="8dp"
  android:layout_marginStart="8dp"
  android:layout_marginTop="8dp"
  android:layout_weight="0"
  android:scaleType="fitXY"
  android:src="#fff999"
  app:layout_constraintEnd_toEndOf="parent"
  app:layout_constraintStart_toStartOf="parent"
  app:layout_constraintTop_toBottomOf="@+id/wkm_cardiagram_orientation1"
  app:layout_constraintBottom_toTopOf="@+id/wkm_cardiagram_orientation2"/>

其次,这是你的label2和按钮..看起来像底部没有约束。所以我放了一些代码。

<TextView
  android:id="@+id/wkm_cardiagram_orientation2"
  android:layout_width="match_parent"
  android:layout_height="15dp"
  android:layout_marginTop="8dp"
  android:gravity="center"
  android:text="OrientationLabel2"
  android:textColor="@android:color/black"
  android:textSize="12sp"
  app:layout_constraintEnd_toEndOf="parent"
  app:layout_constraintHorizontal_bias="0.0"
  app:layout_constraintStart_toStartOf="parent"
  app:layout_constraintTop_toBottomOf="@+id/wkm_cardiagram_img"
  >> app:layout_constraintBottom_toTopOf="@+id/wkm_cardiagram_submit"/>


<Button
  android:id="@+id/wkm_cardiagram_submit"
  android:layout_width="match_parent"
  android:layout_height="40dp"
  android:layout_gravity="center_horizontal|center"
  android:layout_marginTop="8dp"
  android:background="@color/btnBlueSelectedStart"
  android:gravity="center"
  android:text="Submit"
  android:paddingRight="5dp"
  android:paddingLeft="5dp"
  app:layout_constraintEnd_toEndOf="parent"
  app:layout_constraintEnd_toStartOf="parent"
  android:textColor="@color/white"
  app:layout_constraintTop_toBottomOf="@id/wkm_cardiagram_orientation2"
  tools:layout_editor_absoluteX="0dp"
  >> app:layout_constraintBottom_toBottomOf="parent"/>


确保你应用了所有必需的约束..!

供参考:ConstraintLayout Reference by Google

答案 1 :(得分:2)

非常简单@mint。最初不要使代码过于复杂。尝试建立我给你的简单结构。

  • 为主体创建RelativeLayout。
  • 在RelativeLayout中,创建您想占用空间的任何布局,并将其宽度和高度指定为“匹配父母”。
  • 然后创建另一个布局(如果你想在屏幕底部有一个条形,最好是一个水平的LinearLayout - 你可以放置你想要的多个按钮)。
  • 在属性

    后分配此其他布局

    机器人:layout_alignParentBottom =&#34;真&#34;

你完成了!使用以下代码作为示例(它是一个滚动视图,底部有一个固定条/按钮):

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </ScrollView>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimary"
        android:layout_alignParentBottom="true">

        <android.support.v7.widget.AppCompatTextView
            android:id="@+id/submitButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="SUBMIT"
            />
    </LinearLayout>

</RelativeLayout>