Jetpack Compose | CoordinatorLayout 내 ComposeView 스크롤 문제

J
<androidx.coordinatorlayout.widget.CoordinatorLayout
        android:id="@+id/coordinator"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <com.google.android.material.appbar.AppBarLayout
            android:id="@+id/appBarLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@android:color/white"
            app:elevation="0dp" />


        <androidx.compose.ui.platform.ComposeView
            android:id="@+id/compose_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />

...

</androidx.coordinatorlayout.widget.CoordinatorLayout>

다음과 같이 CoordinatorLayout의 자식으로 ComposeView를 가지게 되는 구성에서, ComposeView의 스크롤 이벤트를 의도대로 처리할 수 없다.

CoordinatorLayout 과 해당 레이아웃 내의 ComposeView 간 스크롤 상호작용이 안되는 문제는 다음과 같이 해결 할 수 있다.

val nestedScrollInterop = rememberNestedScrollInteropConnection()
        
Surface(modifier = Modifier.nestedScroll(nestedScrollInterop)) {
    ...
}

다음과 같이 제공되는 NestedScrollConnection를 생성하고, ComposeView 의 최상단 Composable에 nestedScroll 수정자를 통해 적용하여 문제를 해결한다.

중첩 스크롤 상호 운용성 > 하위 ComposeView를 포함하는 협력 상위 뷰

About the author

Gyeongrok Kim

1 comment

ㅇㅇ에 답글 남기기 Cancel reply

Your sidebar area is currently empty. Hurry up and add some widgets.