Jetpack Compose theming – 설정하기

이 단계에서는 스타일링 할 간단한 뉴스 리더 앱으로 구성된 코드를 다운로드한다.

필요한 것

• Android Studio Arctic Fox

코드 다운로드

git이 설치되어 있으면 아래 명령을 실행하면 된다. git이 설치되어 있는지 확인하려면 터미널 또는 명령줄에 git –version 입력하고 올바르게 실행되는지 확인한다.

git clone https://github.com/googlecodelabs/android-compose-codelabs.git
cd android-compose-codelabs/ThemingCodelab

git이 없는 경우 다음 버튼을 클릭하여 이 코드랩의 모든 코드를 다운로드할 수 있다.

소스 코드 다운로드

Android Studio Artic Fox 이상에서 프로젝트를 열고 ‘파일 > 프로젝트 가져오기’를 선택하고 ThemingCodelab 디렉터리로 이동한다.

이 프로젝트에는 세 가지 주요 패키지가 포함되어 있다.

• com.codelab.theming.data : 여기에는 모델 클래스와 샘플 데이터가 포함된다. 이 코드랩에서는 이 패키지를 편집할 필요가 없다.
• com.codelab.theming.ui.start : 이 패키지는 이 Codelab의 시작점이다. 이 패키지에서는 Codelab에서 요청한 모든 변경을 수행해야 한다.
• com.codelab.theming.ui.finish : 참조용으로 사용할 코드랩의 최종 완성본.

참고: 언제든지 파일의 현재 상태를 완성된 상태와 비교할 수 있다. 파일의 작업 버전과 finish패키지 에서 해당 파일을 선택하고 Android Studio의 Compare function을 사용한다.

앱 빌드 및 실행

애플리케이션에는 코드랩의 시작(App) 및 완성(App-Finish) 상태를 반영하는 2개의 run configuration이 있다. 특정 configuration을 선택하고 run 버튼을 누르면 코드가 기기나 에뮬레이터에 배포된다.

애플리케이션에는 Compose 레이아웃 미리 보기 도 포함되어 있다. start/finish 패키지 중 하나에서 Home.kt를  살펴보고, 디자인 뷰(design view)를 열어, UI 코드 상의 반복적인 수정작업들을 빠르게 반영할 수 있는 여러개의 미리보기로 표시된다.

후원하기