web-dev-qa-db-fra.com

Conversion de LinearLayout en problème ConstraintLayout

J'essaie de convertir une LinearLayout horizontale comportant 4 boutons de même taille en un ConstraintLayout. Le problème est que lorsque je règle un ou plusieurs boutons sur Android:visibility="gone" dans LinearLayout, les boutons restants sont redimensionnés pour occuper tout l'espace tous auront la même taille) et dans la ConstraintLayout, les boutons sont supprimés, tout en prenant de la place.

EDIT: En fonction de l'état de l'application, différents boutons seront visibles.

Que dois-je changer pour que la ConstraintLayout se comporte comme la LinearLayout?

EDIT: J'ai trouvé une erreur dans ConstraintLayout (références de contrainte), je l'ai donc mise à jour et les images (le problème existe toujours).

LinearLayout xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:orientation="horizontal">

    <Button
        Android:id="@+id/b1"
        Android:text="B1"
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:layout_weight="50"
        />

    <Button
        Android:id="@+id/b2"
        Android:text="B2"
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:layout_weight="50"
        Android:visibility="gone"
        />

    <Button
        Android:id="@+id/b3"
        Android:text="B3"
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:layout_weight="50"
        />

    <Button
        Android:id="@+id/b4"
        Android:text="B4"
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:layout_weight="50"
        />
</LinearLayout>

EDIT:ConstraintLayout xml:

<?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/b1"
        Android:text="B1"
        Android:layout_width="0px"
        Android:layout_height="wrap_content"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/b2"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintHorizontal_weight="1"
        />

    <Button
        Android:id="@+id/b2"
        Android:text="B2"
        Android:layout_width="0px"
        Android:layout_height="wrap_content"
        Android:visibility="gone"
        app:layout_constraintLeft_toRightOf="@+id/b1"
        app:layout_constraintRight_toLeftOf="@+id/b3"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintHorizontal_weight="1"
        />

    <Button
        Android:id="@+id/b3"
        Android:text="B3"
        Android:layout_width="0px"
        Android:layout_height="wrap_content"
        app:layout_constraintLeft_toRightOf="@+id/b2"
        app:layout_constraintRight_toLeftOf="@+id/b4"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintHorizontal_weight="1"
        Android:layout_marginTop="0dp"/>

    <Button
        Android:id="@+id/b4"
        Android:text="B4"
        Android:layout_width="0px"
        Android:layout_height="wrap_content"
        app:layout_constraintLeft_toRightOf="@+id/b3"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintHorizontal_weight="1"
        />
</Android.support.constraint.ConstraintLayout>

 LinearLayout vs ConstraintLayout  ConstraintLayout blueprint

androidandroid-layoutandroid-constraintlayout
8
Hanan

Vous pouvez facilement convertir n’importe quelle mise en page en ConstraintLayout, en suivant simplement les instructions suivantes:

  1. Accédez à l'onglet Conception dans l'éditeur de disposition d'Android Studio.
  2. Ouvrir l'arborescence des composants
  3. Faites un clic droit sur le LinearLayout (ou une autre disposition) que vous voulez convertir
  4. Cliquez sur "Convertir LinearLayout en ConstraintLayout".

10
Ahmad

Vous pouvez probablement changer votre mise en page pour quelque chose comme:

<?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"
    Android:orientation="horizontal">

    <Button
        Android:id="@+id/b1"
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:text="B1"
        app:layout_constraintBaseline_toBaselineOf="@+id/b3"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/b3"
        tools:layout_constraintBaseline_creator="1"
        tools:layout_constraintLeft_creator="1"
        tools:layout_constraintRight_creator="1" />

    <Button
        Android:id="@+id/b2"
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:text="B2"
        Android:visibility="gone"
        app:layout_constraintBottom_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:layout_constraintBottom_creator="1"
        tools:layout_constraintLeft_creator="1"
        tools:layout_constraintRight_creator="1"
        tools:layout_constraintTop_creator="1" />

    <Button
        Android:id="@+id/b3"
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:layout_marginEnd="128dp"
        Android:layout_marginLeft="128dp"
        Android:layout_marginRight="128dp"
        Android:layout_marginStart="128dp"
        Android:text="B3"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:layout_constraintLeft_creator="1"
        tools:layout_constraintRight_creator="1"
        tools:layout_constraintTop_creator="1" />

    <Button
        Android:id="@+id/b4"
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:text="B4"
        app:layout_constraintBaseline_toBaselineOf="@+id/b3"
        app:layout_constraintLeft_toRightOf="@+id/b3"
        app:layout_constraintRight_toRightOf="parent"
        tools:layout_constraintBaseline_creator="1"
        tools:layout_constraintLeft_creator="1"
        tools:layout_constraintRight_creator="1" />

</Android.support.constraint.ConstraintLayout>

Si vous rencontrez des difficultés pour passer d'une mise en page existante à ConstraintLayout, vous pouvez essayer les outils de conception internes d'Android Studio. Vous pouvez basculer vers Conception onglet et ouvrir Arborescence des composants fenêtre, faites un clic droit sur l'élément que vous souhaitez convertir et sélectionnez Convertir en constraintlayout .

1
Kamran Ahmed