简体   繁体   English

Android约束布局

[英]Android Constraint Layout

I'm using to layout my screen. 我用来布置屏幕。 Everything is set up perfectly except that I want my ImageView to "match_parent" on its width and height without taking up the entire screen. 除了我希望ImageView在宽度和高度上“ match_parent”而不占用整个屏幕外,其他所有设置都完美设置。 My layout is like this: 我的布局是这样的:

Label 1
ImageView
Label 2
Button

I want my labels to take up some space and then my bottom at the bottom of the screen. 我希望我的标签占用一些空间,然后让我的底部占用屏幕的底部。 I then want the ImageView to take up the rest of the available space. 然后,我希望ImageView占用剩余的可用空间。 Is that possible without killing all my Constraints? 在不消除我所有约束的情况下有可能吗? Right now, when ImageView is set to match_parent it takes up the entire screen and hides the Labels and buttons. 现在,当ImageView设置为match_parent时,它将占据整个屏幕并隐藏Labels和按钮。

Thanks 谢谢

Here is the code, note that there are also TextViews that are laid ontop of the image in particular positions hence all the Space's: 这是代码,请注意,还有TextViews放置在图像的特定位置上,因此放置了所有Space:

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

Try this. 尝试这个。

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

It shows: 表明:

sample_image


When you deal with ConstraintLayout, views are mostly defined by constraints . 当您处理ConstraintLayout时,视图主要是由constraints定义的。

For example, you can define a simple TextView like this. 例如,您可以像这样定义一个简单的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"/>

When you use ConstraintLayout: 使用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"/>

Both give you the same result. 两者都给您相同的结果。 I prefer the second way, but I think that is up to you. 我更喜欢第二种方式,但是我认为这取决于您。


-- Edit -编辑

This is your ImageView: 这是您的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" />

First, If you want to adjust the size of the view, you need to set your width/height to 0. If not, set your width/height manually. 首先,如果要调整视图的大小,则需要将宽度/高度设置为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"/>

Second, this is your label2 and the button.. Look's like there is no constraint to the bottom. 其次,这是您的label2和按钮。看起来像没有底部约束。 So I put some codes. 所以我写了一些代码。

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


make sure you applied all required constraints..! 确保已应用所有必需的约束..!

For reference: ConstraintLayout Reference by Google 供参考: Google ConstraintLayout参考

Very easy @mint. 非常简单@mint。 Dont make the code overcomplicated initially. 最初不要使代码过于复杂。 Try to build up on the simple structure I'll give you. 尝试建立在我将给您的简单结构上。

  • Create a RelativeLayout for the main body. 为主体创建一个RelativeLayout。
  • In the RelativeLayout create whatever layout you want to occupy the space and assign its width and height to 'matchparent'. 在RelativeLayout中,创建要占用空间的任何布局,并将其宽度和高度分配给“ matchparent”。
  • Then create another layout (preferably a horizontal LinearLayout if you want a bar on the bottom of the screen -- you can put however much buttons you want to it). 然后创建另一个布局(如果希望在屏幕底部放置一个栏,则最好是水平LinearLayout -您可以在其中放置任意数量的按钮)。
  • Assign this other layout following property 将此其他布局分配给属性

    android:layout_alignParentBottom="true" android:layout_alignParentBottom =“ true”

You're done! 你完成了! Use the following code as an example (it's a scroll view with a stationary bar/button at the bottom): 使用以下代码作为示例(这是一个滚动视图,底部带有固定的条形/按钮):

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM