Material Design은 플랫폼 및 기기 전반의 시각적 요소, 모션, 상호작용 디자인을 위한 포괄적인 가이드입니다. Android 앱에서 Material Design을 사용하려면 Material Design 사양에 정의된 가이드라인을 따르세요. 앱에서 Jetpack Compose를 사용하는 경우 Compose Material 3 라이브러리를 사용할 수 있습니다. 앱에서 뷰를 사용하는 경우 Android Material Components 라이브러리를 사용할 수 있습니다.
Android는 Material Design 앱을 빌드하는 데 도움이 되는 다음과 같은 기능을 제공합니다.
- 모든 UI 위젯의 스타일을 지정하는 Material Design 앱 테마
- 목록 및 카드와 같은 복잡한 뷰를 위한 위젯
- 맞춤 그림자 및 애니메이션을 위한 API
머티리얼 테마 및 위젯
표준 UI 위젯 스타일 지정과 같은 Material 기능을 활용하고 앱의 스타일 정의를 간소화하려면 앱에 Material 기반 테마를 적용합니다.
Android 스튜디오를 사용하여 Android 프로젝트를 만들면 기본적으로 Material 테마가 적용됩니다. 프로젝트의 테마를 업데이트하는 방법을 알아보려면 스타일 및 테마를 참고하세요.
사용자에게 익숙한 환경을 제공하려면 Material의 가장 일반적인 UX 패턴을 사용하세요.
- 플로팅 작업 버튼 (FAB)으로 UI의 기본 작업을 승격합니다.
- 앱 바를 사용하여 브랜드, 탐색, 검색 및 기타 작업을 표시합니다.
- 탐색 창을 사용하여 앱의 탐색을 표시하거나 숨깁니다.
- 접기 툴바, 탭, 하단 탐색 메뉴 등 앱 레이아웃과 탐색을 위한 다른 여러 머티리얼 구성요소 중에서 선택할 수 있습니다. 구성요소를 모두 보려면 Android용 머티리얼 구성요소 카탈로그를 참조하세요.
가능하면 사전 정의된 머티리얼 아이콘을 사용하세요. 예를 들어 탐색 창의 탐색 '메뉴' 버튼에는 표준 '햄버거' 아이콘을 사용합니다. 사용 가능한 아이콘 목록은 머티리얼 디자인 아이콘을 참고하세요. Android 스튜디오의 Vector Asset Studio를 사용하여 머티리얼 아이콘 라이브러리에서 SVG 아이콘을 가져올 수도 있습니다.
엘리베이션 그림자 및 카드
Android의 뷰에는 X 및 Y 속성 외에도 Z 속성이 있습니다. 이 속성은 다음을 결정하는 뷰의 엘리베이션을 나타냅니다.
- 그림자 크기: Z 값이 큰 뷰는 더 큰 그림자를 드리웁니다.
- 그리기 순서: Z 값이 더 높은 뷰가 다른 뷰 위에 표시됩니다.
카드 기반 레이아웃에 엘리베이션을 적용하여 머티리얼 모양을 제공하는 카드 내에 중요한 정보를 표시할 수 있습니다. CardView 위젯을 사용하여 기본 고도로 카드를 만들 수 있습니다. 자세한 내용은 카드 기반 레이아웃 만들기를 참고하세요.
다른 뷰에 고도를 추가하는 방법에 관한 자세한 내용은 그림자 및 클립 뷰 만들기를 참고하세요.
애니메이션
Animation API를 사용하면 UI 컨트롤의 터치 피드백, 뷰 상태 변경, 활동 전환을 위한 맞춤 애니메이션을 만들 수 있습니다.
이러한 API를 통해 다음을 할 수 있습니다.
- 터치 피드백 애니메이션으로 뷰의 터치 이벤트에 응답합니다.
- 회전 표시 애니메이션으로 뷰 숨기기 및 표시
- 맞춤 활동 전환 애니메이션으로 활동 간에 전환합니다.
- 곡선 모션으로 더 자연스러운 애니메이션을 만듭니다.
- 뷰 상태 변경 애니메이션으로 하나 이상의 뷰 속성 변경사항을 애니메이션으로 보여줍니다.
- 뷰 상태 변경 사이에 상태 목록 드로어블에 애니메이션을 표시합니다.
터치 피드백 애니메이션은 버튼과 같은 여러 표준 뷰에 빌드됩니다. Animation API를 사용하면 이러한 애니메이션을 맞춤설정하고 맞춤 뷰에 추가할 수 있습니다.
자세한 내용은 애니메이션 소개를 참고하세요.
드로어블
다음과 같은 드로어블 기능은 Material Design 앱을 구현하는 데 도움이 됩니다.
- 벡터 드로어블은 선명도의 손실 없이 확장 가능하며 단색 인앱 아이콘에 적합합니다. 벡터 드로어블에 관해 자세히 알아보세요.
- 드로어블 색조 조정을 사용하면 비트맵을 알파 마스크로 정의하고 런타임 시 색상으로 비트맵에 색조를 지정할 수 있습니다. 드로어블에 색조 추가 방법을 참고하세요.
- 색상 추출을 사용하면 비트맵 이미지에서 눈에 띄는 색상을 자동으로 추출할 수 있습니다. Palette API로 색상 선택 방법을 참고하세요.