레이아웃, 테마 설정, 애니메이션

고급 레이아웃을 구현하고 앱에 움직임과 스타일을 추가하세요. 다양한 Compose Animation API, Material Design 3를 구현하는 방법, 맞춤 레이아웃을 사용하여 복잡한 디자인을 구현하는 방법, 지연 레이아웃을 사용하여 성능 높은 UI를 만드는 방법에 관해 알아보세요.

 

Compose 레이아웃 및 수정자의 기초

동영상

레이아웃과 수정자의 기초 즉, 레이아웃과 수정자가 함께 작동하는 방식, 제공되는 즉시 사용 가능한 API, UI 스타일 지정 방법을 알아봅니다.

지연 레이아웃

동영상

Compose에서 스크롤 목록을 만드는 방법과 RecyclerView를 사용하는 것보다 간단한 이유를 알아보세요. 스크롤 목록을 중첩하는 것이 허용되지 않는 이유와 이를 다른 방식으로 하는 방법, 항목의 크기가 0픽셀이면 안 되는 이유, 고유 키를 제공하는 것이 중요한 이유와 항목 애니메이션의 작동 방식을 자세히 알아보세요. 마지막으로 그리드를 표시하는 방법과 맞춤 레이아웃 관리자를 사용하는 방법을 살펴보고 성능 최적화를 개선하여 스크롤 속도를 높이는 방법을 알아봅니다.

Material Design 시스템

동영상

Compose의 Material You 동적 색상, 테마 설정, 구성요소에 관해 알아봅니다.

Material Design 3으로 앱 테마 지정

Codelab

이 Codelab에서는 Jetpack Compose의 테마 설정 API를 사용하여 애플리케이션의 스타일을 지정하는 방법을 알아봅니다. 애플리케이션에서 일관되게 사용되고 밝은 테마 및 어두운 테마와 동적 테마를 지원하도록 색상, 도형, 서체를 맞춤설정하는 방법을 알아봅니다.

텍스트 스타일 지정

동영상

다운로드 가능한 글꼴 및 가변 글꼴 사용 등 Material API를 사용하여 서체를 구성하는 방법을 알아봅니다.

앱을 돋보이게 만드는 5가지 간단한 애니메이션

동영상

단 몇 분 만에 앱에 생동감을 불어넣는 5가지 간단한 애니메이션을 알아보세요.

Compose에서 그리기 소개

동영상

Compose에서 맞춤 항목을 그리는 방법을 모두 알아보세요.

요소에 애니메이션 적용

Codelab

Compose Animation API 사용 방법을 알아봅니다. 가장 간단한 값 애니메이션으로 시작하여 몇 가지 일반적인 애니메이션 패턴을 통해 다른 API를 배웁니다. 또한 애니메이션 맞춤설정 및 터치 동작이 포함된 애니메이션과 같은 고급 주제도 살펴봅니다.

맞춤 레이아웃 및 그래픽

동영상 선택사항

Compose는 쉽고 빠르게 화면을 처음부터 빌드할 수 있는 즉시 사용 가능한 다양한 솔루션을 제공합니다. 하지만 한 걸음 더 나아가 완전히 맞춤설정해야 한다면 어떻게 될까요? 고급 레이아웃 개념을 자세히 알아보고 나만의 맞춤 레이아웃을 빌드하여 디자인 구현을 한 단계 업그레이드하세요.

제약 조건 및 수정자 순서

동영상 선택사항

Compose의 수정자는 체이닝될 수 있으며 이 순서가 중요합니다. 하지만 정확히 얼마나 중요할까요? 수정자 체이닝과 이것이 컴포저블 크기에 미치는 영향을 추론하는 방법을 알아봅니다.