Is it correct that `.pointerInput(Unit) {}` can on...

# compose

[Stefan Oltmann]

Is it correct that .pointerInput(Unit) {} can only take one argument?

I have one call to detectTransformGestures, but if I add another thing like

detectTapGestures(
    onPress = {
        println("ON PRESS")
    }
)

or detectDragGestures before that it's never called.

Only the first of these are called and all others are ignored.

I don't know how I'm supposed to combine a drag handler with a pinch-zoom detection...
The "pan" does not help me, because I don't know when the drag is ended (the finger lifted).

[Albert Chang]

detect*Gestures are suspend functions that will never end. You can just use multiple pointer input modifiers.

[Stefan Oltmann]

Wasn't aware. Thank you! That makes it a bit better.

I feel detectTransformGestures does not go well together with detectDragGestures because now most of my input is recognized as pan, only a bit as drag.

I only wanted a way to detect pinch-to-zoom on Android without the pan, but this does not seem to exist. 🤔

[Albert Chang]

Yeah these two are not intended to be used together. However you can always write your own detect*Gestures function. See this.

[Stefan Oltmann]

Thank you. I will take a look.

[Stefan Oltmann]

This feature is exactly what I'm looking for. Your project should be integrated into Jetpack Compose core. ❤️

[Stefan Oltmann]

At least I'm impressed how difficult that is and that's not yet a standard functionality. ^^

[Stefan Oltmann]

I try to use your lib as you already do everything I need.

[Stefan Oltmann]

Just have to look how I can add this swipe gesture to go to the last/next image.

[Stefan Oltmann]

Ohh nooo... 😞
@Albert Chang It looks like your library is not compatible mit compose-jb ^^

[Albert Chang]

Of course. There is not even touch screen support in compose desktop.

[Stefan Oltmann]

The desktop version of my photo app should use mouse to drag and scroll wheel to zoom in and out. Pinch-to-zoom via Notebook touchpad should also be possible, but that's not available right now in compose-jb ( https://github.com/JetBrains/compose-jb/issues/1953 )

[Stefan Oltmann]

You are right about desktop users with touchpad - these 2-in-1 convertible devices 🤔
I think I will leave that group out for now. 🙈

[Stefan Oltmann]

@Albert Chang I got your framework working on Android. Good job. 👍

It also compiles for compose-jb if I just remove the FloatRange annotations.
So it's not that incompatible.

But of course scroll wheel is not supported. I'm looking into if I can add that without breaking things.

Do you plan to improve on the white borders that occur if you scroll in all the way into an image that does not fit the aspect ratio of the screen? Google Photos doesn't allow to pan into that area. I can try do describe it better and open a issue for it on GitHub if you wish. 🙂

[Albert Chang]

If you follow the sample code, that shouldn’t happen.

[Stefan Oltmann]

Thank you! 🙂

Yes, the Modifier.aspectRatio(size.width / size.height).fillMaxSize() is important to ensure it works correctly (for me).

Very nice work! ❤️
On Android at least I got now what I wanted. ✅

[Stefan Oltmann]

@Albert Chang Works now on Desktop, too - if I count out the pinch-to-zoom gesture on Notebooks which seems to be unsupported in general.

As said I only needed to remove the FloatRange annotations, which are not available to compose-jb. I replaced fastAny and fastForEach with the normal versions - but I learned that including implementation(compose("org.jetbrains.compose.ui:ui-util")) would make that available also.

I did not need to make any changes to your code for scrollwheel support thanks to the exposed state:

val scope = rememberCoroutineScope()
val zoomableState = rememberZoomableState()

Zoomable(
    state = zoomableState,
    onTap = {

        if (!photoState.photoEditMode)
            store.dispatch(PhotoAction.ToggleFullScreen)
    },
    modifier = Modifier
        .weight(1.0f)
        .onMouseScrollEvent { distance ->

            scope.launch {

                zoomableState.animateScaleTo(
                    zoomableState.scale - distance
                )
            }
        }
) {
  // my Image composable
}

common:

expect fun Modifier.onMouseScrollEvent(
    onScroll: (Float) -> Unit
): Modifier

desktop:

@OptIn(ExperimentalComposeUiApi::class)
@Suppress("kotlin:S1172")
actual fun Modifier.onMouseScrollEvent(
    onScroll: (Float) -> Unit
): Modifier = Modifier.onPointerEvent(PointerEventType.Scroll) {
    onScroll(this.currentEvent.changes.first().scrollDelta.y)
}

android:

@Suppress("kotlin:S1172")
actual fun Modifier.onMouseScrollEvent(
    onScroll: (Float) -> Unit
): Modifier = this

So my question is: How important is the FloatRange annotation here and could it be replaced with something else?

If you could get rid of it the library would be fully compatible with compose-jb and be usable on desktop. Click, double-click and panning are working out of the box.

[Albert Chang]

Not important actually. It's just used to indicate the range of the property value.
By "fully compatible" do you mean you can directly use the published artifact from maven central or you have to copy the code?

[Stefan Oltmann]

I mean other than FloatRange and the fast* methods you used nothing that isn't available on compose-jb and I can fully use the feature with the mouse (after adding my onMouseScrollEvent() from the outside).

I had to copy the code (to removed FloatRange usage).

But I see a way where you could make it with little effort work for Android and compose-jb. And actually I would prefer to use it as a dependency from maven instead of copying those two classes.

Just wanted that you know that you could extend the use of your library.

[Albert Chang]

Yeah I can easily remove FloatRange but I just wonder if it's possible to use aar dependency in common code.

[Albert Chang]

If it's not possible I may see if I can make it possible.

[Stefan Oltmann]

Oh, you are right - you must provide it as JAR.

[Stefan Oltmann]

Maybe you can provide both?

[Albert Chang]

Filed an issue. Will look into it when I have time.

[Stefan Oltmann]

Awesome. ❤️👍

[Stefan Oltmann]

And thank you a lot for your help. The Android & Windows part is done. ✅
Now I need to search a lib that solved the same for iOS & macOS.

[Albert Chang]

I published a snapshot build (1.5.0-mp-SNAPSHOT) of the multiplatform version. Could you please try it and check if it works in both desktop and android modules?
You can find how to use snapshot builds in the README.

[Stefan Oltmann]

Just tested it. It works great. 👍✅🚀