[Kotlin/Compose] Slide-Unlock(밀어서 잠금해제) 기능 개발하기 (1)

Slide-Unlock 기능이 무엇인가? 요즘 잠금 해제 기능은 다들 지문 인식 또는 페이스 아이디를 통해 잠금 해제를 하는데, 몇 년 전에는 밀어서 잠금 해제를 많이 쓰곤 했다. 대충 이런 느낌인데, 최근에 AnchoredDraggable에 대해 학습한 김에, 다음 기능을 구현해보고자 한다. 오늘의 완성본 구현 enum class 가장 먼저 상태를 표현할 enum class를 생각해보자. 잠금 해제의 상태는 처음 - 끝 으로 표현이 가능하다. enum class Position{ Start,End } state 구현 다음은 가장 중요하다고 생각하는 컴포저블의 드래그 상태를 저장하는 state의 구현이다. val state = remember { AnchoredDraggableState( initialV..

• format_list_bulleted 안드로이드/Compose
• · 2023. 12. 15.
• textsms

[Kotlin/Compose] Swipe Action 기능 만들기 with. AnchoredDraggable

AnchoredDraggable 포스팅에 앞서 Anchored draggable이 무엇인지 간단하게 설명해보고자 합니다. AnchoredDraggableState AnchoredDraggableState는 드래그 가능한 요소를 관리하고 제어하는 데 사용합니다. 간단하게 설명하자면, 특정 앵커 포인트 사이에서 드래그를 관리하는 데 사용되는 상태 객체 입니다. class AnchoredDraggableState( initialValue: T, internal val positionalThreshold: (totalDistance: Float) -> Float, internal val velocityThreshold: () -> Float, val animationSpec: AnimationSpec, inte..

• format_list_bulleted 안드로이드/Compose
• · 2023. 12. 14.
• textsms

[Android/Kotlin] MotionLayout

MotionLayout이란? MotionLayout는 앱에서 모션과 위젯 애니메이션을 관리하는 데 도움이 되는 레이아웃. ConstaintLayout의 서브클래스이다. MotionLayout은 완전히 선언적이므로, XML에서 모든 전환을 설명할 수 있다. 간단한 스와이핑 애니메이션 만들기 주의사항 https://developer.android.com/develop/ui/views/animations/motionlayout?hl=ko#androidx 공식 문서에 따르면, 사용자가 상호작용 하는 버튼, 제목 표시줄 등 UI 요소를 이동하고 크기를 조절 및 애니메이션 처리를 위한 것이다. 불필요한 특수효과로는 사용하지 말라고 한다. 사용해보기 의존성 추가하기 dependencies { implementatio..

• format_list_bulleted 안드로이드/Compose
• · 2023. 12. 8.
• textsms

[Compose UI] 텍스트/이미지 반짝임 로딩화면 만들기

반짝임 애니메이션 앱을 사용하다보면, 화면이 로딩되는 과정에서 이미지나, 텍스트가 보여지는 공간에 반짝임 애니메이션이 보이며 로딩중이라는 느낌을 주는 경우가 많다. 과연 이런건 어떻게 구현할까? 반짝임 애니메이션 만들기 확장 함수 만들기 Modifier클래스의 확장 함수를 만들어 반짝임 이미지를 생성하도록 하겠습니다. Modifier의 확장 함수를 만들기 위해, 다음과 같이 작성해줍니다. fun Modifier.shimmerEffect(): Modifier = composed { } 함수 내부의 값은 가장 먼저 상태 값을 저장할 변수를 정의해줍니다. var size by remember { mutableStateOf(IntSize.Zero) } val transition = rememberInfinit..

• format_list_bulleted 안드로이드/Compose
• · 2023. 11. 29.
• textsms

[Compose UI] Cutstom Pager를 이용하여 swipe transition 구현하기

Swipe Transition? 앱을 사용하다보면, 다음과 같이 swipe를 할 때 애니메이션을 사용하는 경우가 있다. 이러한 기능을 어떻게 구현할 수 있을까? Pager 콘텐츠를 좌측에서 우측으로 넘기고자 하면, Compose에서는 HorizontalPager 또는 VerticalPager를 사용하면 된다. 이번 포스팅에서는 HorizontalPager를 이용하여, 해당 애니메이션을 적용한 View를 구현해보겠다. 아래의 포스팅을 참고하여 제작하였으므로, 더 자세한 내용을 원하는 분들은 확인!-! https://medium.com/androiddevelopers/customizing-compose-pager-with-fun-indicators-and-transitions-12b3b69af2cc Cust..

• format_list_bulleted 안드로이드/Compose
• · 2023. 11. 28.
• textsms

Action Kotlin 6 - 연산자 오버로딩과 기타 관계

Plus Kotlin에서는 연산자 오버로딩을 통해 연산자의 동작을 커스터마이징 할 수 있다. Plus 메서드를 오버로딩하면, +연산자를 사용할 때, plus 메서드가 호출된다. class MyNumber(val value: Int) { operator fun plus(other: MyNumber): MyNumber { return MyNumber(value + other.value) } } fun main() { val num1 = MyNumber(10) val num2 = MyNumber(20) val result = num1 + num2 // MyNumber의 plus 메서드가 호출됨 println(result.value) // 30 출력 } 위의 예시 코드를 보면 plus를 오버로딩하기 위해서는 p..

• format_list_bulleted 안드로이드/Action Kotlin
• · 2023. 10. 30.
• textsms