[Android Compose 부록] 1. Compose Layout, Text에 LTR, RTL 설정하기

Layout에 LTR RTL 옵션을 주는 방법

Compose의 LTR, RTL 옵션을 변경하는 방법은 CompositionLocalProvider을 이용하는 것이다. CompositionLocalProvider의 vararg로 ProvidedValue 객체를 넘길 수 있는데 이에 대해 LayoutDirectiion.Rtl을 넘기면 RTL이 설정된다.

CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Rtl)

이제 Rtl이 적용되길 원하는 레이아웃을 CompositionLocalProvide로 감싸면 완성된다.

@Preview(showBackground = true, widthDp = 300, heightDp = 300)
@Composable
fun KotlinWorldRtl() {
    CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Rtl) {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .padding(8.dp)
        ) {
            Text(text = "Kotlin World textAlign Start", modifier = Modifier.fillMaxWidth(), textAlign = TextAlign.Start)
        }
    }
}

그림1. Layout Rtl 설정

 

Compose Text에 LTR RTL 옵션을 주는 방법

특정 Text 에만 LTR, RTL을 사용하고 싶을 때는 Text style 파라미터에 TextStyle(textDirection = TextDirection.Rtl)을 사용하면 된다.

@Preview(showBackground = true, widthDp = 300, heightDp = 300)
@Composable
fun KotlinWorldRtl() {
    Column(
        modifier = Modifier
            .fillMaxSize()
            .padding(8.dp)
    ) {
        Text(
            text = "Kotlin World textAlign Start",
            modifier = Modifier.fillMaxWidth(),
            style = TextStyle(textDirection = TextDirection.Rtl),
            textAlign = TextAlign.Start
        )
    }
}

그림2. 개별 Text Rtl 설정