반응형
안녕하세요
TIL이라고해서 하루하루 작성하려고는 하는데, 개발 공부하는데 집중하다보니,
글쓰는 시간 내기가 애매해지네요. 꾸준히라도 작성해야 겠습니다 ^^
오늘은 Jetpack Compose로 List 형태의 데이터 출력을 구현해보려고 합니다.
IistItem 구성
List 구성 전 List의 각각 데이터가 어떻게 출력될지 구성합니다.
Column(modifier.weight(2.0f)) {
Text(
text = shopData.shopName,
fontSize = 18.sp,
fontWeight = FontWeight.Bold
)
Text(
text = shopData.address,
fontSize = 14.sp
)
}
임시로 생성해놓은 Shop 데이터를 출력하고, 상단에 이름, 하단에 주소를 나오게 출력합니다.
List 구성
출력될 각각의 Item을 구성 후 List로 출력합니다.
Box(){
LazyColumn(modifier = Modifier
.fillMaxSize()
.padding(16.dp)
.scrollable(scrollState, Orientation.Vertical)){
items(shopList){
shopData ->
ShopItem(shopData = shopData)
}
}
}
List를 출력할 때는 LazyColumn을 사용합니다. 추가로 shopList는 임시로 만들어놓은 데이터입니다.
* LazyColumn을 사용하는 이유는 예상치 못하게 많은 데이터가 출력되었을 때, 데이터가 을 위해
스크롤할 때만 데이터를 Lazy하게 로딩 하여 앱 성능의 효율을 갖게하기 위해서 입니다.
* 자세한 사항은 다음 포스팅 LazyColum을 작성하겠습니다.
예제 결과
이번에는 Jetpack Compose를 이용한 List를 구현해보았습니다.
잘못된 내용이 있다면 댓글 부탁드리고, 내용이 좋았다면 공감, 구독 부탁드려요!
반응형
'DEV > Android' 카테고리의 다른 글
[TIL-230625] Android Coroutine 알아보기 (0) | 2023.06.25 |
---|---|
[TIL-230622] Retrofit 알아보기 (0) | 2023.06.22 |
[TIL-230606] 화면 이동을 위한 NavigationController 구현 (0) | 2023.06.07 |
[TIL-230524] Google Map 지도 위에 검색창 출력 (0) | 2023.05.24 |
[TIL-230516] Android Studio + 로컬 소스 github 연동 (0) | 2023.05.16 |