[Compose] ConstraintLayout 사용하기

https://developer.android.com/jetpack/compose/layouts/constraintlayout

ConstraintLayout in Compose  |  Jetpack Compose  |  Android Developers

공식 문서(꼭 영어로!)를 참고하면서 하면 쉽게 할 수 있다.

 

필자는 스플레쉬 화면으로 다음과 같이 작성해 보았다.

 

ConstraintLayout(
    modifier = Modifier
        .fillMaxSize()
        .background(color = colors.primary)
        .padding(16.dp)
) {
    val (title, copyright) = createRefs()
    Text(
        text = stringResource(R.string.app_name),
        color = Color.White,
        fontSize = 50.sp,
        fontWeight = FontWeight.Bold,
        modifier = Modifier.constrainAs(title) {
            top.linkTo(parent.top)
            bottom.linkTo(parent.bottom)
            start.linkTo(parent.start)
            end.linkTo(parent.end)
        }
    )
    Text(
        text = stringResource(R.string.copyright),
        color = Color.White,
        fontSize = 10.sp,
        modifier = Modifier.constrainAs(copyright) {
            bottom.linkTo(parent.bottom)
            start.linkTo(parent.start)
            end.linkTo(parent.end)
        }
    )
}