오늘도 더 나은 코드를 작성하였습니까?

Shape(개요) 본문

Android Material Design3

Shape(개요)

hik14 2023. 4. 11. 15:13

Takeaways

 

- Circular / pill 모양의 구성 요소는 구성 요소 dp 값의 ½에 대한 fixed 매핑 대신 fully rounded  모서리 스타일을 사용합니다.

이렇게 하면 구성 요소의 크기가 조정되더라도 모양이 원형으로 유지됩니다.

- The default shape family는  rounded

- 기본적으로 도형 스타일은 모든 모서리에 대칭으로 적용되지만, container의 모서리 위, 아래, 시작 또는 끝에 비대칭 스타일을 정의할 수 있습니다.

 

What's new

M3 Shape System은 7가지 스타일의 크기 based scale 를 사용합니다. 

 

style은 원하는 둥글기 또는 모서리 절단 정도에 따라 구성 요소에 지정됩니다.

모서리의 둥근 정도의 경우, 각진 모양은 "none"이고 약간 둥근 모양은 "extra-small"이며 완전히 둥근 모양은 "full"입니다.

이는 구성 요소가 container 크기별로 그룹화된 M2 shape system 에서 변경된 것입니다.

새로운 M3 shape system 은 UI 전체에 다양한 shape를 표현할 수 있는 서체 스케일과 비슷합니다.

'Android Material Design3' 카테고리의 다른 글

Elevation(Overview)  (0) 2023.04.11
Shape scale & Token  (0) 2023.04.11
Applying type  (0) 2023.04.10
Typography(Type scale)  (0) 2023.04.10
How to read tokens  (0) 2023.04.07