ripple

- 얼마 전에 리플 효과를 적용시킨 FAB 버튼을 구현했었다.- 리플 내부에는 클릭 상태를 감지하는 interactionSource를 포함하고 있다. 이를 통해 리플뿐만 아니라 버튼 자체의 스케일이 변하는 애니메이션까지 추가해 보겠다.interactionSource = interactionSource,indication = rememberRipple( color = colorResource(R.color.color_system_label_default_light).copy(alpha = 0.16f), bounded = true),onClick = onClick - 먼저 아래 값들을 선언해 준다. 모두 pressed 상태를 감지하기 위한 요소이다.val interactionSource = rem..
- Ripple은 Android 5.0 (21) 머터리얼 디자인에 소개되었으며, 버튼을 클릭하였을 때, 물결이 퍼지듯이 효과가 나오는 기능이다.- Compose에서도 지원하고 있다. Modifier를 기반으로 적용 가능하다.@Composablepublic fun rememberRipple( bounded: Boolean = true, radius: Dp = Dp.Unspecified, color: Color = Color.Unspecified): Indication { val colorState = rememberUpdatedState(color) return remember(bounded, radius) { PlatformRipple(bounded, radius,..
- FAB란 앱의 주요 인터페이스 위에 둥둥 떠있다 하여 붙여진 이름으로서 앱의 기본 대표 동작들을 수행할 수 있도록 하는 버튼이다. - 보통 화면 오른쪽 하단에 둥근 사각형, 타원, 원으로 많이 표시된다.- 디자인 시스템 및 커스터마이징에 적합하도록 Compose 기반 직접 해당 버튼을 구현했다. - 먼저 상위 컴포저블로 Surface를 사용해준다.Surface( modifier = Modifier .size(52.dp) .clip(CircleShape) .clickable( interactionSource = interactionSource, indication = rememberRipple( ..
SeungYong.Lee
'ripple' 태그의 글 목록