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

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

데브허브 커뮤니티

Single & Multi-Choice Button Groups In Material3 Expressive

Philipp Lackner

2025. 10. 19.

0

#mobile app
  • Material 3 Expressive는 새로운 UI 컴포넌트인 버튼 그룹을 도입합니다. 🆕
  • 버튼 그룹은 기존 버튼을 라디오 버튼(단일 선택) 또는 체크박스(다중 선택)처럼 작동하도록 변환합니다. 🔄
  • 단일 선택 버튼 그룹은 항상 하나의 옵션만 선택 가능하며, 다중 선택 버튼 그룹은 여러 옵션을 선택할 수 있습니다. ☝️✌️
  • 선택 시 바운시한 애니메이션과 함께 버튼의 모양이 동적으로 변경됩니다. ✨
  • 버튼이 주어진 너비를 초과할 경우, overflowIndicator를 통해 추가 옵션을 드롭다운 메뉴로 제공할 수 있습니다. 🔽
  • 이 컴포넌트를 사용하려면 Material 3의 알파 버전(최소 1.5.0-alpha06 이상)이 필요하며, @OptIn(ExperimentalMaterialApi::class) 어노테이션이 요구됩니다. 🧪
  • ButtonGroup 컴포저블 내에서는 ButtonGroupScopetoggleableItem, clickableItem, customItem과 같은 비컴포저블 함수를 사용하여 버튼 콘텐츠를 정의합니다. 🛠️
  • 현재(알파 버전 기준) 버튼 그룹은 애니메이션 시 텍스트 줄바꿈이나 너비 확장 문제 등 시각적인 버그가 있어 사용에 제약이 있습니다. 🐛
  • 이러한 버그들로 인해 현재는 프로덕션 환경에서 사용하기 어렵지만, 향후 업데이트를 통해 개선될 것으로 기대됩니다. 🙏

Recommanded Videos