Xamarin.forms.googlemaps: Pin Icon BitmapDescriptorFactory.FromView does not work all time

[brunoracosta]

I am using this custom icon in all my calls, but sometime the icon does not show and not throw any exception.

PIN

pinPosicao = new Pin
{
  Type = PinType.Place,
  Position = position,
  Label = item.StringDataEvento,
  Icon = BitmapDescriptorFactory.FromView(new BindingPinView("", "pin_red.png"))
};
_mapa.Pins.Add(pinPosicao);

VIEW

XAML

<?xml version="1.0" encoding="UTF-8"?>
<StackLayout xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
             WidthRequest="37" 
             HeightRequest="48"
             AnchorX="0.5"
             AnchorY="0.8"
             x:Class="Views.Component.BindingPinView">
    <AbsoluteLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">

        <Image Source="{Binding ImageSource}" 
            AbsoluteLayout.LayoutBounds="0, 0, 37, 48"
            AbsoluteLayout.LayoutFlags="None" />

    </AbsoluteLayout>
</StackLayout>

CS

using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace Views.Component
{
    public partial class BindingPinView : StackLayout
    {
        private string _display;
        private string _imageSource;

        public BindingPinView(string display, string image)
        {
            InitializeComponent();
            _display = display;
            _imageSource = image;
            BindingContext = this;
        }

        public string Display
        {
            get { return _display; }
        }

        public string ImageSource
        {
            get { return _imageSource; }
        }

    }
}

I tried to copy the example, but something does not work.

[Waldfrucht90]

I can confirm this annoying behavior, it happens only on Android (no problem on iOS):
With FromView(...), some subviews (images) are loaded, others not. The text always works.
It is not related to the images itself, it happens randomly:
load page: markers 3 & 4 of 10 have no image, rest work
reload page: now markers 1, 4, 7 have no image
reload again: now only marker 9 has no image
etc.

It is exactly like in this closed issue (see screenshot): https://github.com/amay077/Xamarin.Forms.GoogleMaps/issues/114
This was NOT fixed. The user closed it because he found a workaround with "fromSource", but for my map I need markers with custom images and dynamic text, so that is not an option.

I tried putting every section of the related code to the main/ui-thread and also to create the markers with delay (after InitializeComponent(), even after OnAppearing() - nothing works.

Note: it may be related to some Android-specific internal change to how the image is loaded to the marker and then there is no callback to redraw the marker if it takes too long or something, at least that is a theory I read here:
https://github.com/airbnb/react-native-maps/issues/100
Those people seem to have the same problem and they posted many "hacks" to fix it, but I am not experienced enough to do it in xamarin forms, I believe amay007 has to implement a fix in the android-specific code of the nuget.

I would literally pay money to get this fixed reliably :)

[fareleek]

_pin.Icon = BitmapDescriptorFactory.FromView(
    new ContentView { 
        WidthRequest=100, 
        HeightRequest=100, 
        Content = new Image { 
            Source = ImageSource.FromUri(someHttpUri)) 
        }
     }
);

I want to change PinView (include image fromUri)
But this does not work at first.
But it works from the second. (because cached image)
(in iOS)

[cbagpipe]

can confirm this. It happens sometimes on map initialization, when new View with map created, or - more rare - when switching between apps or pages, and map reinitializes.

[ta-yamaoka]

BitmapDescriptorFactory.FromView
Where I tried.
ImageSource.FromResource dose not worked(both Android and iOS).
ImageSource.FromFile worked(Android). iOS not confirmed.

BitmapDescriptorFactory.FromStream worked on both Android and iOS.
There was a problem of #40(Why custom pin icon in iOS bigger than Android?) on iOS, but a modified version (2.3.0) was released on 2018/1/23, and confirmed that it works.

[JJarvis89]

I found that when using the FFImageLoading plugin, using ImageService.Instance.LoadCompiledResource("your_image_here.png").Preload(); before you load the pins, fixes this issue that sometimes images are not loaded. I hope this helps others with this issue.

[MisterJimson]

@amay077 I am still seeing BitmapDescriptorFactory.FromView only work sometimes.

[stefancvetkovic]

Can anybody tell me what I need to do, in order to shrink my pin? Now is too large.
I am using Icon = BitmapDescriptorFactory.FromBundle("locations_pin.png")
And my loications.pin image is under Assets folder

[ghost]

Can anybody tell me what I need to do, in order to shrink my pin? Now is too large.
I am using Icon = BitmapDescriptorFactory.FromBundle("locations_pin.png")
And my loications.pin image is under Assets folder

have you got it beacuse im also facing same issue

[mateuswolkmer]

Can anybody tell me what I need to do, in order to shrink my pin? Now is too large.
I am using Icon = BitmapDescriptorFactory.FromBundle("locations_pin.png")
And my loications.pin image is under Assets folder

Also facing the same issue in iOS. Seems to be related to #40 that was closed claiming it was fixed, but the custom pin in iOS is still around 5x bigger than in Android (created using BitmapDescriptorFactory.FromBundle()), and also the same size bigger than the pins created with BitmapDescriptorFactory.DefaultMarker().

[hobbykitjr]

Same here, years after they closed it with latest stable version., icon too large on iOS, has to do w/ map api v3 which has a size setting, but i don't see how to specify in this code

[woemike]

Can anybody tell me what I need to do, in order to shrink my pin? Now is too large.
I am using Icon = BitmapDescriptorFactory.FromBundle("locations_pin.png")
And my loications.pin image is under Assets folder

I have the same issue

[johnn82]

IDK if everybody is suffering the same issue but this could be the reason?

"Wait for a GoogleMap to become available from a MapFragment or MapView that you have added to your application. You can obtain the GoogleMap instance by calling getMapAsync() and waiting for the onMapReady(GoogleMap map) callback."

ref: https://developers.google.com/android/reference/com/google/android/gms/maps/model/BitmapDescriptorFactory

[linda-dge]

I have the same issue.