Comment remplir l'écran avec deux vues dans ConstraintLayout?

Question

J'essaie de mettre un bouton en haut de l'écran et en dessous un ImageView qui doit remplir l'écran (toutes les tailles d'écran). Dans RelativeLayout, ça semble facile à faire, mais dans le ConstraintLayout, je n'arrive pas à le faire.

Here is an example of what it's look like in RelativeLayout:

et le code XML:

<Button 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:text="Download Image" 
    android:id="@+id/button" 
    android:layout_alignParentTop="true" 
    android:layout_alignParentStart="true" 
    android:onClick="downloadImage" /> 

<ImageView 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:id="@+id/imageView" 
    android:layout_below="@+id/button" 
    android:layout_alignParentStart="true" /> 

Merci pour votre aide, Shay.

Answer 1

<Button 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:text="Download Image" 
    android:id="@+id/button" 
    android:layout_alignParentTop="true" 
    android:layout_alignParentStart="true" 
    android:onClick="downloadImage" 
    app:layout_constraintLeft_toLeftOf="parent" 
    app:layout_constraintRight_toRightOf="parent" 
    app:layout_constraintTop_toTopOf="parent"/> 

<ImageView 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:id="@+id/imageView" 
    android:layout_below="@+id/button" 
    android:layout_alignParentStart="true" 
    app:layout_constraintLeft_toLeftOf="parent" 
    app:layout_constraintRight_toRightOf="parent" 
    app:layout_constraintTop_toBottomOf="@+id/button" 
    app:layout_constraintBottom_toBottomOf="parent"/> 

Le bouton doit avoir les contraintes gauche, droite et supérieure avec le parent.

Et ImageView doit avoir des contraintes gauche, droite, inférieure avec la contrainte parent et supérieure avec le fond du bouton.

Answer 2

Peut-être que je ne l'ai pas understod complètement votre question, mais ce que j'ai fait pour recréer l'image que vous avez donné comme exemple:

<?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/button2" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="8dp" 
     android:layout_marginRight="8dp" 
     android:layout_marginTop="8dp" 
     android:text="Button" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toTopOf="parent" /> 

    <ImageView 
     android:id="@+id/imageView27" 
     android:layout_width="0dp" 
     android:layout_height="0dp" 
     android:layout_marginBottom="8dp" 
     android:layout_marginLeft="8dp" 
     android:layout_marginRight="8dp" 
     android:layout_marginTop="8dp" 
     app:layout_constraintBottom_toBottomOf="parent" 
     app:layout_constraintHorizontal_bias="0.59" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toBottomOf="@+id/button2" 
     app:srcCompat="@drawable/common_google_signin_btn_icon_dark" /> 
</android.support.constraint.ConstraintLayout> 

et le résultat:

Answer 3

En fait fill_parent propriété est obsolète. donc utiliser 0DP pour remplir l'espace disponible du ConstraintLayout

Pour votre utilisation question du code ci-dessous pour afficher Bouton au haut de l'écran et sous un ImageView qui va certainement remplir l'écran (pour toutes les tailles d'écran).

<?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="0dp" 
     android:layout_height="wrap_content" 
     android:onClick="downloadImage" 
     android:text="Download Image" 
     app:layout_constraintEnd_toEndOf="parent" 
     app:layout_constraintStart_toStartOf="parent" 
     app:layout_constraintTop_toTopOf="parent" /> 

    <ImageView 
     android:id="@+id/imageView" 
     android:layout_width="0dp" 
     android:layout_height="0dp" 
     app:layout_constraintBottom_toBottomOf="parent" 
     app:layout_constraintEnd_toEndOf="parent" 
     app:layout_constraintStart_toStartOf="parent" 
     app:layout_constraintTop_toBottomOf="@+id/button" /> 
</android.support.constraint.ConstraintLayout> 

Note: Si vous voulez ajouter la marge/padding ensuite appliquer à la mise en page ou d'une vue selon vos besoins. mais lorsque vous ajoutez une marge à la vue à l'intérieur de ConstraintLayout, cette vue doit avoir une contrainte pour ce côté particulaire.