[안드로이드 스튜디오 코틀린] Compose Material2에서 Material3로 바뀐 뒤 Surface, Card elevation 주는 방법

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Material3를 통해 Compose를 구성하고 있는데 elevation 주는 방법이 바뀐 뷰들이 있다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

자세한건

 

https://developer.android.com/jetpack/compose/designsystems/material2-material3?hl=ko

Compose의 Material 2에서 Material 3으로 이전  |  Jetpack Compose  |  Android Developers

 

위의 공식 문서에도 확인할 수 있다.

 

 

 

 

 

 

 

 

 

 

 

 

 

간단히 보자면

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Surface

 

import androidx.compose.material.Surface

Surface(
    elevation = …
) { … }

 

 

위처럼 사용하였는데 Material3 로 바뀌면서 아래처럼 바뀌었다.

 

 

 

 

 

import androidx.compose.material3.Surface

Surface(
    shadowElevation = …,
    tonalElevation = …
) { … }

 

shadowElevation을 사용하면 위에서 사용하려고 했던 elevation이 적용된다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Card

 

 

 

위처럼 속성에 elevation이 있어 바로 사용할 수 있었지만,

 

 

 

 

 

 

 

 

 

Material3에서는 아래처럼 CardElevation이기 때문에

 

 

 

 

 

 

 

 

 

 

 

 

코드에서는 

 

    Card(
        elevation = CardDefaults.cardElevation(
            defaultElevation = 10.dp
        ),
        modifier = Modifier.padding(8.dp)
    ) {

    }

 

 

위처럼 사용하면 elevation이 적용된다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

참고

 

https://developer.android.com/jetpack/compose/designsystems/material3?hl=ko

Compose의 Material Design 3  |  Jetpack Compose  |  Android Developers