ConstraintLayout - Zentrierung Ansichten neben einander vertikal oder horizontal
Wie zu zentrieren, ausrichten, 3-Tasten mit nebeneinander vertikal mit ConstraintLayout
?
Klar zu sein, ich umwandeln wollen, dieses einfache layout-Struktur in flat UI mit ConstraintLayout
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="vertical">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</FrameLayout>
Habe ich erhalten Sie eine nächste Lösung wie folgt
<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"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="@+id/button2"
/>
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
tools:layout_conversion_absoluteHeight="48dp"
tools:layout_conversion_absoluteWidth="88dp"
tools:layout_conversion_absoluteX="148dp"
tools:layout_conversion_absoluteY="259dp"
app:layout_constraintBottom_toTopOf="@+id/button3"
app:layout_constraintTop_toBottomOf="@+id/button"
app:layout_constraintRight_toRightOf="parent"/>
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
tools:layout_conversion_absoluteHeight="48dp"
tools:layout_conversion_absoluteWidth="88dp"
tools:layout_conversion_absoluteX="148dp"
tools:layout_conversion_absoluteY="307dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button2"
app:layout_constraintRight_toRightOf="parent"/>
</android.support.constraint.ConstraintLayout>
Aber klar, Sie können sehen, dass die erhaltene Leistung nicht zu dem passen, benötigt man. ich will keine Marge oder der Raum zwischen der 3 Tasten, alles was ich will ist die Mitte ausrichten, die 3 Tasten neben einander senkrecht, gerade wie Sie sind in eine LinearLayout
hat eine vertikale Ausrichtung.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Richtige Lösung
Es ist gut, dass Sie erstellt haben, die Kette zwischen den 3 Ansichten. Mit einer Kette können Sie die Kette "Stil" und es wird beeinflussen, wie Ansichten sind verteilt entlang der Kette-Achse. Die Kette Stil kann gesteuert werden durch "chain" - button rechts unten die Ansicht:
Klicken Sie auf es paar mal Umschalten zwischen allen 3 Modi:
verbreiten (default)
spread_inside
verpackt
Wie Sie sehen können -
packed
ist die eine, die Sie möchten.Einstellung der Kette Stil wird im Ergebnis Folgendes Attribut hinzufügen, um das erste Kind in der Kette, so kann man es auch von XML:
app:layout_constraintVertical_chainStyle="packed"
Naive Lösung
Vorgeschlagenen Lösung in der anderen Antwort kann so Aussehen, dass es funktioniert, aber in Wirklichkeit ist es nicht eine richtige Lösung für dein problem. Betrachten Sie den Fall, wenn Sie Ansichten mit unterschiedlichen Höhen, können sagen, der untere größer ist. Diese Lösung Schloss der mittleren Ansicht in der Mitte und die position "andere Ansichten" oben und unten. Es wird nicht in ein "zentriert Gruppe" (nur die mittlere Sicht wäre zentriert). Sie können sehen, der Vergleich im Bild unten:
app:layout_constraintVertical_chainStyle="packed"
die Ansicht unterstützt diese Eigenschaft gehen?app:layout_constraintBottom_toTopOf="@id/view2"
attritbute und unten braucht manapp:layout_constraintTop_toBottomOf="@id/view1"
. Sie können diese mit dem visual editor statt in der XML. Alternativ können Sie mehrere Ansichten in der Ansicht bietet, mit der rechten Maustaste und fügen Sie die Kette dort.Von Android Studio Layout-Editor'
drag-and-drop drei buttons in Android Studio das Layout-Editor'
Wählen Sie diese Tasten zusammen mit Maus
Pack Sie Sie vertikal mit der 'pack' - Taste im Layout-Editor'
Ausrichten, dass Sie Mitte horizontal mit 'Align-Center horizontal' - Knopf
Ausrichten vertikal zentrieren mit Hilfe der "Ausrichten-vertikal Zentrieren" - Taste
Von xml
pack alle diese drei Schaltflächen in einer vertikal verpackt Kette mit
hinzufügen von Links und rechts Einschränkungen für alle diese drei Tasten als
parent
ConstraintLayout
richtig.ConstraintLayout
Sie sollten nur diechainStyle
Attribut, die andere Lösung ist wirklich mehr wie ein hack, um das zu erreichen "zentrieren einer Gruppe", das nur erscheint, um der Lösung des Problems von der Frage. Wenn es eine richtige Lösung vs falsche ein, warum würde jemand jemals wollen würde zu verwenden die falschen ein...? Ketten sind speziell entwickelt, um zu lösen die "Gruppierung" - problem. Sie dennoch fördern die falsche Lösung als eine akzeptierte Antwort sowie ein Teil Ihrer Antwort. Es wird sich nur täuschen, andere Entwickler, die versuchen, dieses problem zu lösen, in die Zukunft, das ist wirklich nicht schön.