본문 바로가기
App Programming/Android Studio

[Android Studio] 레이아웃 (1)

by goatlab 2022. 8. 4.
728x90
반응형
SMALL

레이아웃

 

UI 레이아웃을 정의하는 뷰 계층 구조 예

 

레이아웃은 앱에서 사용자 인터페이스를 위한 구조 (ex: 활동)를 정의한다. 레이아웃의 모든 요소는 View ViewGroup 객체의 계층 구조를 사용하여 빌드된다. 일반적으로 View는 사용자가 보고 상호작용할 수 있는 것을 그린다. 반면, ViewGroup은 그림과 같이 View 및 기타 ViewGroup 객체의 레이아웃 구조를 정의하는 보이지 않는 컨테이너이다.

 

View 객체는 일반적으로 '위젯'이라고 하고 Button 또는 TextView와 같은 여러 서브클래스 중 하나일 수 있다. ViewGroup 객체는 일반적으로 '레이아웃'이라고 하고 LinearLayout 또는 ConstraintLayout과 같은 다양한 레이아웃 구조를 제공하는 여러 유형 중 하나일 수 있다.

 

 

레이아웃 선언

 

  • UI 요소를 XML로 선언 : Android는 위젯, 레이아웃과 같이 View 클래스와 서브클래스에 상응하는 간단한 XML 어휘를 제공한다. Android 스튜디오의 Layout Editor를 사용하여 드래그 앤 드롭 인터페이스로 XML 레이아웃을 빌드할 수도 있다.
  • 런타임에 레이아웃 요소 인스턴스화 : 앱은 프로그래매틱 방식으로 View 및 ViewGroup 객체를 만들고 그 속성을 조작할 수 있다.

 

XML에서 UI를 선언하면 동작을 제어하는 코드로부터 앱 표현을 분리할 수 있다. 또한, XML 파일을 사용하면 다양한 화면 크기와 방향에 여러 가지 레이아웃을 쉽게 제공할 수 있다 (자세한 내용은 다양한 화면 크기 지원에서 설명).

 

Android 프레임워크에서는 위 방법 중 하나 또는 두 가지 모두를 사용하여 유연하게 앱의 UI를 빌드할 수 있다. 예를 들어, 앱의 기본 레이아웃을 XML에서 선언한 다음, 런타임에 레이아웃을 수정할 수 있다.

 

XML 쓰기

 

Android의 XML 어휘를 사용하면 UI 레이아웃과 그 안에 들어 있는 화면 요소를 HTML에서 웹페이지를 디자인할 때와 같은 방식으로 신속하게 디자인할 수 있다. 즉 일련의 중첩된 요소를 사용하는 것이다.

 

각 레이아웃 파일에는 반드시 딱 하나의 루트 요소만 있어야 하며, 이는 View 또는 ViewGroup 객체여야 한다. 루트 요소를 정의한 후에 더 많은 레이아웃 객체 또는 위젯을 하위 요소로 추가하여 계층적으로 레이아웃을 정의하는 뷰 계층 구조를 빌드할 수 있다. 예를 들어, 다음은 수직 LinearLayout을 사용하여 TextView  Button을 보유하는 XML 레이아웃을 나타낸 것다.

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:orientation="vertical" >
    <TextView android:id="@+id/text"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:text="Hello, I am a TextView" />
    <Button android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello, I am a Button" />
</LinearLayout>

 

레이아웃을 XML로 선언하고 나면 그 파일을 Android 프로젝트의 res/layout/ 디렉터리 내에 .xml 확장자로 저장하여 적절하게 컴파일되도록 한다.

 

레이아웃 XML 파일의 구문에 관한 자세한 정보는 레이아웃 리소스 문서에서 확인할 수 있다.

 

XML 리소스 로드

 

앱을 컴파일하는 경우, 각 XML 레이아웃 파일이 View 리소스 안에 컴파일된다. Activity.onCreate() 콜백 구현에서 앱 코드로부터 레이아웃 리소스를 로드해야 한다. setContentView()를 호출하고 R.layout.layout_file_name의 형태로 레이아웃 리소스 참조로 전달한다. 예를 들어, XML 레이아웃이 main_layout.xml로 저장된다면 다음과 같이 활동을 위해 로드한다.

 

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main_layout);
}

 

활동 내의 onCreate() 콜백 메서드는 활동이 시작될 때 Android 프레임워크에 의해 호출된다 (수명 주기에 관한 설명은 활동 문서에서 확인).

 

https://developer.android.com/guide/topics/ui/declaring-layout?hl=ko 

 

레이아웃  |  Android 개발자  |  Android Developers

레이아웃은 활동 또는 앱 위젯의 UI와 같은 사용자 인터페이스의 시각적 구조를 정의합니다. 두 가지 방법으로 레이아웃을 선언할 수 있습니다. Android 프레임워크를 통해 이 두 가지 메서드의 하

developer.android.com

 

728x90
반응형
LIST

'App Programming > Android Studio' 카테고리의 다른 글

[Android Studio] Default Activity not found  (0) 2022.08.04
[Android Studio] 레이아웃 (4)  (0) 2022.08.04
[Android Studio] 레이아웃 (3)  (0) 2022.08.04
[Android Studio] 레이아웃 (2)  (0) 2022.08.04
Android Studio  (0) 2022.04.06