클래스/└ TIL

<WIL> 플러터와 다트, 그리고 디자인

디벅잉 2022. 8. 6. 15:16
728x90

 

🧭

 

디자인

아이콘 사이즈 기준

20dp, 24dp, 40dp, 48dp를 권장하고 있습니다.

아이콘 터치 영역은 이에 더해 상하좌우 10dp의 영역을 포함하는 것이 좋습니다.

(아이콘 사이즈가 24dp by 24dp일 경우, 터치 인식 영역은 48dp by 48dp)

https://m3.material.io/styles/icons/applying-icons

 

Material Design

Icons can be used to represent common actions. Material Symbols are a set of variable icon fonts created at seven weights across three different styles.

m3.material.io

 

플러터

primary 속성

GridView, ListView의 경우 자체 스크롤을 포함하고 있는데, 부모 위젯의 스크롤에만 반응하도록 하려면 primary 속성을 false로 지정합니다.

 

스크롤 상하단 glow 효과 없애기

해당 스크롤뷰를 NotificationListener로 감싸고, 아래 링크를 참고하여 속성을 지정해 줍니다.

https://stackoverflow.com/questions/60896052/how-can-i-remove-disable-vertical-pageview-top-bottom-color-scroll-glow-flut

 

How can I remove/disable vertical PageView top/bottom color - scroll glow - Flutter

Does anyone know if there is a way to remove the PageView color that occurs when the user reaches the end of the items? this is an image that describes what I mean Click here PageView.builder( ...

stackoverflow.com

 

ReorderableListView를 사용 시 드래그되는 아이템의 배경 및 그림자 효과 변경

아래와 같이 theme으로 감싸줍니다.

 

다트

getter, setter를 불필요하게 사용하지 않습니다.

Effective Dart: Usage > Membes > DON’T wrap a field in a getter and setter unnecessarily.

https://dart.dev/guides/language/effective-dart/usage

 

Effective Dart: Usage

Guidelines for using language features to write maintainable code.

dart.dev

 

메서드 이름은 get으로 시작하지 않도록 합니다.

Effective Dart: Design > Names > AVOID starting a method name with get.

https://dart.dev/guides/language/effective-dart/design

 

Effective Dart: Design

Design consistent, usable libraries.

dart.dev

 

728x90