wrap_content, match_parent와 TextView 자체 크기

layout을 재사용하기 위해 <include> 태그를 사용하다 갑자기 원하는 동작이 나오지 않았다.

이전에 정리했던 글인데 정확히 공부하지 않아서 추가적으로 공부한 것을 정리했다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#882833"
        android:textSize="20sp" />
</LinearLayout>

아무것도 출력되지 않아 당황스러웠다.

다음의 layout파일을 보자.

---

layout_width는 match_parent로 동일하다.

layout_width는 wrap_content로 동일하지만

각 위젯의 textSize가 달라 텍스트 하나의 높이가 달라진 결과로 wrap_content도 서로 다른 값을 가진다.

이 부분은 쉽게 이해된다. 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#882833"
        android:textSize="20sp" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#186873"
        android:textSize="40sp" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#1F2F83"
        android:textSize="60sp" />

</LinearLayout>

---

layout_height는 100dp로 동일하다.

layout_width는 wrap_content로 content에 해당하는 텍스트의 총 가로길이로 결정된다.

이 부분도 쉽게 이해된다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="100dp"
        android:background="#882833"
        android:text="가"
        android:textSize="20sp" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="100dp"
        android:background="#186873"
        android:text="가나"
        android:textSize="40sp" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="100dp"
        android:background="#1F2F83"
        android:text="가나다"
        android:textSize="60sp" />

</LinearLayout>

---

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#882833"
        android:textSize="20sp" />
</LinearLayout>

layout_height를 보자.( ViewGroup과 View의 사이즈 측정을 자세하게 알아보고 싶으면 onMeasure메서드를 확인하자 )

 

root뷰인 ViewGroup은 wrap_content를 통해 root의 사이즈 측정은 보류되고 child뷰들의 사이즈가 계산이 되면 root의 사이즈가 결정된다. 헌데 child뷰인 TextView에서는 부모의 사이즈 전체에 맞추도록 하고 있다. 서로 사이즈 측정을 미뤘는데 어떻게 TextView의 높이가 정해진 것일까? 위의 예제에서 봤듯이 textSize의 값인 20sp로 높이가 먼저 결정이 되고

root뷰는 wrap_content인 20sp로 높이가 정해진다.

---

그렇다면 같은 동작을 layout_width에 적용하면 어떻게 될까?

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#882833"
        android:textSize="20sp" />
</LinearLayout>

아쉽게도 root인 ViewGroup과 TextView모두 화면에 꽉찬 높이를 가지지만 가로는 모두 0으로 측정되어 아무것도 보이지 않는다. android:text 속성이 적용되지 않은 상태이기 때문에 내용물에 해당하는 content의 가로가 0인 것이다.

 

android:text 에트리뷰트에 텍스트를 적용하여 확인해보면 화면에 출력된다.

 <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#882833"
        android:text="가나다" //추가
        android:textSize="20sp" />

예전에 View, ViewGroup의 사이즈 측정에 대해 onMeasure메서드를 공부했는데 정확하게는 이해하지 못했다.

아마 ViewGroup에서 View로 측정을 미루고 View의 onMeasure메서드에서도 측정이 불가능 할 경우 TextView위젯 자체의 크기를 내놓는 것 같다.

 

TextView를 상속한 위젯들의 자체 위젯의 크기는 android: width, android: height 속성이다.

이를 설정하지 않은 경우 android: text, android:textSize를 사용하여 android: width, android: height가 내부적으로 측정이 되고, android: width, android: height를 사용한 경우 이 값이 실제 크기가 된다.

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/textView"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#287A88" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:width="100dp"
        android:height="100dp"
        android:background="#CCAD3E" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:width="100dp"
        android:height="100dp"
        android:text="라"
        android:textSize="150dp"
        android:background="#882833" />
</LinearLayout>

마지막 TextView의 글자가 짤린 것을 확인할 수 있다.

 

textView의 android:height, android:width속성

2021.07.18 - [Android] - [Android] layout_width, width, minWidth, maxWidth