Android

핵심만 골라 배우는 젯팩 컴포즈 Study 1주차

가짜 개발자 2023. 1. 25. 20:54

Chapter 1 ~ 9

 

What is Compose?

  • UI 개발을 간소화하고 간편하게 할 수 있도록 도와주는 툴킷.
  • 기존의 UI는 명령형 방식이었지만, Compose는 선언형 방식. UI가 어떻게 보일지에 대한 구현에서 무엇을 보여주면 되는지에 대한 구현으로 변경.
  • 뷰의 상태만 선언하여 구현 부분은 프레임 워크에게 맡기는 방식.
  • 데이터가 변경되면 프레임 워크가 알아서 해당 함수들을  재호출하여 View를 업데이트. 적은 코드, 유지보수, 재사용 및 확장성 용이.
class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            ComposeExampleTheme {
                // A surface container using the 'background' color from the theme
                Surface(color = MaterialTheme.colors.background) {
                    Greeting("Android")
                }
            }
        }
    }
}

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

@Preview(showBackground = true)
@Composable
fun DefaultPreview() {
    ComposeExampleTheme {
        Greeting("Android")
    }
}
  • **setContent()**는 기존의 setContentView() 메서드와 동일한 동작을 하는 확장 함수. 다만, (@Composable) -> Unit타입의 컴포즈 UI를 구현해줘야함.
  • Theme -> Surface -> TextView 로 컴포저블이 다른 컴포저블을 호출하는 계층 구조로 이루어져 있음.
  • @Composable 어노테이션이 붙은 메서드들은 대문자로 시작하고 있습니다.
  • @Preview 어노테이션을 붙이면 안드로이드 스튜디오의 오른편에서 바로 UI를 확인 가능. @Preview 어노테이션을 붙인 메서드는 인자를 가질 수 없음
  • ***ComponentActivity()***를 상속받고 있음.
  • AppCompatActivity는 FragmentActivity를 상속받고 Fragment Activity는 ComponentActivity를 상속받음.
  • ComponentActivity에는 Compose 전용 앱에 필요한 모든 부분이 있음.

Modifier

  • 컴포즈에 내장된 코틀린 클래스.
  • 단일 객체 안에서 컴포저블에 광범위한 프로퍼티를 설정할 수 있음.
  • 한 컴포저블에서 생성하고 설정한 뒤 다른 컴포저블에 전달되고, 적용되기 전에 추가로 수정할 수도 있음.
  • 어떻게 배치하고 그릴지, 행동할지 등을 결정할 수 있음.
  • Composable의 크기, 레이아웃, 동작 및 모양 변경, 사용자 입력 처리, 클릭 기능 등.
  • Modifier의 순서는 결과에 영향을 주기 때문에 중요합니다

Compose의 State

  • Compose는 선언형 방식. 그래서 화면을 변경하기 위해서는 Composable function에 변경된 데이터를 전달하여 다시 호출하는 방법뿐.
  • Compose는 State를 런타임에 데이터가 변경되면 이를 Observing 하고 있다가 자동으로 재호출하여 UI를 그리는 방법을 제공합니다. 이를 재구성 Recomposing이라고 합니다. 이것이 가능한 이유는 custom kotlin complier plugin을 내부적으로 사용하고 있기 때문.
  • Composable은 함수가 재시작될 때마다 초기화되기 때문에 상태 값을 지역 변수로 저장하면 재구성이 될 때마다 함수가 새로 호출되기 때문에 저장된 상태 값은 유지되지 않습니다.
  • 상태 값을 계속 유지하려면 remember라는 delegate을 사용함. 만약 Configuration 변경이 발생한다면, 상태 값의 유지를 보장하지 못하므로 remeberSaveable을 사용해야함.
  • Composable에서 상태를 저장하고, 상태가 변경되었을 때 재구성을 추적하려면 **mutableStateOf()**를 이용해 MutableState를 생성하여 사용.
  • mutableListOf()나 ArrayList<T> 처럼 변경되는 객체는 Compose의 State로 사용하지 않음. 변경이 되더라도 Observing 할 수 없기 때문.

remember

  • 단순 remeber 사용
  • 구조분해 사용
  • by 사용 (Delegation)
  • mutable / immutable 변수 둘다 사용 가능
1. val mutableState = remember { mutableStateOf(default) }
2. var value by remember { mutableStateOf(default) }
3. val (value, setValue) = remember { mutableStateOf(default) }

Supported Types Of State

  • LiveData
  • Flow
  • RxJava2
반응형
저작자표시