안드로이드/Compose UI (6) 썸네일형 리스트형 [안드로이드 Jetpack Compose UI] LazyRow를 사용해서 RecyclerView 구현하기 안녕하세요. 이번 시간에는 안드로이드 Jetpack Compose에서 LazyRow를 사용해 가로 방향으로 무한 스크롤이 되면서 메모리 최적화 기능이 적용된 RecyclerView를 구현하겠습니다. 기존의 안드로이드 레이아웃 XML 방식을 사용해 보신 분들이라면 RecyclerView를 만들 때, 필요한 사전작업이 많았다는 걸 아실 텐데요. Compose로 넘어와서는 상당히 간단하게 구현할 수 있게 됐습니다. Compose에서 제공하는 LazyRow를 사용하면 가로 방향으로 무한 스크롤이 되는 RecyclerView를 만들 수 있습니다. 그럼 지금부터 코드와 함께 예제를 보여드리겠습니다. 1. LazyRow를 사용해서 RecyclerView 만들기 LazyRow는 항목을 가로로 배치하고, 사용자가 스크롤.. [안드로이드 Jetpack Compose UI] Row를 사용해서 HorizontalScrollView 구현하기 안녕하세요. 이번 포스팅에서는 안드로이드 Jetpack Compose에서 가로방향으로 아이템이 추가되는 HorizontalScrollView를 구현하겠습니다. Compose UI에서는 가로 방향으로 UI를 배치할 때 Row 컴포저블을 사용합니다. 이때, Row에 추가 옵션을 주면 아이템이 Row 컴포저블을 벗어나도 스크롤을 통해서 UI를 확인할 수 있습니다. 이제 간단한 예제를 통해 HorizontalScrollView를 구현하겠습니다. 1. Row를 사용해서 HorizontalScrollView 만들기 HorizontalScrollView 구현의 핵심은 Row 컴포저블과 horizontalScroll modifier의 조합입니다. Row는 자식 컴포저블들을 가로 방향으로 나열하며, horizontalS.. [안드로이드 Jetpack Compose UI] LazyColumn을 사용해서 무한 스크롤 뷰 만들기 안녕하세요. 이번 포스팅에서는 안드로이드 Jetpack Compose에서 무한스크롤 뷰를 만드는 방법에 대해 설명하겠습니다. 안드로이드 Compose UI에서는 기존 XML 기반의 레이아웃에서 사용했던 Adapter 없이 간단하게 무한스크롤 뷰를 구성할 수 있습니다. 바로 LazyColumn 컴포저블을 사용하면 됩니다. 선언적 UI 구성의 장점을 살려서 간결하고 유연한 코드 작성이 가능합니다. 1. LazyColumn을 사용해서 무한 스크롤 뷰 만들기 LazyColumn은 Compose에서 제공하는 컴포저블로 기존의 RecyclerView에서의 기능을 수행합니다. XML 레이아웃 기반 RecyclerView의 어댑터 패턴과는 다르게 LazyColumn에서는 Compose의 선언적 방식을 통해 각 아이템을.. [안드로이드 Jetpack Compose UI] Column을 사용해서 VerticalScrollView 구현하기 안녕하세요. 이번 포스팅에서는 안드로이드 Jetpack Compose에서 VerticalScrollView 만드는 방법에 대해 설명하겠습니다. Compose UI에서는 Column 컴포저블을 통해 세로로 UI를 배치할 수 있고, Column 컴포저블의 Modifier에 ScrollState를 전달해 줌으로써 Scrollable 하게 만들 수 있습니다. 1. Column을 사용해서 VerticalScrollView 만들기안드로이드 Compose에서는 기존의 안드로이드 개발에서 보던 ScrollView와는 다른 접근 방식을 제공합니다. 가장 간단하게 세로 스크롤 뷰를 만드는 방법은 Column 컴포저블에 verticalScroll Modifier를 적용하는 것입니다. 해당 Scroll State를 통해 간단.. [안드로이드 Jetpack Compose UI] TabPager 구현하기 안녕하세요. 이번 포스팅에서는 안드로이드 Jetpack Compose에서 TabPager를 구현하겠습니다. TabPager는 상당히 많이 사용되는 UI 중 하나입니다. TabPager를 구현할 때는 ViewPager를 연동해서 사용해야 하는데, 기존 xml 방식으로 UI를 개발할 때는 Adapter 클래스를 생성해야만 했고 연동 과정이 복잡했습니다. 그런데 안드로이드 Compose에서는 이러한 복잡한 과정이 사라졌으며 비교적 간단하게 TabPager를 구현할 수 있습니다. 이제 안드로이드 Jetpack Compose에서 TabPager를 구현하는 방법에 대해 설명하겠습니다. 1. TabPager 만들기 TabPager를 구현하기 위해 먼저 TabRow와 HorizontalPager를 연동하는 작업이 필요.. [안드로이드 Jetpack Compose UI 시리즈] ViewPager 구현하기 안녕하세요. 이번 포스팅에서는 안드로이드 Jetpack Compose에서 ViewPager를 구현하겠습니다. ViewPager는 최근 앱에서 많이 사용되고 있는 대표적인 UI 중 하나입니다. 기존 xml에서는 ViewPager를 구현하기 위해 별도의 Adapter를 생성하고, item에 해당되는 xml도 생성해줘야 했습니다. 그런데 안드로이드 Jetpack Compose에서는 상당히 편하게 구현할 수 있습니다. 이제 안드로이드 Jetpack Compose에서 ViewPager를 구현하겠습니다. 1. ViewPager 만들기 좌우로 넘어가는 ViewPager를 만들기 위해서 androidx.compose.foundation.pager의 HorizontalPager를 사용했습니다. 만약에 위아래로 넘길 수 .. 이전 1 다음
