Android Studio 공부 4일 차(xml코드 살펴보기)

지금까지는 디자인 화면에서만 모든 것을 수정하였었다.

디자인 화면 옆을 보면 code 부분이 있을 것이다. 이 부분을 눌러 코드 부분을 한번 알아보자.

 

 

코드 첫 부분을 보면 아래와 같이 되어 있을 것이다.

첫 번째 줄의 경우 xml 파일에 일반적으로 추가하는 정보로 이 파일 형식이 xml이라는 것을 알려준다.

두 번째 줄은 패키지 이름과 ConstraintLayout이 있다. 최상위 레이아웃이 되는 부분이다. 그리고 'xmls:android라는 부분이 있는데 이것은 네임스페이스를 의미한다 아직까지 네임스페이스에 대해 정확한 이해가 되지 않아 자세한 설명이 불가능하지만 일단은 xml레이아웃 파일이라면 한 파일에 한 번씩 넣어 주어야 하며 안드로이드와 관련된 속성을 참조하기 위해 있다고만 알아두자. 그 외 부분은 아직 부족한 부분이 많아 정리할 수 있는 부분만 밑에 간단히 저리 해보겠다.

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

 

android:  xmln:android로 지정된 정보를 참조해 사용하겠다. xmlns:app:  프로젝트에서 사용하는 외부 라이브러리에 포함되어 있는 속성을 사용한다. xmls:tools: 디자이너 도구등에서 화면에 보여줄때 사용, 앱이 실행될때는 적용되지 않고 안드로이드 스튜디오에서만 적용된다. layout_width="match_parent": 화면의 너비를 의미하며 match_parent는 여유공간을 전부 채움을 의미한다. layout_height="match_parent": 마찬가지 이며 화면의 높이를 의미한다.

 

 

다음은 버튼을 하나 만들어서 그 안의 코드를 살펴보자 첫 번째로 'id'부분을 한번 보자 이 부분의 경우 뷰를 구분하는 역할을 하는데 어떠한 뷰에 연결을 시키려고 할 때 구분하는 역할을 한다.

그리고 주석으로 부모라고 써져 있는 부분은 버튼을 담고 있는 레이아웃을 의미하며  맨 마지막 줄을 보면 parent가 아닌 @+id:button으로 되어있는데 연결점 윗부분이 button 속성 값을 가진 것과 연결되어 있다는 의미이다.

참고로 왼쪽: Left, Start

오른쪽: Right, End 이런 식으로 표현한다.

  <Button
        android:id="@+id/button" //id속성값
        android:layout_width="wrap_content" //너비(글자 크기에 맞추어 자동으로)
        android:layout_height="wrap_content" //높이(글자 크기에 맞추어 자동으로)
        android:layout_marginStart="60dp" //왼쪽 연결점과의 거리
        android:layout_marginTop="80dp" //위쪽 연결점과의 거리
        android:text="Button" //글자
        app:layout_constraintStart_toStartOf="parent" //부모의 왼쪽
        app:layout_constraintTop_toTopOf="parent" />  //부모의 위쪽
        
        <Button
        android:id="@+id/button2" //id 속성값
        android:layout_width="wrap_content" //너비(글자 크기에 맞추어 자동으로)
        android:layout_height="wrap_content" //높이(글자 크기에 맞추어 자동으로)
        android:layout_marginStart="60dp" //왼쪽과의 거리
        android:layout_marginTop="30dp" //위쪽과의 거리
        android:text="Button" //글자
        app:layout_constraintStart_toStartOf="parent" //왼쪽이 부모의 왼쪽과 연결
        app:layout_constraintTop_toBottomOf="@+id/button" /> //위쪽이 id:button이란것과 연결

 

 

이번에는 가이드라인을 만들어 한번 Xml코드를 살펴보자

맨 마지막 줄을 보면 'app:layout_constraintGuide_begin="122dp"'라고 되어 있는 것이 보일 것이다.

이 부분은 세 가지 속성이 있는데 'begin', 'end', 'percent'가 있다.

begin의 경우 세로 방향인 경우 왼쪽부터, 가로방향인 경우 위쪽부터 거리 지정

end의 경우 세로 방향인 경우 오른쪽부터, 가로방향인 경우 아래쪽부터 거리 지정

마지막 percent의 경우 begin의 속성을 대신 지정하되 % 단위로 거리를 지정한다는 의미이다.

그래서 지금 같은 경우 begin 즉 왼쪽부터 122만큼 띄어놓겠다는 의미가 되겠다.

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical" //가이드 라인의 방향을 의미 세로 방향이다.
        app:layout_constraintGuide_begin="122dp" />

 

마지막으로 크기를 표시하는 단위에 대해 정리하고 끝마치겠다.

지금까지는 dp 단위만 사용해왔는데 그 밖에도 여러 가지 크기로 사용할 수 있는 단위들이 있다. 크기 단위로는 px(픽셀), dp(밀도 독립적 픽셀), sp, sip(축적 독립적 픽셀), in(인치), mm(밀리미터), em(덱스트 크기)

지금은 간략하게 뷰에는 dp, 글자 크기에는 sp단위를 사용하는 게 좋다고만 알아두자