Feature/screen coordinate map moving

[g4rb4g3]

Description

Added new scaleBy and moveBy functions to the camera that allow easy camera interactions when using CarPlay or Android Auto.
When doing gestures on these the system blocks forwarding the gestures to the map view and just allows you to register listeners that receive screen coordinates. To allow these gestures to be applied easily to the map view the camera got these 2 functions that can handle the values the listeners receive.
I also aligned the CamerMode so iOS and Android use the same values now.

Checklist

Since our app doesn't use New Architecture yet I skipped the New Architecture tests in the example app but made sure everything works out just fine with our app.

• I've read CONTRIBUTING.md
• I updated the doc/other generated code with running yarn generate in the root folder
• I have tested the new feature on /example app.
  • In V11 mode/ios
  • In New Architecture mode/ios
  • In V11 mode/android
  • In New Architecture mode/android
• I added/updated a sample - if a new feature was implemented (/example)

Screenshot OR Video

Bildschirmaufnahme.2025-05-15.um.15.12.00.mov

[g4rb4g3]

Demo off the Android Auto implementation, running on the DHU and a debug build it isn't perfectly smooth but it gives an impression on how it works. Pinch, pan and double tap working fine.

Bildschirmaufnahme.2025-05-23.um.08.31.56.mp4

[mfazekas]

@g4rb4g3 thanks much for this contribution.

Question, I see that on android we use different method moveBy and scaleBy, for camera manipulation. Can't we use the same thing on android and iOS? I mean camera.easeTo on android and camera.ease on iOS?

https://docs.mapbox.com/android/maps/api/11.12.2/mapbox-maps-android/com.mapbox.maps.plugin.animation/ease-to.html
https://docs.mapbox.com/ios/maps/api/11.12.2/documentation/mapboxmaps/cameraanimationsmanager/ease(to:duration:curve:completion:)

[g4rb4g3]

Great find @mfazekas thanks! I started with scaleBy that was missing on iOS so I expected moveTo to be missing to. I'll double check it tomorrow and update the PR.

[g4rb4g3]

@mfazekas I had only a brief look at your comment in the morning on my phone so I checked this now and tried to remember what I did 2 weeks ago. ;)

So one thing to not use ease(to:) on iOS is that when you get pan or pinch events you do not want an animation since you get a whole bunch of events per second. You need to call setCamera then to get a good user experience otherwise events are dropped and it doesn't work out well. When you give it a duration it will use ease(to:) on iOS since mapbox lacks scaleBy and moveBy on that platform.

On Android it is a different story, mapbox has these nice scaleBy and moveBy functions out of the box that work amazingly well. No need to calculate anything like a new center point or anything, just give it the screen x & y and it figures out what to do. This makes it easy to maintain too on the long run. If you check out the Android code these are almost single liners. 😄

To still provide the same API I decided to align everything for Android and iOS so both provide the same functions and accept the same parameters and work the same way in the end even though the internal functions that are used on mapbox are not exactly the same (since the platform implementation does not provide the exact same functions).

I think the main thing to keep in mind on these is that you want the x and y screen coordinates you get from Android Auto or CarPlay as fast as possible applied on the map and this seems to be the best way to achieve it.

[mfazekas]

@g4rb4g3 so essentially this PR essentially exposes the android moveBy and scaleBy functions, right?

[g4rb4g3]

@g4rb4g3 so essentially this PR essentially exposes the android moveBy and scaleBy functions, right?

exactly, and it provides same functionality for iOS event though it uses some other implementation behind the scenes since iOS mapbox does not provide the same functions. But for react-native devs it looks the same and behaves the same.