Jetpack Compose 시작하기
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
Jetpack Compose는 네이티브 Android UI를 빌드하기 위한 최신 도구 키트입니다. 여기에서 Compose 사용에 관한 최신 정보를 확인할 수 있습니다.
- 개요: Compose 개발자에게 제공되는 모든 리소스를 확인하세요.
- 튜토리얼: 간단한 UI를 빌드하면서 Compose 사용을 시작해 보세요.
- 빠른 가이드: 새로운 기능 목표를 최대한 빠르게 달성할 수 있도록 설계된 빠르고 집중적인 가이드를 사용해 보세요.
기초
- Compose 이해: Compose의 선언적 접근 방식과 이전의 뷰 기반 접근 방식의 차이점, 그리고 Compose로 작업하는 멘탈 모델을 빌드하는 방법을 알아보세요.
- 상태 관리: Compose 앱에서 상태를 설정하고 사용하는 방법을 알아봅니다.
- 컴포저블의 수명 주기: 컴포저블의 수명 주기와 Compose가 컴포저블을 다시 그려야 할지 여부를 판단하는 방법을 알아봅니다.
- 수정자: 수정자를 사용하여 컴포저블을 강화하거나 장식하는 방법을 알아보세요.
- Compose의 부수 효과: 부수 효과를 관리하는 가장 좋은 방법을 알아보세요.
- Jetpack Compose 단계: Compose가 UI를 렌더링하기 위해 거치는 단계와 이 정보를 사용하여 효율적인 코드를 작성하는 방법을 알아보세요.
- 아키텍처 레이어링: Jetpack Compose를 구성하는 아키텍처 레이어와 관련 디자인에 영향을 준 핵심 원칙을 알아보세요.
- 성능: 앱의 성능을 저하시킬 수 있는 일반적인 프로그래밍 실수를 방지하는 방법을 알아보세요.
- Compose의 시맨틱: 접근성 서비스와 테스트 프레임워크에 사용할 수 있는 방식으로 UI를 구성하는 시맨틱 트리에 관해 알아보세요.
- CompositionLocal을 사용해 로컬로 범위가 지정되는 데이터:
CompositionLocal
을 사용하여 Composition을 통해 데이터를 전달하는 방법을 알아보세요.
개발 환경
디자인
- 레이아웃: Compose의 네이티브 레이아웃 구성요소 및 고유한 자체 디자인 방법을 알아보세요.
- 레이아웃 기본사항: 간단한 앱 UI의 기본 요소를 알아보세요.
- Material 구성요소 및 레이아웃: Compose의 Material 구성요소 및 레이아웃을 알아보세요.
- 맞춤 레이아웃: 앱 레이아웃을 제어하는 방법과 자체 맞춤 레이아웃을 디자인하는 방법을 알아보세요.
- 다양한 디스플레이 크기 지원: Compose를 사용하여 다양한 디스플레이 크기, 방향, 폼 팩터에 맞게 조정할 수 있는 레이아웃을 빌드하는 방법을 알아보세요.
- 정렬 선: 맞춤 정렬 선을 만들어 UI 요소를 정확하게 정렬하고 배치하는 방법을 알아보세요.
- 내장 기능 측정: Compose는 패스당 한 번만 UI 요소 측정을 허용하므로 이 페이지에서는 측정하기 전에 하위 요소에 관한 정보를 쿼리하는 방법을 설명합니다.
- ConstraintLayout: Compose UI에서
ConstraintLayout
을 사용하는 방법을 알아보세요.
- 디자인 시스템: 디자인 시스템을 구현하고 앱의 디자인과 분위기를 일관되게 유지하는 방법을 알아보세요.
- 목록 및 그리드: 데이터 목록 및 그리드를 관리하고 표시하기 위한 Compose 옵션에 관해 알아보세요.
- 텍스트: 텍스트를 표시하고 수정하기 위한 Compose의 기본 옵션에 관해 알아봅니다.
- 그래픽: 맞춤 그래픽을 만들고 사용하기 위한 Compose의 기능에 관해 알아보세요.
- 애니메이션: UI 요소를 애니메이션 처리하기 위한 Compose의 여러 옵션에 관해 알아보세요.
- 동작: 사용자 동작을 감지하고 사용자 동작과 상호작용하는 Compose UI를 빌드하는 방법을 알아봅니다.
- 사용자 상호작용 처리: 구성요소가 사용자 작업에 응답하는 방식을 맞춤설정할 수 있도록 Compose가 하위 수준 입력을 상위 수준 상호작용으로 추상화하는 방법을 알아보세요.
Compose 채택
- 기존 뷰 기반 앱 이전: 기존 뷰 기반 앱을 Compose로 이전하는 방법을 알아봅니다.
- 이전 전략: Compose를 점진적으로 안전하게 코드베이스에 도입하는 전략을 알아봅니다.
- 상호 운용성 API: Compose의 API를 사용하여 Compose와 뷰 기반 UI를 결합하는 방법을 알아봅니다.
- 기타 고려사항: 뷰 기반 앱을 Compose로 이전하는 동안 테마 설정, 아키텍처, 테스트 등의 기타 고려사항에 관해 알아봅니다.
- Compose 및 기타 라이브러리: Compose 콘텐츠에서 뷰 기반 라이브러리를 사용하는 방법을 알아봅니다.
- Compose 아키텍처: Compose에서 단방향 데이터 흐름 패턴을 구현하는 방법, 이벤트 및 상태 홀더를 구현하는 방법,
ViewModel
을 사용하는 방법을 알아보세요.
- 탐색:
NavController
를 사용하여 탐색 구성요소를 Compose UI와 통합하는 방법을 알아봅니다.
- 반응형 UI용 탐색: 다양한 화면 크기, 방향, 폼 팩터에 맞게 조정되도록 앱의 탐색을 디자인하는 방법을 알아보세요.
- 리소스: Compose 코드에서 앱의 리소스를 사용하는 방법을 알아보세요.
- 접근성: 서로 다른 접근성 요구사항을 가진 사용자에게 적합한 Compose UI를 만드는 방법을 알아보세요.
- 테스트: Compose 코드 테스트에 관해 알아보세요.
- 테스트 요약본: 유용한 Compose 테스트 API를 빠르게 확인할 수 있습니다.
추가 리소스
추천 서비스
이 페이지에 나와 있는 콘텐츠와 코드 샘플에는 콘텐츠 라이선스에서 설명하는 라이선스가 적용됩니다. 자바 및 OpenJDK는 Oracle 및 Oracle 계열사의 상표 또는 등록 상표입니다.
최종 업데이트: 2025-08-21(UTC)
[[["이해하기 쉬움","easyToUnderstand","thumb-up"],["문제가 해결됨","solvedMyProblem","thumb-up"],["기타","otherUp","thumb-up"]],[["필요한 정보가 없음","missingTheInformationINeed","thumb-down"],["너무 복잡함/단계 수가 너무 많음","tooComplicatedTooManySteps","thumb-down"],["오래됨","outOfDate","thumb-down"],["번역 문제","translationIssue","thumb-down"],["샘플/코드 문제","samplesCodeIssue","thumb-down"],["기타","otherDown","thumb-down"]],["최종 업데이트: 2025-08-21(UTC)"],[],[],null,["Jetpack Compose is the modern toolkit for building native Android UI. Here's\nwhere you'll find the latest information about using Compose.\n\n- [Overview](/develop/ui/compose): See all the resources available to Compose developers.\n- [Tutorial](/develop/ui/compose/tutorial): Get started with Compose, by using it to build a simple UI.\n- [Quick Guides](/quick-guides): **New!** Try out our fast and focused guides, designed to get you to your goal as quickly as possible.\n\nFoundation\n\n- [Thinking in Compose](/develop/ui/compose/mental-model): Learn how Compose's declarative approach is different from the view-based approach you may have used in the past, and how to build a mental model of working with Compose.\n- [Managing state](/develop/ui/compose/state): Learn about setting and using state in your Compose app.\n- [Lifecycle of composables](/develop/ui/compose/lifecycle): Learn about the lifecycle of a composable, and how Compose decides if it needs to be redrawn.\n- [Modifiers](/develop/ui/compose/modifiers): Learn how to use modifiers to augment or decorate your composables.\n- [Side-effects in Compose](/develop/ui/compose/side-effects): Learn the best ways to manage side-effects.\n- [Jetpack Compose Phases](/develop/ui/compose/phases): Learn about the steps Compose goes through to render your UI, and how to use that information to write efficient code\n- [Architectural layering](/develop/ui/compose/layering): Learn about the architectural layers that make up Jetpack Compose, and the core principles that informed its design.\n- [Performance](/develop/ui/compose/performance): Learn how to avoid the common programming pitfalls that can hurt your app's performance.\n- [Semantics in Compose](/develop/ui/compose/semantics): Learn about the Semantics tree, which organizes your UI in a way that can be used by accessibility services and the testing framework.\n- [Locally scoped data with CompositionLocal](/develop/ui/compose/compositionlocal): Learn how to use `CompositionLocal` to pass data through the Composition.\n\nDevelopment environment\n\n- [Android Studio with Compose](/develop/ui/compose/setup): Set up your development environment to use Compose.\n- [Tooling for Compose](/develop/ui/compose/tooling): Learn about Android Studio's new features to support Compose.\n- [Kotlin for Compose](/develop/ui/compose/kotlin): Learn how certain Kotlin-specific idioms work with Compose.\n- [Compare Compose and View metrics](/develop/ui/compose/migrate/compare-metrics): Learn how migrating to Compose can affect your app's APK size and runtime performance.\n- [Bill of Materials](/develop/ui/compose/bom): Manage all your Compose dependencies by specifying only the BOM's version.\n\nDesign\n\n- [Layouts](/develop/ui/compose/layouts): Learn about Compose's native layout components, and how to design your own.\n - [Layout basics](/develop/ui/compose/layouts/basics): Learn about the building blocks for a straightforward app UI.\n - [Material Components and layouts](/develop/ui/compose/components): Learn about Material components and layouts in Compose.\n - [Custom layouts](/develop/ui/compose/layouts/custom): Learn how to take control of your app's layout, and how to design a custom layout of your own.\n - [Support different display sizes](/develop/ui/compose/layouts/adaptive/support-different-display-sizes): Learn how to use Compose to build layouts that adapt to different display sizes, orientations, and form factors.\n - [Alignment lines](/develop/ui/compose/layouts/alignment-lines): Learn how to create custom alignment lines to precisely align and position your UI elements.\n - [Intrinsic measurements](/develop/ui/compose/layouts/intrinsic-measurements): Since Compose only allows you to measure UI elements once per pass, this page explains how to query for information about child elements before measuring them.\n - [ConstraintLayout](/develop/ui/compose/layouts/constraintlayout): Learn how to use `ConstraintLayout` in your Compose UI.\n- [Design Systems](/develop/ui/compose/designsystems): Learn how to implement a design system and give your app a consistent look and feel.\n - [Material Design 3](/develop/ui/compose/designsystems/material3): Learn how to implement Material You with Compose's implementation of [Material Design 3](https://m3.material.io/).\n - [Migrating from Material 2 to Material 3](/develop/ui/compose/designsystems/material2-material3): Learn how to migrate your app from Material Design 2 to Material Design 3 in Compose.\n - [Material Design 2](/develop/ui/compose/designsystems/material): Learn how to customize Compose's implementation of [Material Design 2](https://material.io/) to fit your product's brand.\n - [Custom design systems](/develop/ui/compose/designsystems/custom): Learn how to implement a custom design system in Compose, and how to adapt existing Material Design composables to handle this.\n - [Anatomy of a theme](/develop/ui/compose/designsystems/anatomy): Learn about the lower-level constructs and APIs used by `MaterialTheme` and custom design systems.\n- [Lists and grids](/develop/ui/compose/lists): Learn about some of Compose's options for managing and displaying lists and grids of data.\n- [Text](/develop/ui/compose/text): Learn about Compose's main options for displaying and editing text.\n- [Graphics](/develop/ui/compose/graphics): Learn about Compose's features for building and working with custom graphics.\n- [Animation](/develop/ui/compose/animation/introduction): Learn about Compose's different options for animating your UI elements.\n- [Gestures](/develop/ui/compose/touch-input/pointer-input): Learn how to build a Compose UI that detects and interacts with user gestures.\n- [Handling user interactions](/develop/ui/compose/touch-input/user-interactions/handling-interactions): Learn how Compose abstracts low-level input into higher-level interactions, so you can customize how your components respond to user actions.\n\nAdopting Compose\n\n- [Migrate existing View-based apps](/develop/ui/compose/migrate): Learn how to migrate your existing View-based app to Compose.\n - [Migration strategy](/develop/ui/compose/migrate/strategy): Learn the strategy to safely and incrementally introduce Compose into your codebase.\n - [Interoperability APIs](/develop/ui/compose/migrate/interoperability-apis): Learn about Compose's APIs to help you combine Compose with View-based UI.\n - [Other considerations](/develop/ui/compose/migrate/other-considerations): Learn about other considerations like theming, architecture, and testing while migrating your View-based app to Compose.\n- [Compose and other libraries](/develop/ui/compose/libraries): Learn how to use view-based libraries in your Compose content.\n- [Compose architecture](/develop/ui/compose/architecture): Learn how to implement the unidirectional flow pattern in Compose, how to implement events and state holders, and how to work with `ViewModel` in Compose.\n- [Navigation](/develop/ui/compose/navigation): Learn how to use `NavController` to integrate the Navigation component with your Compose UI.\n - [Navigation for responsive UIs](/guide/topics/large-screens/navigation-for-responsive-uis): Learn how to design your app's navigation so it adapts to different screen sizes, orientations, and form factors.\n- [Resources](/develop/ui/compose/resources): Learn how to work with your app's resources in your Compose code.\n- [Accessibility](/develop/ui/compose/accessibility): Learn how to make your Compose UI suitable for users with different accessibility requirements.\n- [Testing](/develop/ui/compose/testing): Learn about testing your Compose code.\n - [Testing cheat sheet](/develop/ui/compose/testing-cheatsheet): A quick reference of useful Compose testing APIs.\n\nAdditional resources\n\n- [Get setup](/develop/ui/compose/setup)\n- [Curated learning pathway](/courses/pathways/compose)\n- [Compose API guidelines](https://android.googlesource.com/platform/frameworks/support/+/androidx-main/compose/docs/compose-api-guidelines.md)\n- [API reference](/reference/kotlin/androidx/compose)\n- [Codelabs](https://goo.gle/compose-codelabs)\n- [Sample apps](https://github.com/android/compose-samples)\n- [Videos](https://www.youtube.com/user/androiddevelopers/search?query=%23jetpackcompose)\n\nRecommended for you\n\n- Note: link text is displayed when JavaScript is off\n- [Locally scoped data with CompositionLocal](/develop/ui/compose/compositionlocal)\n- [Other considerations](/develop/ui/compose/migrate/other-considerations)\n- [Anatomy of a theme in Compose](/develop/ui/compose/designsystems/anatomy)"]]