Compose에서 Column 위젯 대신 메모리 관리를 해주는 LazyColmn이 있습니다.
이를 이용해서 다음과 같은 화면을 만들어 보겠습니다.
전체 소스는 다음과 같습니다.
Scaffold로 머티리얼 디자인 TopAppBar를 만듭니다.
메소드에 @Composable 어노테이션을 달아서 위젯(뷰)를 만들 수 있습니다.
이렇게 위젯을 분리하여 재활용할 수 있으며, 이점은 스택 구조에서 depth가 줄어들고 가독성이 좋아집니다.
UserListView 메소드에 LazyColumn을 이용하여 list 구조를 만들 수 있습니다.
items(randomUsers) { }에서 반복문을 돌면서 리스트 각각의 아이템들에 대한 위젯을 만들 수 있습니다.
RandomUserView(randomUser: RandomUser) 메소드에서는 Card 위젯을 사용하여 elevation, shape 등을 설정하고, 리스트 아이템에 대한 위젯을 구성합니다.
ProfileImg(imageUrl: String, modifer: Modifer) 메소드는 인터넷의 이미지 url을 비트맵으로 변환하여 이미지를 표시하는 Composable입니다. Glide 라이브러리를 이용하여 CustomTarget의 익명클래스를 이용하여 이미지를 비트맵으로 변환하여 mutableState의 value에 넣습니다.
만약에 bitmap이 null이면 drawable에 준비해둔 이미지를 보여주고 null이 아니면 인터넷에서 받아온 url 이미지를 보여줍니다.
'안드로이드 > Jetpack Compose' 카테고리의 다른 글
| [안드로이드 Compose] Button (0) | 2022.04.24 |
|---|---|
| [안드로이드 Compose] 버튼 Custom Shadow (0) | 2022.04.24 |
| [안드로이드 Compose] AutoResizeText (0) | 2022.04.24 |
| [안드로이드] Compose - Scaffold, Row, Column (0) | 2022.04.21 |
