🤖 Compose 25

[Compose] 의존성 주입 (Dependency Injection) (ft.hilt) - 1

우선, 라이브러리 적용이 필요합니다 (dagger, hilt)[versions]//...daggerVersion = "2.48"hiltVersion = "1.2.0"retrofitVersion = "2.9.0"gsonVersion = "2.10.1"[libraries]//...dagger-android = { group = "com.google.dagger", name = "hilt-android", version.ref = "daggerVersion" }hilt-compose = { group = "androidx.hilt", name = "hilt-navigation-compose", version.ref = "hiltVersion" }androidx-gson = { group = "com.googl..

🤖 Compose 2025.02.11

[Compose] 안정성 stability

안정성에 관해서도 가장 중요한 키워드는 Smart Recomposition 같아요  Smart Recomposition- composition 함수에서 사용되는 데이터가 변경된 데이터의 함수만 재호출 즉 일부분의 ui만 업데이트 - 성능 최적화  이 때 compose는 필요한 recomposition임을 어떻게 구분할까 ?  -> paramater로 구분 크게 3가지로 나눠본다면  Stable parameters - 변경 시 컴포지션에서 추적이 가능하기 때문에 smart recomposition이 가능 - 즉, 변경 사항이 없다면 compose는 skip Unstable parameters - 변경 시 컴포지션에서 추적이 불가 -> 데이터의 변경 사항의 유무와 관계 없이 무조건 Recomposition-..

🤖 Compose 2025.02.09

[Compose] Rendering

Compose는 크게 보자면 Data를 UI로 변환하는 과정인데, 아래의 과정들을 거칩니다 Composition : what  (무엇을 그릴지)layout : where (UI를 어디에 배치할지)Drawing: How (어떻게 UI를 그릴지)  Compositioncode를 UI Tree화 시킵니다 즉, 데이터와 UI 요소 간의 관계가 정의됩니다 Layout아래의 과정으로 UI 트리를 탐색을 하면서, 각 레이아웃을 측정하고 배치됩니다하위 요소 측정: 노드가 하위 요소(있는 경우)를 측정자체 크기 결정: 이러한 측정치를 기반으로 노드가 자체 크기를 결정하위 요소 배치: 각 하위 노드는 노드의 자체 위치를 기준으로 배치이 때 , 모든 노드는 단 한번씩만 방문하기 때문에 Compose 런타임은 모든 노드를..

🤖 Compose 2025.01.31

[Compose] Compose의 LifeCycle

⭐️ Smart Recomposition- composition 함수에서 사용되는 데이터가 변경된 데이터의 함수만 재호출 즉 일부분의 ui만 업데이트 - 성능 최적화   Compose의 Lifecycle - composition : 컴포저블 함수가 호출되어 UI 트리를 구성하는 과정으로 여러 개의 컴포저블이 결합되어 최종 UI 생성, 즉 초기 UI를 설정하는 단계- recomposition : 상태가 변경되어 UI가 다시 그려지는 과정, 상태 변화를 감지하고 영향을 받는 부분만 업데이트 (최적화 하는 것이 제일 중요)- disposal : composable이 소멸, 리소스 해제  recomposition의 최적화를 위해서 생명주기를 아는 것이 중요합니다 만약 아래와 같이 코드를 사용한다고 하면, @Co..

🤖 Compose 2025.01.27

[Compose] 단방향 데이터 흐름

State :  위에서 아래로만 내려간다 - 일반적으로 상위 컴포넌트(부모)에서 하위 컴포넌트(자식)로 전달- UI 상태를 한 곳 (보통 부모 컴포넌트) 에서 관리해서  UI 컴포넌트(자식)는 그 상태에 대한 직접적인 수정이 불가능 -> 캡슐화 Event :  아래에서 위로 올라간다- UI 일부에서 이벤트를 생성해 위로 전달- 그 이벤트를 부모에게 알려주고 부모가 해당 이벤트에 대한 처리- 이벤트 발생 -> 이벤트 핸들러가 상태 변경(업데이트) -> 상태가 변경되면 state holder에서 변경된 상태 UI 표시 - 부모는 이벤트를 처리하고 상태를 변경 후, 새로운 상태를 다시 자식에게 전달. 자식은 상태 변경에 대한 영향을 받지만 직접적으로 상태를 수정불가  테스트 하기 용이하고, ui에 일관성 ex..

🤖 Compose 2025.01.23

[Compose] Navigation

라이브러리 추가가 필요합니다 [libs.version.toml][versions]//...navigationVersion = "2.8.5"[libraries]//...androidx-navigation-compose = { group = "androidx.navigation", name = "navigation-compose", version.ref = "navigationVersion" } [build.gradle]implementation(libs.androidx.navigation.compose) Navigation은 화면 간 전환을 관리하는 중요한 요소입니다예제를 통해 각각 필요한 개념을 익혀보겠습니다   NavController- 현재 Navigation 상태 관리, 화면 간 이동을 처리- 각 ..

🤖 Compose 2025.01.22

[Compose] compositionLocal

CompositionLocal을 통해 전역 상태를 선언, 이를 CompositionLocalProvider를 사용해 하위 Composable에 전달할 수 있다특정 값을 하위 Composable에주입하는 데 유용함val LocalExampleValue = compositionLocalOf { "기본 값" }@Composablefun ParentComposable() { CompositionLocalProvider(LocalExampleValue provides "제공된 값") { ChildComposable() }}@Composablefun ChildComposable() { val value = LocalExampleValue.current Text(text = valu..

🤖 Compose 2025.01.21

[Compose] Compose 주의점

1. Scaffold 사용 시 padding예전엔 Scaffold의 content에 직접 Column을 배치해도 문제가 없었는데, 최근 Studio 버전에서는 Lint 검사가 강화되어서 Scaffold의 content에 padding을 적용해야 경고, 오류가 안 뜬다    2. Card의 elevation  예전에는 Card의 elevation 속성에 직접 Dp 값 사용가능 - Material Design 3로 업데이트 되면서 CardElevation 객체를 사용하도록 변경됨   3. LazyColumn items- LazyColumn의 items 함수에 List를 직접 전달해 아이템 표시가 가능했는데 Compose 1.2.0 버전부터는 items 함수가 변경되어 더 이상 List를 직접 전달할 수 없다..

🤖 Compose 2025.01.17