mapbox
[HELP]: Want to create a custom resume button
Mapbox Navigation SDK version
2.9
Steps to reproduce
How would one achieve this? Specifically want to create a custom floating button circular, that works exactly like resume button for UI consistency. Also how do I hide/remove the default resume button?
Expected behavior
any help would be greatly appreciated, still learning swift
Actual behavior
any help would be greatly appreciated, still learning swift
Is this a one-time issue or a repeatable issue?
one-time
You might want to describe your issue better with screenshots or mockups because this is kind of difficult to understand. The Mapbox Team will have a hard time helping you this way.
The resume button is a member of NavigationView. You can hide the button by setting the alpha value to 0 (the button will exist but be 100% transparent).
want to create a custom floating button circular
To clarify, do you want this button to be circular? Creating a custom button would be tricky since this button is part of NavigationView, and it is involved in camera movement; I'm not sure if it is possible. To create a custom button, you could create a UIControl similar to the existing resume button and include a custom camera implementation that will ease the camera back to the user location (and into following mode) when the button is pressed.
https://github.com/mapbox/mapbox-navigation-ios/pull/2763 - I tried following this implementation but got as far as the red box
include a custom camera implementation that will ease the camera back to the user location (and into following mode) when the button is pressed.
What would this code look like?
PS: it's not a pressing issue / just a nice to have UI preference. Want to improve my capabilities in Swift so any guidance will be greatly appreciated in my learning :)
Could you attach a picture of this red box you're seeing? The floatingButtons that were made customizable by #2763 are the overview, mute, and report buttons. The resume button is not included in the stack view, but I guess you could hide the existing resume button and then add your own resume button as part of the stack view that uses the icon.
Now that I've slept on it, this might not be too tricky at all. For the camera, we have documentation about the Navigation Camera here and examples of custom camera behavior available here that can help you understand more about the navigation camera and its behavior. The main thing is that you will need to make sure that when your resume button is tapped, the map is recentered. You can achieve this behavior by adding a target (resume button does so like this).
For showing and hiding the resume button, you can listen to notifications and respond to them in the same way the resume button is shown and hidden (such as in CameraController.navigationCameraStateDidChange(_:)).
Hope this helps!!
How can I Add the target to the resume button, without any access according protection level?
