꿈 많은 개발자가 되자 - Taehwan

Android Compose에서는 어떠한 컴포넌트를 최상위로 두고 작업하는 것이 좋을까?

필자의 경우 Compose 시작점 코드는 아래와 같다.

class SampleActivity {

  fun onCreate() {
    setContent { // Compose 활용 시작
      SampleTheme { // 기본 Theme 정의
        CompositionLocalProvider(options) { // 내부에서 활용할 CompositionLocal 이 있다면 등록
          Scaffold { // 머트리얼을 따르는 기본 틀
            // 여기에서 View 처리
          }
        }
      }
    }
  }
}

Theme를 기본으로 적용하고, 여기에 CompositionLocalProvider를 필요에 따라 추가로 활용하고 있다.

그런 다음 Scaffold를 활용해 Material을 따르는 기본 틀을 활용하고 있다.

이 글에서 알아볼 내용

• Material의 구조를 가볍게 살펴보자
• Material의 Scaffold를 알아본다
• TopAppBar를 알아본다.

Read More

Android XML은 기본 Preview가 잘 나온다. 하지만 Compose는 Preview를 하기 위한 기법이 필요하다.

• Preview를 잘하기 위해서는 Primitive types 또는 class 객체를 넘겨준다.
• DI를 이용하는 경우 Preview가 힘들다.
• DI를 활용하는 경우라면 @Preview 함수 내에서 DI에서 만들어주는 객체를 manual dependency injection을 통해 생성해 초기화 시켜야 한다.

그래서 추천하는 방식은 아래와 같다.

1. DI를 활용한 ViewModel에서 전달받아 값을 처리하는 @Composable fun을 하나 만든다.
2. Primitive types/data class/@Composable () -> Unit를 파라메터로 가지는 함수를 생성한다.
3. 1. 번을 Preview 하는 함수를 작성한다.

// 1번에 대한 구현
@Composable
internal fun MainContainer(viewModel: ViewModel) {
  val value by remember { viewModel.value }
  MainContainer(value)
}

// 2번에 대한 구현
@Composable
private fun MainContainer(value: String) {
  Text(text = value)
}

// 3번에 대한 구현
@Preview
@Composable
internal fun PreviewMainContainer() {
  SampleThemePreview {
    MainContainer(
      value = "value",
    )
  }
}

이 글에서 알아볼 내용

• Compose Preview를 잘 그릴 수 있는 방법
• ViewModel을 쉽게 활용하기 위한 방법

Read More

Material Design은 크게 버전 2와 버전 3로 나눠지는데, 일반적으로 M2는 Material로 명시되어 있다.

• Material Design
• Material Design 3

안드로이드 12와 함께 나온 디자인이 머트리얼 3인데, 안드로이드 스튜디오에서 컴포즈 관련 새로운 프로젝트 생성 시에 함께 나오는 머트리얼 버전은 2이다.(안드로이드 스튜디오 패치 시 변경될 수 있다)

머트리얼 2와 3는 차이가 있다.

• 색상에 대한 층이 머트리얼 3가 더 넓다.(하지만 모든 컬러를 구글의 기본 컴포넌트에서 활용하지는 않는다)
• style 관련을 피그마 정보와 쉽게 연동되어 읽기 쉽다.
  • titleSmall, headlineLarge 와 같은 형태이다.
• 3에서는 다이나믹 컬러를 제공한다. 일반적인 회사에서는 특별히 선호하지는 않을 것 같다.
• 머트리얼 3에서 폴드 대응을 하기 위한 별도 라이브러리를 제공한다.
• 머트리얼 3 용 Exo player 용 라이브러리도 제공한다.

지금 선택한다면 3를 선택하는 건 나쁘지 않다. 하지만 2를 선택하여 활용하는 경우도 많을 것 같아 이 글을 간단하게 정리해두려고 한다.

• 3에는 아직 BottomSheet가 포함되어 있지 않아 결국 2와 3를 함께 활용해야 할 수 있다.

이 글에서 알아볼 내용

• 머트리얼 2의 색상 정보
• isLight가 뭘까?

Read More

Android Compose에서 keyboard가 노출되었는지 알 수 있는 방법은 과거 안드로이드 view 높이 변경으로 가능하다.

공식적인 안드로이드 11부터는 아래의 코드로 확인이 가능하지만 minSdk 버전 제약이 있으니 아직은 과거 형태를 공존시키는 게 좋다.

Android 11부터 활용 가능

Virtual keyboard show/hide event - stack overflow

view.setWindowInsetsAnimationCallback(object : WindowInsetsAnimation.Callback {
    override fun onEnd(animation: WindowInsetsAnimation) {
        super.onEnd(animation)
        val showingKeyboard = view.rootWindowInsets.isVisible(WindowInsets.Type.ime())
        // now use the boolean for something
    }
})

Compose에서도 특별히 keyboard 노출 정보를 제공하는 라이브러리가 없어서 stack overflow를 통해 확인하면 대부분 기존 view 높이를 기반한 코드를 활용하고 있다.

그래서 Compose에서 활용 가능한 형태로 맵핑하고 이 이벤트를 간단하게 활용할 수 있는 라이브러리를 배포하였다.

이 글에서 알아볼 내용

• View 높이 변경을 측정하여 keyboard 이벤트 처리하는 방법
• CompositionLocalProvider 활용법

Read More

안드로이드 MVVM을 효과적으로 작성하려면 알아야 할 것은 무엇일까? 그리고 왜 MVVM을 하려고 하는 것일까?

우리는 항상 새로운 것을 갈망하는데, 사실 안드로이드가 너무 고여서 재미가 없기 때문이다.

10년이 넘은 안드로이드는 초기에는 안드로이드 플랫폼의 변화에 대응하였고, MVP라는 패턴을 소개하기 시작하면서 패턴에 관심을 가지기 시작했다.

거기에 kotlin으로 언어도 변화되었고, RxJava, Coroutines, Flow 등 새로운 라이브러리가 계속 나오고 있다.

기반이 바뀐 것이다.

새로 시작하는 분들을 기준으로 한다면 엄청나게 덩치 큰 걸 한 번에 주입해야 한다는 문제가 생긴다.

따라 하는 건 누구나 하고, 동작하는 것 역시 누구나 만들 수 있다.

다만 좀 더 재미있고, 새로운 방식에 고통받으며 재미를 찾아가는 재미도 함께 해야 한다.

이 글은 지극히 주관적인 생각을 담고 있는 글이다.

이 글에서 알아볼 내용

• MVVM과 MVP
• MVVM에서의 테스트 검증
• 테스트 검증을 좀 더 잘해보자.

Read More