Floating Toolbars In Material3 Expressive
- Material 3 Expressive에 새롭게 도입된 '툴바'는 다양한 액션 버튼을 유연하게 담을 수 있는 컴포넌트입니다. 🆕
- 툴바는 화면에 떠 있는 '플로팅'과 하단에 고정된 '도킹' 두 가지 형태로 제공됩니다. ↔️
- '플로팅 툴바'는 현재 화면의 맥락과 관련된 특정 액션(예: 텍스트 서식 지정)에 주로 사용됩니다. ✍️
- '도킹 툴바'는 앱 전반의 탐색이나 광범위한 기능(예: 화면 전환)에 권장되며, 기존 하단 앱 바의 대체제로 활용됩니다. ⚓
- 툴바의 색상은 '표준' 또는 '생동감 있는' 구성으로 설정하여 사용자에게 시각적 강조를 조절할 수 있습니다. 🎨
- 주요 액션을 위한 플로팅 액션 버튼(FAB)을 툴바와 함께 선택적으로 표시하여 가장 중요한 기능을 부각할 수 있습니다. 🌟
- 툴바는
expanded 상태를 통해 보조 액션들을 확장하거나 축소하여 보여줄 수 있는 기능을 제공합니다. ↕️
Scaffold의 bottomBar 슬롯 대신 Box 컴포저블 내에서 Modifier.align을 사용하여 올바른 화면 여백과 유연한 배치를 확보해야 합니다. 📦
- '수직 플로팅 툴바'도 지원되어 태블릿 레이아웃이나 가로 공간이 제한적인 상황에서 유용하게 활용될 수 있습니다. 📏
- 너무 많은 액션 버튼을 나열하기보다는 드롭다운 메뉴 등을 활용하여 사용자 경험을 개선하는 것이 좋습니다. 💡
데브허브 | DEVHUB | Floating Toolbars In Material3 Expressive