[Jetpack Compose] Slot API

1. Slot API란?

---

Composable 함수는 하나 이상의 Composable 함수를 호출할 수 있다

Jetpack Compose에서의 Slot API는 Composable 함수를 통해 사용자 정의 UI 컴포넌트에 Slot을 제공하여, 이 컴포넌트의 일부를 외부에서 정의할 수 있게 하는 패턴이다

 

하나의 Slot API는 하나 이상의 요소가 비어 있는 UI 템플릿이다

Composable이 호출될 때 파라미터로 전달되며 Compose 런타임 시스템이 UI를 렌더링 할 때 포함된다

Composable의 슬롯에 전달할 수 있는 람다 표현식을 이용해 작성하며

이를 통해 컴포넌트의 레이아웃이나 동작을 재사용할 수 있으며, 동시에 특정 부분은 개발자가 커스터마이즈할 수 있다

 

https://developer.android.com/codelabs/jetpack-compose-layouts?hl=ko#8

Compose의 기본 레이아웃  |  Android Developers

 

3. 사용 방법

---

@Composable
fun CustomSlot(content: @Composable () -> Unit) {
    Card(modifier = Modifier.padding(16.dp)) {
        Box(modifier = Modifier.padding(16.dp)) {
            content() // 여기에 배치된다
        }
    }
}

@Composable
fun TestSlot() {
    CustomSlot {
        Text("Hello!")
    }
}

 

@Composable () -> Unit 람다를 통해 카드의 내용을 사용하는 측에서 정의 할수 있게 한다

이러한 방식으로 Slot API를 사용하면 UI 컴포넌트의 재사용성과 유연성을 높일 수 있으며, 사용자 정의 요구에 쉽게 대응할 수 있는 이점이 있다