ImageButton Command behaves different from Button Comman when navigating to a map view in .Net MAUI

[Abdelrahman-kamall]

Description

I am building a simple app using .Net Maui with MVVM architecture . The app shows maps in some views and i used the "Microsoft.Maui.Controls.Maps NuGet package" for interacting with google maps following the official docs "https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/map". i used CommunityToolkit.Maui and CommunityToolkit.Mvvm to help with the mvvm architectrue.

every thing worked fine until i had a simple problem that i kept debugging and trying to resolve for a while and reached nothing. and it was really frustrating because i replicated the code in the same application and it worked fine while the code is almost identical , long story short after a weak i discovered that the problem happens when i use an image button instead of a regular button to navigate to the map view when clicked.

so to replicate the problem i built a simple app where i have a view with only a button and an ImageButton that's when each one is clicked it will navigate to the view with the map , the map will have a map span that should specify the visible region initially in the map. if i clicked the button the map span works fine , if i clicked the ImageButton the map shows and works fine but it is as if there was no map span specified .

this is the repo i used to abstract and replicate the problem "https://github.com/Abdelrahman-kamall/MapSpanAndImageButtonIssue"

these details are in the readme of the repo but i will put it again

• first you have to aquire an api key for google maps as described in the docs "https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/map"and put it in platforms/android/androidmanifest.xml file replace 'the Enter Your APIKEY Here' with your aquired api key , As i should not publish my API Key .

we have 2 views view with the 2 buttons and a view that shows the map

i used 2 different commands for both buttons because if i used the same command for both buttons, then when clicking one button it acts like i clicked both the buttons i know from the click animation on both and then the problem will not arise , however if the button is made invisible the problem will arise again. this is another weird thing that happens

this is the view model of the buttons view

the NavigateToAsync method simply navigates to the map

registration of routes , views , viewmodels, services are all done correctly

and this is the map span specified in the map view

when clicking the button the map shows the correct region specified by the map span

but when clicking the image button the map act like there is no map span

additional info that might help , when using the imagebutton case ,if i have multiple pages when the problem happens if i navigated to another page and then navigated back to the map view directly it will display the correct region

i know this problem is easy to work around by using a button with image source instead of the imagebutton , but i want to know if i am doing any thing wrong or am i missing some thing or misunderstanding any thing , this might help me later on .

or is it just a problem with the image button or a problem with the map i dont know .

it will be great if someone could help .

Steps to Reproduce

1. aquire api key for google maps as mention in the official docs "https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/map
2. put it in platforms/android/androidmanifest.xml file replace 'the Enter Your APIKEY Here' with your aquired api key
3. run the app on android emulator
4. try both buttons and the problem should be reproduced expected to have correct map span shown after clicking the button and wrong map span after clicking the image button.

Link to public reproduction project repository

https://github.com/Abdelrahman-kamall/MapSpanAndImageButtonIssue

Version with bug

7.0.92

Is this a regression from previous behavior?

Not sure, did not test other versions

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

No response

Did you find any workaround?

No response

Relevant log output

No response

[Abdelrahman-kamall]

follow up i tried a different approach to use the MoveToRegion method on the map directly as follows the map view the code behind the viewmodel it still works with the button and doesn't work with the image button

[ghost]

We've added this issue to our backlog, and we will work to address it as time and resources allow. If you have any additional information or questions about this issue, please leave a comment. For additional info about issue management, please read our Triage Process.