Kotlin/안드로이드_[입문]앱개발
Android 3-2_UI 레이아웃 실습 숙제
[진주]
2023. 8. 16. 05:41
728x90
반응형
아래 화면을 만들어보기
UI 레이아웃 구성
- LinearLayout내에 3개의 LinearLayout을 추가하고 각각의 weight를 1로 사용
- Linear Layout
- Button3개를 세로로 배치
- Layout_gravity를 이용해 위치 조정
- Relative Layout
- Layout margin : 10dp
- Button5를 우측 상단에 고정
- Button4를 Button5 왼쪽에 배치, 오른쪽margin20dp
- Button6을 Button4 아래로 배치, 왼쪽margin10dp
- Constraint Layout
- Button7을 레이아웃 중앙에 배치
- Button8을 Button7 오른쪽 같은 높이에 배치, 왼쪽margin20dp
- Button9를 Button7 아래로 배치
해보기
<?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"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#EBB096DF"
android:orientation="vertical">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BUTTON1"
android:layout_gravity="left" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BUTTON2"
android:layout_gravity="center" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BUTTON3"
android:layout_gravity="right" />
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#00BCD4"
android:layout_margin="10dp">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BUTTON4"
android:id="@+id/b4"
android:layout_toLeftOf="@id/b5" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BUTTON5"
android:id="@+id/b5"
android:layout_alignParentRight="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BUTTON6"
android:id="@+id/b6"
android:layout_below="@id/b5" />
</RelativeLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#FF9800">
<Button
android:id="@+id/b7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button7"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/b8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:text="button8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="@+id/b7"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/b9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button9"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.504"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/b7" />
</androidx.constraintlayout.widget.ConstraintLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
완료오
728x90
반응형