Xamarin.Forms.Maps pins with expanded message window

Question

I'm using Xamarin.Forms.Map and I want to show pins on my map with already expanded window message(without click on them). Something like screenshot. By default window message show only after I clicked on them. How can I do this?

Answer 1

I did a test based on this sample：sample

The thing I do is override the GetViewForAnnotation method. I add a subview and set it's position based on pin's position.

Here is relative code:

[assembly:ExportRenderer(typeof(CustomMap),typeof(CustomMapRenderer))]
namespace My_Forms_Test3.iOS
{
    public class CustomMapRenderer:MapRenderer
    {
        UIView customPinView;
        List<CustomPin> customPins;
        protected override void OnElementChanged(ElementChangedEventArgs<View> e)
        {
            base.OnElementChanged(e);
            if (e.OldElement != null)
            {
                var nativeMap = Control as MKMapView;
                nativeMap.GetViewForAnnotation = null;
                nativeMap.CalloutAccessoryControlTapped -= OnCallourAccessoryControlTapped;
                nativeMap.DidSelectAnnotationView -= OnDidSelect;
                nativeMap.DidDeselectAnnotationView -= OnDidDeSelect;
            }
            if (e.NewElement != null)
            {
                var formsMap = (CustomMap)e.NewElement;
                var nativeMap = Control as MKMapView;
                customPins = formsMap.CustomPins;
                nativeMap.GetViewForAnnotation = GetViewForAnnotation;
                nativeMap.CalloutAccessoryControlTapped += OnCallourAccessoryControlTapped;
                nativeMap.DidSelectAnnotationView += OnDidSelect;
                nativeMap.DidDeselectAnnotationView += OnDidDeSelect;

            }

        }

        private void OnDidDeSelect(object sender, MKAnnotationViewEventArgs e)
        {
            if (!e.View.Selected)
            {
                customPinView.RemoveFromSuperview();
                customPinView.Dispose();
                customPinView = null;

            }
           

        }

        private void OnDidSelect(object sender, MKAnnotationViewEventArgs e)
        {

            throw new NotImplementedException();
        }

        private void OnCallourAccessoryControlTapped(object sender, MKMapViewAccessoryTappedEventArgs e)
        {
            throw new NotImplementedException();
        }

        protected override MKAnnotationView GetViewForAnnotation(MKMapView mapView, IMKAnnotation annotation)
        {
         
            MKAnnotationView annotationView = null;
        
            if (annotation is MKUserLocation)
                return null;
            var customPin = GetCustomPin(annotation as MKPointAnnotation);
            if (customPin == null)
            {
                throw new Exception("not found");
            }
            annotationView = mapView.DequeueReusableAnnotation(customPin.Name);
            if (annotationView == null)
            {
                annotationView = new CustomMKAnnotationView(annotation, customPin.Name);
                annotationView.Image = UIImage.FromFile("pin.png");
       
                annotationView.CalloutOffset = new CGPoint(0, 0);
                annotationView.LeftCalloutAccessoryView = new UIImageView(UIImage.FromFile("monkey.png"));
                annotationView.RightCalloutAccessoryView = UIButton.FromType(UIButtonType.DetailDisclosure);
              
                ((CustomMKAnnotationView)annotationView).Name = customPin.Name;
                customPinView = new UIView();
                var Label = new UILabel();
                Label.Text = "Samsung";
                Label.Frame=new CGRect(annotationView.GetFrame().X+35,annotationView.GetFrame().Y,100,50);
                var Label2 = new UILabel();
                Label2.Text = "20:20";
                Label2.Frame = new CGRect(annotationView.GetFrame().X + 35, annotationView.GetFrame().Y+20, 100, 50);
                customPinView.Frame= new CGRect(annotationView.GetFrame().X+40, annotationView.GetFrame().Y-20, 100, 50);
                customPinView.AddSubview(Label);
                customPinView.AddSubview(Label2);
                Label.BaselineAdjustment = UIBaselineAdjustment.AlignBaselines;
                customPinView.BackgroundColor = UIColor.White;
                customPinView.Layer.CornerRadius = 5;
                customPinView.Alpha = (nfloat)0.8;
                customPinView.Layer.MasksToBounds = true;
                annotationView.AddSubview(customPinView);
            }
            annotationView.CanShowCallout = true;
         
            return annotationView;

        }

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

        }}

result：