Update awaitPointerEvent modifiers

Author: SmartToolFactory

Tutorial1-1Basics/src/main/java/com/smarttoolfactory/tutorial1_1basics/chapter5_gesture/AwaitPointerMotionModifier.kt

@@ -1,29 +1,59 @@
 package com.smarttoolfactory.tutorial1_1basics.chapter5_gesture
 
+import androidx.compose.foundation.Canvas
 import androidx.compose.foundation.gestures.awaitFirstDown
 import androidx.compose.foundation.gestures.forEachGesture
+import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.composed
 import androidx.compose.ui.input.pointer.AwaitPointerEventScope
 import androidx.compose.ui.input.pointer.PointerEvent
 import androidx.compose.ui.input.pointer.PointerInputChange
 import androidx.compose.ui.input.pointer.pointerInput
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.delay
+import kotlinx.coroutines.launch
 
 enum class MotionEvent {
  Idle, Down, Move, Up
 }
 
+
+/**
+ * Reads [awaitFirstDown], and [awaitPointerEvent] to
+ * get [PointerInputChange] and motion event states
+ * [onDown], [onMove], and [onUp].
+ *
+ * @param onDown is invoked when first pointer is down initially.
+ * @param onMove one or multiple pointers are being moved on screen.
+ * @param onUp last pointer is up
+ * @param scope [CoroutineScope] is required to have a delay after first down
+ * to give enough time for [onDown] to be processed before [onMove]
+ */
 suspend fun AwaitPointerEventScope.awaitPointerMotionEvent(
- onTouchEvent: (MotionEvent, PointerInputChange) -> Unit
+ onDown: (PointerInputChange) -> Unit = {},
+ onMove: (PointerInputChange) -> Unit = {},
+ onUp: (PointerInputChange) -> Unit = {},
+ scope: CoroutineScope
 ) {
 
  // Wait for at least one pointer to press down, and set first contact position
  val down: PointerInputChange = awaitFirstDown()
- onTouchEvent(MotionEvent.Down, down)
+ onDown(down)
 
  var pointer = down
  // Main pointer is the one that is down initially
  var pointerId = down.id
 
+ // If a move event is followed fast enough down is skipped, especially by Canvas
+ // to prevent it we add 20ms delay after first touch
+ var waitedAfterDown = false
+
+ scope.launch {
+ delay(20)
+ waitedAfterDown = true
+ }
+
  // This is preferred way in default Compose gesture codes
  // to loop gesture events and use consume or position changes to
  // break while loop
@@ -46,20 +76,38 @@ suspend fun AwaitPointerEventScope.awaitPointerMotionEvent(
  pointerId = pointerInputChange.id
  pointer = pointerInputChange
 
- onTouchEvent(MotionEvent.Move, pointer)
+ if (waitedAfterDown) {
+ onMove(pointer)
+ }
  } else {
  // All of the pointers are up
- onTouchEvent(MotionEvent.Up, pointer)
+ onUp(pointer)
  break
  }
  }
 }
 
+/**
+ * Reads [awaitFirstDown], and [awaitPointerEvent] to
+ * get [PointerInputChange] and motion event states
+ * [onDown], [onMove], and [onUp]. Unlike overload of this function [onMove] returns
+ * list of [PointerInputChange] to get data about all pointers that are on the screen.
+ *
+ * @param onDown is invoked when first pointer is down initially.
+ * @param onMove one or multiple pointers are being moved on screen.
+ * @param onUp last pointer is up
+ *
+ * ### Note
+ * There is a 20ms delay after [onDown] to let composables process this event.
+ * When pointer is moved fast [Canvas] is not able to react first down at each occurrence.
+ *
+ */
+suspend fun AwaitPointerEventScope.awaitPointerMotionEvents(
 
-suspend fun AwaitPointerEventScope.awaitPointerMotionEvent(
  onDown: (PointerInputChange) -> Unit = {},
- onMove: (PointerInputChange) -> Unit= {},
- onUp: (PointerInputChange) -> Unit= {},
+ onMove: ( List<PointerInputChange>) -> Unit = {},
+ onUp: (PointerInputChange) -> Unit = {},
+ scope: CoroutineScope
 ) {
 
  // Wait for at least one pointer to press down, and set first contact position
@@ -70,6 +118,15 @@ suspend fun AwaitPointerEventScope.awaitPointerMotionEvent(
  // Main pointer is the one that is down initially
  var pointerId = down.id
 
+ // If a move event is followed fast enough down is skipped, especially by Canvas
+ // to prevent it we add 20ms delay after first touch
+ var waitedAfterDown = false
+
+ scope.launch {
+ delay(20)
+ waitedAfterDown = true
+ }
+
  // This is preferred way in default Compose gesture codes
  // to loop gesture events and use consume or position changes to
  // break while loop
@@ -92,81 +149,88 @@ suspend fun AwaitPointerEventScope.awaitPointerMotionEvent(
  pointerId = pointerInputChange.id
  pointer = pointerInputChange
 
- onMove(pointer)
+ if (waitedAfterDown) {
+ onMove( event.changes)
+ }
+
  } else {
  // All of the pointers are up
- onUp(pointer)
+ onUp( pointer)
  break
  }
  }
 }
 
+
+/**
+ * Reads [awaitFirstDown], and [awaitPointerEvent] to
+ * get [PointerInputChange] and motion event states
+ * [onDown], [onMove], and [onUp].
+ *
+ * @param onDown is invoked when first pointer is down initially.
+ * @param onMove one or multiple pointers are being moved on screen.
+ * @param onUp last pointer is up
+ *
+ * ### Note
+ * There is a 20ms delay after [onDown] to let composables process this event.
+ * When pointer is moved fast [Canvas] is not able to react first down at each occurrance.
+ *
+ */
 fun Modifier.awaitPointerMotionEvent(
  onDown: (PointerInputChange) -> Unit = {},
- onMove: (PointerInputChange) -> Unit= {},
- onUp: (PointerInputChange) -> Unit= {},
-) =
- this.then(
+ onMove: (PointerInputChange) -> Unit = {},
+ onUp: (PointerInputChange) -> Unit = {},
+) = composed(
+ inspectorInfo = {
+ name = "awaitPointerMotionEvent"
+ },
+ factory = {
+ val scope = rememberCoroutineScope()
+
  Modifier.pointerInput(Unit) {
  forEachGesture {
  awaitPointerEventScope {
- awaitPointerMotionEvent(onDown, onMove, onUp)
+ awaitPointerMotionEvent(onDown, onMove, onUp, scope)
  }
  }
  }
- )
+ }
+)
+
+/**
+ * Reads [awaitFirstDown], and [awaitPointerEvent] to
+ * get [PointerInputChange] and motion event states
+ * [onDown], [onMove], and [onUp].
+ *
+ * [onMove] returns list of [PointerEvent] that are on screen
+ *
+ * @param onDown is invoked when first pointer is down initially.
+ * @param onMove one or multiple pointers are being moved on screen.
+ * @param onUp last pointer is up
+ *
+ * ### Note
+ * There is a 20ms delay after [onDown] to let composables process this event.
+ * When pointer is moved fast [Canvas] is not able to react first down at each occurrance.
+ *
+ */
+fun Modifier.awaitPointerMotionEvents(
+ onDown: (PointerInputChange) -> Unit = {},
+ onMove: (List<PointerInputChange>) -> Unit = {},
+ onUp: (PointerInputChange) -> Unit = {},
+) = composed(
+ inspectorInfo = {
+ name = "awaitPointerMotionEvent"
+ },
+ factory = {
+ val scope = rememberCoroutineScope()
 
-fun Modifier.awaitPointerMotionEvent(onTouchEvent: (MotionEvent, PointerInputChange) -> Unit) =
- this.then(
  Modifier.pointerInput(Unit) {
  forEachGesture {
  awaitPointerEventScope {
- awaitPointerMotionEvent(onTouchEvent)
+ awaitPointerMotionEvents(onDown, onMove, onUp, scope)
  }
  }
  }
- )
-
-suspend fun AwaitPointerEventScope.awaitMotionEvent(
- onTouchEvent: (MotionEvent, List<PointerInputChange>) -> Unit
-) {
-
- // Wait for at least one pointer to press down, and set first contact position
- val down: PointerInputChange = awaitFirstDown()
- onTouchEvent(MotionEvent.Down, listOf(down))
-
- var pointer = down
- // Main pointer is the one that is down initially
- var pointerId = down.id
-
- // This is preferred way in default Compose gesture codes
- // to loop gesture events and use consume or position changes to
- // break while loop
- while (true) {
-
- val event: PointerEvent = awaitPointerEvent()
-
- val anyPressed = event.changes.any { it.pressed }
-
- // There are at least one pointer pressed
- if (anyPressed) {
- // Get pointer that is down, if first pointer is up
- // get another and use it if other pointers are also down
- // event.changes.first() doesn't return same order
- val pointerInputChange =
- event.changes.firstOrNull { it.id == pointerId }
- ?: event.changes.first()
-
- // Next time will check same pointer with this id
- pointerId = pointerInputChange.id
- pointer = pointerInputChange
-
- onTouchEvent(MotionEvent.Move, event.changes)
-
- } else {
- // All of the pointers are up
- onTouchEvent(MotionEvent.Up, listOf(pointer))
- break
- }
  }
-}
+)
+

Tutorial1-1Basics/src/main/java/com/smarttoolfactory/tutorial1_1basics/chapter6_graphics/PathOption.kt

@@ -409,5 +409,5 @@ private val canvasModifier = Modifier
  .padding(8.dp)
  .shadow(1.dp)
  .background(Color.White)
- .fillMaxSize()
+ .fillMaxWidth()
  .height(200.dp)