jetpack compose

Compose

Compose UI Test 맛보기

사전 setting Test를 작성하기 위한 의존성을 추가하자 androidTestImplemenation("androidx.compose.ui:ui-test-junit4:$compose_version") debugImplemenation("androidx.compose.ui:ui-test-manifest:$compose_version") AndroidTest 패키지 내부에 Test파일을 생성하자 Test Rule를 생성하자. @get:Rule val rule = createComposerRule() 이 테스트룰은 우리가 테스트를할 content를 세팅하거나 테스트 내에서 앱과 상호작용할 수 있게 만들어 줍니다. 테스트 클래스는 항상 test rule이 정의되어있어야합니다. 테스트 코드 작성 @Test ..

Compose

Jetpack Compose Theme 적용하기

기본적으로 Android Studio에서 Base Compose Activity를 생성하면 다음과 같은 기본적인 파일을 얻을 수 있습니다. setContent{ ProjectTheme { Surface(modifier = Modifier.fillMaxSize(), color = MaterialTheme.colors.background){ Greeting("ANDROID") } } } 위의 Theme 내부에 있는 요소들은 Material 디자인 가이드에 따라, 앱에 일관된 모양이나 Typography, Color, Shape들을 제공할 수 있는 파일들이다. 코드를 보면 ProjectTheme{}안에 우리가 원하는 Composable을 넣는 것을 볼 수 있다. 저 ProjectTheme{}는 무엇일까? Th..

Compose

Compose와 함께 Motion Layout을 사용하여 애니메이션 구현하기

오늘은 MotionLayout을 사용하여 애니메이션을 구현해보려구 합니다. Jetpack compose를 사용하면서 하나의 animation을 구현하려고 할 때, 변경하는 요소마다 animate value를 적용해야하는게 너무 힘들었던 경험이 있습니다. ( 쌓여가는 animateState들...) 애니메이션을 한번에 처리하기 좋은 MotionLayout을 사용하여 애니메이션을 처리하는 방법을 알아보려구 합니다. 자꾸자꾸 MotionLayout이라고 하는데 무엇이냐 MotionLayout은 ConstraintLayout의 서브 클래스이며 ConstraintLayout의 다양한 레이아웃 기능을 기초로 가지고 있다. MotionLayout은 레이아웃 전환과 복잡한 모션 처리 사이를 연결한다. 라고 Androi..

Compose

SwipeToDismiss Jetpack Compose로 구현하기

오늘은 위와 같이 Jetpack Compose로 Swipe하여 삭제(dismiss)하는 Composable를 만들어보려고합니다. Jetpack Compose는 기본적으로 SwipeToDismiss Composable를 제공하고 있습니다. 하지만 Material3 Stable Release 버전에서는 지원하지 않고 있습니다. ( Material2는 지원함 ) 하지만 알파버전인 1.1.0-alpha04 버전에서는 지원하니, 이 버전을 통해 구현해도 좋을 것 같습니다. 알파버전을 사용하지 않는다면 https://androidx.tech/artifacts/compose.material/material/1.0.0-alpha09-source/androidx/compose/material/Swipeable.kt.ht..

Compose

Jetpack Compose의 최적화

Jetpack compose의 최적화 Mashup 12기 프로젝트를 진행하면서, 앱 배포 이후 유지보수 기간을 가지게 되었습니다. 앱을 동작시키면서 Layout Inspector로 recomposition count를 통해 recomposition이 많이 일어나는 부분이 없는지 찾아보면서 유지보수를 진행하고 있는데요~ 자연스럽게 Jetpack compose의 최적화에 대해서 관심이 생기게되었습다. 일단 글에 들어가기 앞서 recomposition이 무엇인지 언제 일어나는지 파악할 필요가 있습니다. recomposition recomposition(재구성)은 입력이 변경될 때, 구성 가능한 함수를 다시 호출하는 프로세스입니다. 이것은 함수의 입력이 변경될 때 발생합니다. Compose가 새 입력을 기반으로..

Compose

Blur in Jetpack Compose

프로젝트를 진행하면서, 이미지를 흐리게 처리해야 하는 부분이 생겨서 jetpack compose를 이용하면서 이미지를 blur 처리하는 방법을 공유하면 좋을 것 같아서, 이미지 블러 처리에 대한 글을 작성하게 되었습니다~! 제가 최종적으로 만들려고 하는 카드는 다음과 같습니다. 하단에 이미지가 blur 처리되어 있는데요. 이것을 compose로 구현하기 위해서는 어떻게 구현을 해야 하는지 알아보도록 하겠습니다. API 31 이전까지는 Render Script를 사용하여 Blur 처리를 할 수 있었습니다. val bitmap = BitmapFactory.decodeResource( LocalContext.current.resources, R.drawable.your_image ) val rs = Rende..

KimDaQ
'jetpack compose' 태그의 글 목록