[깡샘코틀린] 6-2 뷰 클래스

레이아웃 중첩

// activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BUTTON1" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BUTTON2" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON3"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON4"/>

    </LinearLayout>

</LinearLayout>

 

 

레이아웃 XML의 뷰를 코드에서 사용하기

 

id 속성 부여

XML에 id 속성 추가 시 자동으로 R.java 파일에 상수 변수를 추가

id 속성값은 "@+id/text1" 형태로 추가하는데 XML 속성값이 @로 시작하면 R.java 파일을 의미

따라서 이 표현식은 R.java파일에 text1이라는 상수 변수를 추가하라는 의미

<TextView
    android:id="@+id/text1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello"/>

 

코드에서 XML에 입력한 객체 사용법

// XML 화면 출력
setContentView(R.layout.activity_main)
//id 값으로 뷰 객체 획득
val textView1: TextView = findViewById(R.id.text1)

 

제네릭으로 가져온 뷰 객체

// XML 화면 출력
setContentView(R.layout.activity_main)
//id 값으로 뷰 객체 획득
val textView1 = findViewById<TextView>(R.id.text1)

 

뷰의 크기를 지정하는 방법

match_parent : 부모의 크기 전체

wrap_content : 자신의 콘텐츠를 화면에 출력할 수 있는 적절한 크기

wrap_content, match_parent 같은 설정값을 사용하는 이유?

안드로이드 기기의 크기가 다양해서 호환성을 생각해야 하기 때문

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#ffff00"
    tools:context=".MainActivity">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BUTTON1"
        android:backgroundTint="#0000ff"/>
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="BUTTON2"
        android:backgroundTint="#ff0000"/>
</LinearLayout>

 

뷰의 간격 설정

margin : 뷰와 뷰 사이의 간격

padding : 뷰의 콘텐츠와 테두리 사이의 간격

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

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BUTTON1"
        android:backgroundTint="#0000ff"
        android:padding="30dp"/>
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="BUTTON2"
        android:backgroundTint="#ff0000"
        android:paddingBottom="50dp"
        android:layout_marginLeft="50dp"/>
</LinearLayout>

 

 

뷰의 표시 여부 설정

visibility 속성 : 뷰가 화면에 출력되어야 하는지를 설정

visible : 뷰가 화면에 출력

invisible : 뷰가 화면에 보이지 않지만 자리는 차지

gone : 뷰가 화면에 보이지 않고 자리도 차지하지 않음

화면에 보이지도 않는 뷰를 왜 XML에서 준비해야 할까?

처음에는 화면에 보이지 않다가 어떤 순간이 되면 보이게 처리하기 위해서

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

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON1"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON2"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON3"/>
    </LinearLayout>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON1"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON2"
            android:visibility="invisible"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON3"/>
    </LinearLayout>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON1"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON2"
            android:visibility="gone"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="BUTTON3"/>

    </LinearLayout>
</LinearLayout>