Question

I am porting an iPhone app to WP7 which contains a map with several markers/pushpins that I get from a webservice (location, icon and title).

I have setup the XAML required to display the map as well as some code for the pushpin:

<phone:PhoneApplicationPage.Resources>
    <ControlTemplate x:Key="customPushpin" TargetType="my:Pushpin">
        <Image Height="39" Source="Resources/Icons/Pushpins/pinGreen.png" Stretch="Fill" Width="32"/>
    </ControlTemplate>
</phone:PhoneApplicationPage.Resources>

<Grid x:Name="LayoutRoot" Background="Transparent">
    <my:Map Height="Auto" HorizontalAlignment="Stretch" Margin="0" x:Name="Map"
            VerticalAlignment="Stretch" Width="Auto" CredentialsProvider="{Binding CredentialsProvider}" 
            CopyrightVisibility="Collapsed" LogoVisibility="Collapsed" Center="{Binding Mode=TwoWay, Path=Center}" 
            ZoomBarVisibility="Visible" 
            ZoomLevel="{Binding Zoom, Mode=TwoWay}">
        <my:MapItemsControl ItemsSource="{Binding Pushpins}">
            <my:MapItemsControl.ItemTemplate>
                <DataTemplate>
                    <my:Pushpin MouseLeftButtonUp="Pushpin_MouseLeftButtonUp" 
                                Location="{Binding Location}" 
                                Template="{StaticResource customPushpin}">                           
                    </my:Pushpin>
                </DataTemplate>
            </my:MapItemsControl.ItemTemplate>
        </my:MapItemsControl>
    </my:Map>        
</Grid>

I am looking for a way to add some sort of bubble when the user clicks on the pushpin. I have looked a bit into infoboxes/tooltips but since they work on hover, that’s not something I can use for the phone (tap/click).

I am guessing there’s no similar control in WP7 that creates a bubble – how could I go about creating something similar?

Thanks in advance,

Alex

Answer 1

You could simply put a square Border inside LayoutRoot with Visibility=”Collapsed”, then when you click your pushpin you update its content and make it visible.

Just make sure to put it after your map control (otherwise it will be rendered behind the map and will consequently be invisible).