Can someone explain what's going on here with hori...
# compose-wear
l
Can someone explain what's going on here with horizontal scrolling? I'm seeing an issue where scrolling an element horizontally sometimes just triggers the system activity swipe-to-dismiss action instead of scrolling. This happens almost all the time on my real device (Galaxy Watch 5) and a bit less frequently in an emulator. It kind of feels like there's some race condition in
scrollable
implementation that sometimes passes drag gestures to the activity and some times not. Here's a minimal sample:
Copy code
class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        installSplashScreen()
        super.onCreate(savedInstanceState)
        setContent { WearApp() }
    }

    override fun onTouchEvent(event: MotionEvent?): Boolean {
        Log.d(TAG, "onTouchEvent: $event")
        return super.onTouchEvent(event)
    }
}

@Composable
fun WearApp() {
    MyTestAppComposeTheme {
        Box(
            modifier = Modifier.fillMaxSize().padding(horizontal = 8.dp)
        ) {
            val offsetX = remember { mutableFloatStateOf(0f) }
            val scrollState = rememberScrollableState {
                offsetX.floatValue += it
                it
            }

            Box(
                modifier = Modifier
                    .fillMaxRectangle()
                    .border(width = 1.dp, color = Color.White)
                    .scrollable(scrollState, Orientation.Horizontal)
                contentAlignment = Alignment.Center
            ) {
                Text(offsetX.floatValue.toString())
            }
        }
    }
}
This renders a box that is horizontally swipeable. As far as I know it should never let the activity swipe-to-dismiss trigger as long as the scrolling gestures start inside the box, right? Defining horizontal scroll semantics mostly fixes this; for example adding this after
.scrollable
in the above snippet
Copy code
.semantics {
    horizontalScrollAxisRange = ScrollAxisRange(
        { offsetX.floatValue }, { 100f /* dummy value */ })
},
Is it a bug or should this be working without the semantics modifier? I know horizontal scrolling has been discussed many times here but I could not find this particular issue anywhere
s
Hi - it might be worth looking at Wear Compose Foundation SwipeToDismissBox and Modifier.edgeSwipeToDismiss to get more control about when the system swipe-to-dismiss should be active and when the swipe/scroll gesture should be handled by your app. Also, Wear Compose Foundation HorizontalPager implements a (new) GestureInclusion interface to express how that 'edge zone' should be treated - the default being to leave a 15% vertical slice for system swipe-to-dismiss on the first page. If that isn't directly useful to your app, the approach could be something you could look at.
👍 1