Jetpack Compose | CoordinatorLayout 내 ComposeView 스크롤 문제

·

<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를 포함하는 협력 상위 뷰

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다