Compose Box

BoxWithConstraints Layout이란? BoxWithConstraints Layout은 Box Layout의 SuperSet Layout으로 Box의 기능을 모두 포함하면서 Layout의 Constraint에 접근할 수 있도록 만들어진 layout이다. *Constraint란 BoxWithConstraints 레이아웃의 최대 크기, 최소 크기 값이다. BoxWithCosntraints 에서 접근할 수 있는 Constraints BoxWithConstraints에서는 총 5가지 종류의 변수에 접근할 수 있다. 이 5가지 종류의 변수는 화면을 측정하는 방식에 따라 크게 2가지 종류로 나뉠 수 있다. 하나는 dp에 해당하는 값이고, 나머지 하나는 pixel에 해당하는 값이다. 아래 BoxWithC..

Box Layout이란? Box Layout은 여러 위젯를 겹쳐서 놓을 수 있는 레이아웃이다. Box 내부의 Child Compose들은 Modifier.align에 자신의 위치를 지정함으로써 Box 내부의 어떤 공간에 보여질지를 결정할 수 있다. 두개의 위젯을 같은 위치로 설정하면 위젯 위에 다른 위젯 겹쳐 지는 것 또한 가능하다. Box Layout은 기존 Frame Layout과 동작이 동일한데, 화면 오른쪽 아래 버튼을 만들거나 할 때 유용하다. 예를 들어 아래 코드와 같이 Box 내부에 다음과 같이 align이 없는 상태로 Text를 쓰게되면 @Preview(showBackground = true, widthDp = 120, heightDp = 200) @Composable fun KotlinW..

Jetpack Compose 레이아웃 시작하기 Jetpack Compose는 UI를 위한 라이브러리이므로, UI컴포넌트를 화면상에 배치하기 위한 Layout이 존재한다. 만약 Layout을 지정하지 않고 이모지와 텍스트를 써보면 다음과 같이 나타난다. @Preview @Composable fun TestView(){ EmojiView() TitleView() } 우리는 여기에 Column 레이아웃을 추가하여 다음과 같이 바꿀 수 있다. @Preview @Composable fun TestView(){ Column() { EmojiView() TitleView() } } 레이아웃은 위젯을 원하는 위치에 배치시켜 자신이 원하는 뷰를 만들기 위한 필수 사항이다. 자 이제 Compose에는 어떤 레이아웃이 지원..