[Kotlin] 분 단위 나이 계산기 - UI

UI 페이지 

폴더 : resource/layout/main_activity.xml

main_activity에 연결해주기

 

• Constraint layout으로 연결되어있는 text_view를 수정해주기
• 오른쪽 검색 기능을 통해 직접 text나 color, size 등을 바꾸어 줄 수도 있음

UI 구성 코드

<TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="IN MINIUTES"
        android:textColor="#264653"
        android:textSize="25sp"
        android:textStyle="bold"
        android:layout_marginTop="16dp" />
<Button
        android:text="SELECT DATE"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btnDatePicker"
        android:textColor="@color/lightgray"
        android:backgroundTint="@color/btnBgColor"/>

<TextView> : 문자열을 출력하는 뷰 

<Button> : 이벤트 처리를 위한 클릭 기능이 포함되어 있는 뷰 

 

• wrap_content : 아이템의 너비를 맞추어주는 기능
• match_parent : 부모 뷰의 길이에 맞춤

wrap_content를 사용하면 아이템이 화면에 꽉차지 않게 도와줌. 하지만, match_content는 텍스트 상자가 화면에 꽉참.

 

• padding : 글자의 배경을 지정할 때 편리한 기능, TextView의 하위속성

padding-top, padding-left, padding-right, padding-bottom등을 통해 각각 지정가능함 

• px : 절대 단위 
• dp : 일관성 부여