Modifier

1. Modifier

: Compoent(예를 들면 Row, Column, Box, Text, Button, Image 등등)의 모양이나 동작을 설정한다.

 

Modifier의 역할

• 레이아웃 조정: Modifier는 Composable의 크기, 여백, 패딩을 설정할 수 있다.
• 그래픽 효과: 배경색 설정, 그림자 추가 등 그래픽 효과를 추가할 수 있다.
• 이벤트 처리: 클릭이나 드래그 등의 사용자 입력 이벤트를 처리할 수 있다.
• 애니메이션 효과: 애니메이션 효과를 적용하거나 특정 동작에 애니메이션을 추가할 수 있다.

 

---

2. padding

: padding의 속성에서는 start(왼), end(오), top(위), bottom(아래), horizontal(좌우), vertical(상하)이 있다.

---

3. then()

: 하나의 UI(Composable)에 2개 이상의 Modifier 객체를 적용할 때 사용한다.

 

@Composable
fun ModifierTest() {
    // [modifier1 변수]
    val myModifier = Modifier
        .padding(all = 16.dp)
        .border(width = 2.dp, color = Color.Red)
		
    // [modifier2 변수]
    val myModifier2 = Modifier
        .height(100.dp)

    Column {
        CustomText(
            message = "then",
            modifier = myModifier.then(myModifier2), //해당 Composable에 2개의 Modifier 적용
            fontSize = 36
        ) 
    }
}