[Jetpack Compose] Composable 함수

1. Composable 함수란?

---

@Composable
fun Greeting(name: String) {
    Text(text = "Hello $name")
}

Composable 함수는 Jetpack Compose로 사용자 인터페이스를 만들기 위해 사용하는 특수한 코틀린 함수이다.

@Composable Annotation을 이용하여 선언하며 Composable이 호출되면 앱 안에서

해당 영역이 이미지로 변환될 때 사용자에게 표시되고 동작되는 방식을 정의하는 데이터와 프로퍼티의 집합을 전달한다.

 

코틀린의 일반 함수와 같은 방식으로 결괏값은 반환하지 않으며, 런타임으로 사용자 인터페이스 요소를 전달하면

컴포즈 런타임 통해 렌더링 한다.

 

선언적 UI구성, 재사용성, 리엑티브 프로그래밍 등의 특징을 가지고 있으며 Stateful와 Stateless로 분류된다.

 

https://developer.android.com/codelabs/jetpack-compose-basics#0

Jetpack Compose 기초  |  Android Developers

2. Stateful Composable과 Stateless Composable

---

Composable 함수는 Stateful Composable과 Stateless Composable로 분류된다

Stateful Composable은 내부적

Stateful은 앱 실행 중 변경할 수 있는 모든 값(텍스트 필드 문자열, 체크박스 상태 등)으로 정의된다

 

 

Stateful Composable

@Composable
fun Counter() {
    val count = remember { mutableStateOf(0) }

    Button(onClick = { count.value++ }) {
        Text("Clicked ${count.value} times")
    }
}

Stateful Composable은 자체적으로 하나 이상의 상태를 관리하는 컴포저블 함수이다

하나의 컴포저블 함수는 해당 컴포저블 함수 또는 컴포저블 함수가 호출한 컴포저블의 형태나 동작을 정의하는 상탯값을 저장할 수 있다

상탯값을 저장하려면 remember 키쿼드를 이용하고 mutableStateOf 함수를 호출한다

UI의 동적인 부분을 반영하고 자신의 상태에 대한 전체적인 제어권을 가지고 있다

상태가 내부적으로 캡슐화되어 있어 상태 관리 로직과 UI 렌더링이 같은 곳에 위치한다

 

Stateless Composable

@Composable
fun Greeting(name: String) {
    Text(text = "Hello, $name!")
}

 

정의: Stateless Composable은 내부적으로 자체 상태를 유지하지 않는 컴포저블 함수입니다. 이들은 모든 필요한 데이터를 인자로 받아 UI를 렌더링합니다. 특징: 재사용성: 상태가 외부에서 관리되기 때문에, Stateless Composable은 더 재사용 가능하고 테스트하기 쉽습니다. 단순성: 내부 상태 관리가 없기 때문에, 구현이 단순해집니다.

Annotation

Annotation