I am using ConstraintLayout that contains child view.
I want this child view centered but keeping aspect ratio.
Layout (landscape) variant:
< ?xml version="1.0" encoding="utf-8"?>
< androidx.constraintlayout.widget.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:id="@+id/previewParent"
tools:context=".PeakerActivity">
< androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="0px"
android:layout_height="0px"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintDimensionRatio="16:9"
android:background="@color/black"
android:gravity="center"
android:id="@+id/flexbox2">
< /androidx.appcompat.widget.LinearLayoutCompat>
< /androidx.constraintlayout.widget.ConstraintLayout>
Adding android:gravity="center" has no effect, child view is still not centered.
Edit: Added image, as you see, left purple side is greater than right side.
To center the child view while maintaining its aspect ratio within a ConstraintLayout, you should use guidelines to position the view. Heres how you can modify your layout to achieve this:
xml< ?xml version="1.0" encoding="utf-8"?>
< androidx.constraintlayout.widget.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:id="@+id/previewParent"
tools:context=".PeakerActivity">
< androidx.appcompat.widget.LinearLayoutCompat
android:id="@+id/flexbox2"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="16:9"
android:background="@color/black"
app:layout_constraintStart_toStartOf="@id/guideline_start"
app:layout_constraintEnd_toEndOf="@id/guideline_end"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:gravity="center"
android:orientation="vertical">
< /androidx.appcompat.widget.LinearLayoutCompat>
< !-- Guidelines to center horizontally -->
< androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_begin="20dp" />
< androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_end"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_end="20dp" />
< /androidx.constraintlayout.widget.ConstraintLayout>
In this layout:
Two guidelines (guideline_start and guideline_end) are added with a margin of 20dp from the start and end respectively to center the child view.The child view (flexbox2) is constrained to these guidelines to keep it centered horizontally.
The LinearLayoutCompat is set to android:orientation="vertical" because you mentioned you want to center it horizontally. If you want to center it vertically, you can keep the orientation as horizontal.
This setup should ensure that the child view is centered while maintaining its aspect ratio.