소개

신졸에서 처음으로 Android 앱을 구현했습니다.
그 때, ConstraintLayout의 이용 방법에 대해 조사해 보았으므로,
아웃풋으로서 같은 초보자의 참고가 되면 좋다고 생각 기사로 했습니다.

목차

ConstraintLayout이란

체인을 설정하는 방법

ChainStyle의 종류

Weight 제약

ConstraintLayout이란?

ConstraintLayout은 위젯을 유연한 방식으로 배치하고 크기를 조정할 수 있도록 합니다.
iOS에서 말하는 Storyboard의 AutoLayout과 같은 기능을 가진 레이아웃이라고 합니다.
다음과 같이 다양한 제약을 할 수 있습니다.

상대 위치 결정

마진

센터링 위치 결정

원형 위치 결정

가시성 동작

치수 구속

체인

가상 도우미 개체

옵티마이저

체인 설정 방법

ChainStyle의 종류

Chain은 양방향 위치 제약 조건으로 상호 연결된 View 그룹입니다.
Chain은 기점이 되는 위치의 View에, layout_constraintHorizontal_chainStyle 혹은, layout_constraintVertical_chainStyle를 이용하는 것으로 설정할 수 있습니다.

Spread

뷰가 여백을 잡고 균등하게 배치됩니다.

 <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintHorizontal_chainStyle="spread" />

Spread inside

양단의 마진은 취하지 않고, 안의 마진을 취해 균등하게 배치됩니다.

 <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintHorizontal_chainStyle="spread_inside" />

Packed

하나의 요소로 정리되어 마진을 취합니다.

 <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintHorizontal_chainStyle="packed" />

Weight 제약

ChainStyle이 spread 또는 inside inside로 설정된 경우 가중치를 사용하여 View의 너비를 지정할 수 있습니다. 이 때 Horizontal 또는 Vertical에 따라 View의 width 또는 height를 "match constraint(0dp)"로 해야 합니다.

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

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/mainLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="0dp">

        <TextView
            android:id="@+id/textView1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:text="@string/view"
            android:textSize="25sp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@+id/textView2"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintHorizontal_chainStyle="spread"
            app:layout_constraintHorizontal_weight="1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/textView2"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:text="@string/view"
            android:textSize="25sp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@+id/textView3"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintHorizontal_weight="2"
            app:layout_constraintStart_toEndOf="@+id/textView1"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/textView3"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:text="@string/view"
            android:textSize="25sp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintHorizontal_weight="3"
            app:layout_constraintStart_toEndOf="@+id/textView2"
            app:layout_constraintTop_toTopOf="parent" />

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

※ 화상은 1:2:3에서 설정한 것입니다.

참고

htps : //에서 ゔぇぺぺr. 안 d로이 d. 코 m / 레후 렌세 / 안 d 로이 d / 삿포 rt / 곤 st 라이 t / st 라이 t t ぁ t. HTML
htps : // 메이 m. 코 m / @ man r / 안 st 라이언 t ぁ 요 t-chan s-4f3b58 음 15b