유튜브블로그Top 10
내 프로필

데브허브 안내
소개업데이트 소식

데브허브 커뮤니티

FAB Menu In Material3 Expressive

Philipp Lackner

2025. 10. 26.

0

#mobile app
  • Material 3 Expressive의 새로운 FAB 메뉴는 일반 FAB를 여러 옵션을 제공하는 확장 가능한 메뉴로 변환합니다. 🔄
  • 이 메뉴는 2개에서 6개 사이의 옵션에 최적화되어 있으며, 1개 또는 7개 이상의 옵션에는 권장되지 않습니다. 📏
  • FAB 메뉴는 Material 테마의 primary, secondary, tertiary 색상을 활용하여 다양한 시각적 표현이 가능합니다. 🌈
  • 메인 버튼은 ToggleFloatingActionButton으로, 확장 상태에 따라 아이콘과 모양이 부드럽게 애니메이션으로 전환됩니다. 💫
  • 아이콘의 색상(tint)은 확장 상태에 따라 MaterialTheme.colorScheme을 사용하여 수동으로 설정해야 합니다. 🎨
  • 메뉴 항목은 텍스트와 아이콘으로 구성되며, 클릭 시 메뉴를 닫는 등 사용자 정의 동작을 수행할 수 있습니다. 👆
  • 이 기능은 하나의 주요 액션 아래 여러 개의 동등하게 중요한 하위 옵션이 있을 때 특히 유용합니다. 👍
  • 구현을 위해서는 최신 Material 3 버전과 Scaffold 내 배치가 필요하며, remember mutableStateOf로 상태를 관리합니다. ⚙️

Recommanded Videos