5
votes

I am working on a windows 8 app using C# and XAML. The app has a maps page which has custom pushpins. I added the custom pushpin using the following code:

    <Style x:Key="PushPinStyle" TargetType="bm:Pushpin">
        <Setter Property="Width" Value="25"/>
        <Setter Property="Height" Value="39"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>
                    <Image Source="Assets/pushpin_icon.png" Stretch="Uniform" HorizontalAlignment="Left"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>

    </Style>

Once I enable the above code the pushpins don't show up unless the map is moved by user. The following code is used to generate the map. DataTemplate-

    <DataTemplate x:Key="pushpinSelector" >
        <bm:Pushpin Tapped="pushpinTapped" Style="{StaticResource PushPinStyle}">
            <bm:MapLayer.Position >
                <bm:Location Latitude="{Binding Latitude}" Longitude="{Binding Longitude}"/>
            </bm:MapLayer.Position>
        </bm:Pushpin>
    </DataTemplate>

Maps XAML-

            <bm:Map.Children>
                <bm:MapItemsControl Name="pushPinModelsLayer" 
                     ItemsSource="{Binding Results}" 
                     ItemTemplate="{StaticResource pushpinSelector}" />
            </bm:Map.Children>
        </bm:Map>

Once I remove the custom style for the Pushpin the default pushpin show up correctly without needing to move the map. I would like the cutom pushpins show up similarly without needing manually moving the map. Thanks for the solution in advance.

2

2 Answers

1
votes

Have you tried using a custom control for map push pin

Create a control using user control template provided , add necessary components , events , do the customization you need.

Example :

CustomPushPin pushpin = new CustomPushPin(); mapView.Children.Add(pushPin); MapLayer.SetPosition(pushPin, location);

where ,

  1. CustomPushPin your custom pushpin user control.
  2. location is of type class Location.

Let me know if you still face the issue

1
votes

This has been a frustrating one to figure out.

The solution that I ended up with was to create a Wiggle effect whenever I add my pushpins. Whenever I've updated my list of pushpins, I change the MapBounds (through a custom dependancy property).

In this method I pop the map bounds out slightly and then zoom into the desired bounds, like this:

public static LocationRect GetMapBounds(DependencyObject obj)
{
    return (LocationRect)obj.GetValue(MapBoundsProperty);
}

public static void SetMapBounds(DependencyObject obj, LocationRect value)
{
    obj.SetValue(MapBoundsProperty, value);
}

public static readonly DependencyProperty MapBoundsProperty = DependencyProperty.RegisterAttached("MapBounds", typeof(LocationRect), typeof(MapBindings), new PropertyMetadata(null, OnMapBoundsChanged));

private static void OnMapBoundsChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
    var map = d as Bing.Maps.Map;
    if (map != null)
    {
        // sigh.  "Wiggle" the view to force map pins to appear
        LocationRect destRect = e.NewValue as LocationRect;
        if (destRect != null)
        {
            LocationRect wiggleRect = new LocationRect(destRect.Center, destRect.Width + 0.001,
                                                        destRect.Height + 0.001);

            map.SetView(wiggleRect, MapAnimationDuration.None);
            map.SetView(destRect, new TimeSpan(0, 0, 1));
        }
    }
}

This causes the view to move automatically, making the pushpins pop up.

It's a bit of a hack, but at least it works. Plus it has the side effect of popping the view a wee bit to show the user that the view has changed.

Hope that helps.