Bind constructor arguments to Xamarin.Forms' GoogleMaps

Question

I develop simple Xamarin.Forms application with GoogleMaps using MVVMCross. My goal is to center maps' position to user's current location while launching it. Unfortunately I don't know how to bind these values to GoogleMaps' constructor. Right now it's just static value but I want to pass values of latitude and longitude from CurrentLocation object (which has these properties).

View:

Here's part of my ViewModel:

public class NearbyBollardsMapViewModel : MvxViewModel
{
    private Location _currentLocation;

    public Location CurrentLocation
    {
        get => _currentLocation;
        set
        {
            _currentLocation = value;
            RaisePropertyChanged(() => CurrentLocation);
        }
    }

    public NearbyBollardsMapViewModel(ILocationService locationService)
    {
        this._locationService = locationService;
        CurrentLocation = _locationService.GetCurrentUsersLocation().Result;
    }
}

user_8182493 · Answer

You need to create a PCL class that extends from Maps and add a BindableProperty to it.

1º - Create a class and extend it from Xamarin.Forms.Maps.Map

(I included the code for the Bindable Property, you can read more Here)

public class BindableMap : Xamarin.Forms.Maps.Map
{
    public BindableMap()
    {

    }

    public MapSpan MapSpan
    {
        get { return (MapSpan)GetValue(MapSpanProperty); }
        set { SetValue(MapSpanProperty, value); }
    }

    public static readonly BindableProperty MapSpanProperty = BindableProperty.Create(
                                                     propertyName: "MapSpan",
                                                     returnType: typeof(MapSpan),
                                                     declaringType: typeof(BindableMap),
                                                     defaultValue: null,
                                                     defaultBindingMode: BindingMode.TwoWay,
                                                     validateValue: null,
                                                     propertyChanged: MapSpanPropertyChanged);

    private static void MapSpanPropertyChanged(BindableObject bindable, object oldValue, object newValue)
    {
        try
        {
            var thisInstance = bindable as BindableMap;
            var newMapSpan = newValue as MapSpan;

            thisInstance?.MoveToRegion(newMapSpan);
        }
        catch (Exception ex)
        {

        }
    }
    
}

2º - Add the property that will be used for binding the MapSpan in the ViewModel

private MapSpan _mapSpanView;
public MapSpan MapSpanView
{
    get { return _mapSpanView; }
    set { SetProperty(ref _mapSpanView, value); }
}

...

Position position = new Position((double)Latitude, (double)Longitude);
MapSpanView = MapSpan.FromCenterAndRadius(
                            prospectPosition,
                            Distance.FromMeters(2500)
                        );

3º - And then Bind it in the xaml

xmlns:map="clr-namespace:YourNameSpace.Mobile.TheFolderWhereTheClassIs"

...

Bind constructor arguments to Xamarin.Forms' GoogleMaps

1 Answers

1º - Create a class and extend it from Xamarin.Forms.Maps.Map

2º - Add the property that will be used for binding the MapSpan in the ViewModel

3º - And then Bind it in the xaml