Xamarin: Navigate from MapRenderer Class to ContentPage

Question

I am facing the following issue.

I am developing a Cross Platform Project on Xamarin and I am trying to open a ContentPage from a MapInfoWindow. The Map ContentPage is inside the Portable Project and inside the Droid Project I have a the following class that is where I am trying to open the ContenPage:

public class CustomMapRenderer: MapRenderer, GoogleMap.IInfoWindowAdapter, IOnMapReadyCallback
{
    GoogleMap map;
    List<CustomPin> customPins;
    bool isDrawn;

    protected override void OnElementChanged(Xamarin.Forms.Platform.Android.ElementChangedEventArgs<Map> e)
    {
        base.OnElementChanged(e);

        if (e.OldElement != null)
        {
            map.InfoWindowClick -= OnInfoWindowClick;
        }

        if (e.NewElement != null)
        {
            var formsMap = (CustomMap)e.NewElement;
            customPins = formsMap.CustomPins;
            ((MapView)Control).GetMapAsync(this);
        }
    }

    public void OnMapReady(GoogleMap googleMap)
    {
        map = googleMap;
        map.InfoWindowClick += OnInfoWindowClick;
        map.SetInfoWindowAdapter(this);
    }

    protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        base.OnElementPropertyChanged(sender, e);

        if (e.PropertyName.Equals("VisibleRegion") && !isDrawn)
        {
            map.Clear();
            if (customPins != null)
            {
                foreach (var pin in customPins)
                {
                    var marker = new MarkerOptions();
                    marker.SetPosition(new LatLng(pin.Pin.Position.Latitude, pin.Pin.Position.Longitude));
                    marker.SetTitle(pin.Pin.Label);
                    marker.SetSnippet(pin.Pin.Address);
                    marker.SetIcon(BitmapDescriptorFactory.FromResource(Resource.Drawable.pin));

                    map.AddMarker(marker);
                }
                isDrawn = true;
            }
        }
    }

    protected override void OnLayout(bool changed, int l, int t, int r, int b)
    {
        base.OnLayout(changed, l, t, r, b);

        if (changed)
        {
            isDrawn = false;
        }
    }

    void OnInfoWindowClick(object sender, GoogleMap.InfoWindowClickEventArgs e)
    {
        var customPin = GetCustomPin(e.Marker);
        if (customPin == null)
        {
            throw new Exception("Custom pin not found");
        }
         //Here I want to open the content page



    }

    public Android.Views.View GetInfoContents(Marker marker)
    {
        var inflater = Android.App.Application.Context.GetSystemService(Context.LayoutInflaterService) as Android.Views.LayoutInflater;
        if (inflater != null)
        {
            Android.Views.View view;

            var customPin = GetCustomPin(marker);
            if (customPin == null)
            {
                throw new Exception("Custom pin not found");
            }

            if (customPin.Id == "Xamarin")
            {
                view = inflater.Inflate(Resource.Layout.XamarinMapInfoWindow, null);
            }
            else
            {
                view = inflater.Inflate(Resource.Layout.MapInfoWindow, null);
            }

            var infoTitle = view.FindViewById<TextView>(Resource.Id.InfoWindowTitle);
            var infoSubtitle = view.FindViewById<TextView>(Resource.Id.InfoWindowSubtitle);

            if (infoTitle != null)
            {
                infoTitle.Text = marker.Title;
            }
            if (infoSubtitle != null)
            {
                infoSubtitle.Text = marker.Snippet;
            }

            return view;
        }
        return null;
    }

    public Android.Views.View GetInfoWindow(Marker marker)
    {
        return null;
    }

    CustomPin GetCustomPin(Marker annotation)
    {
        var position = new Position(annotation.Position.Latitude, annotation.Position.Longitude);
        foreach (var pin in customPins)
        {
            if (pin.Pin.Position == position)
            {
                return pin;
            }
        }
        return null;
    }
}

Answer 1

So I believe creating an EventHandler in your CustomMap class might be the way to go. In your CustomMap class, add the following:

public event EventHandler InfoTapped;
public virtual void OnInfoTapped(EventArgs e)
{
    EventHandler handler = InfoTapped;
    if (handler != null)
    {
      handler(this, e);
    }
}

Then in your Forms shared code subscribe to the InfoTapped event and push your new ContentPage:

customMap.InfoTapped += async (sender, e) => {
    await Navigation.PushAsync(new ContentPage());
};

Now in your renderer, create a class level field to hold a reference to your CustomMap:

CustomMap formsMap;

And then set this field in your OnElementChanged method:

if (e.NewElement != null)
{
      // Remove the var to set your CustomMap field created
      // above so you can use it elsewhere in the class
      formsMap = (CustomMap)e.NewElement;
      ...
}

Now you can raise the event you created in CustomMap by calling:

formsMap.OnInfoTapped(e);

EG:

void OnInfoWindowClick(object sender, GoogleMap.InfoWindowClickEventArgs e)
{
    var customPin = GetCustomPin(e.Marker);
    if (customPin == null)
    {
        throw new Exception("Custom pin not found");
    }
    //Here I want to open the content page

    formsMap.OnInfoTapped(e);
}

And the code you added to the customMap.InfoTapped event handler will be called, in this case to push a new page.