[TIL] 🌼24/05/29🌼

[TIL] 🌼24/05/29🌼

Today I Solved

• [LeetCode] 344. Reverse String(Kotlin)
• [LeetCode] 125. Valid Palindrome(Kotlin)

Today I Read

📌12 ways to improve your Jetpack Compose composable functions

• modifier 파라미터
  • Composable 함수 파라미터로 꼭 추가하기
  • Default 값 설정하기 (modifier = Modifier)
  • 하위 Composable에서 modifier 재사용 X

    // Don't do this
    @Composable
    private fun MyComposable(modifier: Modifier = Modifier) {
     Column(modifier) {
       Text(modifier.clickable(), ...)
       Image(modifier.size(), ...)
       Button(modifier, ...)
     }
    }
    // Do this
    @Composable
    private fun MyComposable(modifier: Modifier = Modifier) {
     Column(modifier) {
       Text(Modifier.clickable(), ...)
       Image(Modifier.size(), ...)
       Button(Modifier, ...)
     }
    }

• ViewModel 파라미터
  • Composable 블록 내부에서 정의 X, 생성자 파라미터로 Inject 하기
  • viewmodel 객체 그대로 하위 Composable에 넘기지 X

    // Don't do this
    @Composable
    fun MyComposable(
      viewModel: MyViewModel = viewModel()
    ) {
     OtherComposable(viewModel)
    }
    // Do this
    @Composable
    fun MyComposable(
     viewModel: MyViewModel = viewModel()
    ) {
     val uiState = viewModel.uiState.collectAsState()
     OtherComposable(
       data = uiState.data,
       onSaveButtonClicked = viewModel::onSaveButtonClicked
     )
    }

• 파라미터 순서 지키기
  • 필수 파라미터 먼저, 그 다음에 선택 파라미터(= default value가 있는 파라미터)
  • 선택 파라미터들 중 modifier가 가장 먼저
• Composable 함수 하나는 레이아웃의 하나의 content만 emit 해야

  //Don't do this
  Column {
   MyComposable()
  }
  //Do this
  @Composable
  private fun MyComposable() {
   Text(...)
   Image(...)
   Button(...)
  }
  // Or do this
  @Composable
  private fun ColumnScope.MyComposable() {
   Text(...)
   Image(...)
   Button(...)
  }

• Preview Composable은 private으로 선언하기

📌Do you mark your Compose preview functions as private?

• Preview Composable을 private으로 선언해야 하는 이유?
  해당 클래스/파일에서만 접근 가능
  -> 프로젝트의 다른 클래스/파일에서 Preview 함수 modify하는 것 막음
  -> 캡슐화, 에러 가능성 낮아짐