(Android) Jetpack Compose 기본 사항

by

Jetpack Compose는 Android용 최신 선언적 UI 도구 키트입니다.

Jetpack Compose 이전의 Android UI는 XML로 작성되었습니다. 사용자 인터페이스가 XML 파일에 기록된 후

findViewById()와 같은 함수를 사용하여 트리를 탐색하고 메서드를 호출하여 노드를 수정했습니다.

이것은 여러 위치에서 렌더링한다는 것을 의미합니다. B. XML 파일과 .java(또는 .kt)에서 충돌이 발생하거나 둘 다 업데이트하는 것을 잊을 수 있습니다.

'추천 관련글,

XML로 UI를 구성하는 방법은 다음과 같습니다.

 <Button
        android:id="@+id/releaseInputButton"
        android:layout_width="210dp"
        android:layout_height="48dp"
        android:layout_marginBottom="12dp"
        android:backgroundTint="@color/material_dynamic_neutral30"
        android:fontFamily="@font/nanum_square_neo"
        android:text="@string/release_release"
        app:layout_constraintBottom_toTopOf="@+id/releaseCancelButton"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.497"
        app:layout_constraintStart_toStartOf="parent" />
val releaseButton: Button = findViewById(R.id.releaseInputButton)    // findViewById()를 사용하여 xml 파일에서 버튼을 가져온다
releaseButton.setOnClickListener{}    // 버튼에 setter 메소드를 이용하여 동작을 등록한다

이 방법 대신 Jetpack Compose를 사용하면 선언된 UI를 사용할 수 있으므로 위 과정을 간소화할 수 있습니다.

@Composable
fun Greeting(name: String){
    Text("Hello $name")
}

Jetpack Compose 기능을 사용할 때 다음 사항에 유의하세요.

  • 함수는 @Composable 주석을 사용하여 지정할 수 있습니다.
  • 구성 가능한 함수는 매개변수를 수신할 수 있으며 해당 매개변수로 사용자 인터페이스를 구성할 수 있습니다.
  • 예를 들어 이 함수는 Text() 함수 Composable을 사용하여 텍스트를 렌더링합니다.
  • 구성 가능한 함수는 아무 것도 반환하지 않습니다.
  • 구성 가능한 함수는 멱등적이며 부작용이 없습니다. 즉, 여러 번 호출해도 같은 방식으로 작동합니다.