Jetpack Compose - Preview, Text

<미리 보기>

 

<소스 코드>

@Composable
fun GreetingText(message: String, from: String, modifier: Modifier = Modifier) {
    Column(
        verticalArrangement = Arrangement.Center,
        modifier = modifier
    ) {
        Text(
            text = message,
            fontSize = 100.sp,
            lineHeight = 116.sp,
            textAlign = TextAlign.Center
        )
        Text(
            text = from,
            fontSize = 36.sp,
            modifier = Modifier
                .padding(16.dp)
                .align(alignment = Alignment.End)
        )
    }
}

@Preview(showBackground = true, showSystemUi = true)
@Composable
fun BirthdayCardPreview() {
    HappyBirthdayTheme {
        GreetingText(message = "Happy Birthday Sam!", from = "From Emma")
    }
}

 

<요약>

@Preview(showSystemUi) - true를 전달한다면 미리 보기가 상태바를 포함한 디바이스 형태로 출력. 

 

Text(lineHeight) - 한 줄 이상의 구절로 문자열이 겹칠 때 줄 간격 설정 방법. 

 

Text(textAlign) - 한 줄 이상으로 구절을 이룰 때 문자열 정렬 방법. 

 

Modifier.align() - 상위 컨테이너 Column 내에서 해당 텍스트 수평 정렬 방법.