Material Design

luneah·2022년 8월 11일
0

Flutter

목록 보기
17/29
post-thumbnail

Material Design

Material은 Android, iOS, Flutter 및 웹을 위한 고품질 디지털 경험을 구축할 수 있도록 Google에서 만든 디자인 시스템이다.

구성 요소는 다음을 포함하여 다양한 인터페이스 요구사항을 충족한다.

  • 디스플레이 : 카드, 목록 및 시트와 같은 구성 요소를 사용하여 콘텐츠를 배치하고 구성한다.
  • 탐색 : 탐색 창 및 탭과 같은 구성 요소를 사용하여 사용자가 제품을 이동할 수 있다.
  • 작업 : 사용자가 부동 작업 버튼 과 같은 구성 요소를 사용하여 작업을 수행할 수 있다.
  • 입력 : 사용자가 텍스트 필드, 칩 및 선택 컨트롤과 같은 구성 요소를 사용하여 정보를 입력하거나 선택할 수 있다.
  • 통신 : 스낵바, 배너 및 대화 상자와 같은 구성 요소를 사용하여 주요 정보 및 메시지에 대해 사용자에게 경고한다.

MediaQuery

화면의 크기 / 방향 등 얻을 때 사용한다. MediaQuery.of 를 사용하여 현재 미디어를 쿼리하면 MediaQueryData 가 변경될 때마다(예: 사용자가 장치를 회전하는 경우) 위젯이 자동으로 다시 빌드된다.

https://api.flutter.dev/flutter/widgets/MediaQuery-class.html

Theme

테마를 미리 지정해서 일관된 UI를 구성할 때 사용한다. 앱 전체에서 색상과 글꼴 스타일을 공유하려면 테마를 사용하면 된다. 앱 전체 테마를 정의하거나 어플리케이션의 특정 부분에 대한 색상 및 글꼴 스타일을 정의하는 위젯을 사용할 수 있다.

https://docs.flutter.dev/cookbook/design/themes

Material 3

구글의 머티리얼 디자인 버전 3, 머티리얼 3 또는 U라고도 부른다.

https://m3.material.io/

Material Theme Builder
자동으로 테마 컬러셋을 만들어주는 사이트

profile
하늘이의 개발 일기

0개의 댓글