Windows Phone “Mango”: Mapコントロール上のカスタムピンの作成方法は?
セミナーで受けた質問へのフォローアップです。
Mapコントロール上にプッシュピンを表示できますが、既定のスタイルと異なるピンを配置したい場合は、スタイルを利用します。
サンプルを添付するので参考にしてください。
App.xamlにアプリケーションリソースとして、次のようなテンプレートを作成します。
<Application.Resources>
<Style TargetType="m:Pushpin" x:Key="PushpinStyle">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="m:Pushpin">
<Grid x:Name="ContentGrid" Width="34" Height="34" >
<StackPanel Orientation="Vertical" >
<Grid MinHeight="31" MinWidth="29" Margin="0">
<Ellipse Fill="#FFFF7F00"
Margin="1"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Width="30"
Height="30"
Stroke="White"
StrokeThickness="3"/>
<ContentPresenter HorizontalAlignment="Center"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
Margin="4"/>
</Grid>
</StackPanel>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Background" Value="Black" />
<Setter Property="Foreground" Value="White" />
<Setter Property="FontSize" Value="18" />
</Style>
</Application.Resources>
ロケーションが更新されたタイミングなどで、ピンを配置します。
void watcher_PositionChanged(object sender, GeoPositionChangedEventArgs<GeoCoordinate> e)
{
map1.SetView( e.Position.Location , slider.Value);
Pushpin p = new Pushpin();
p.Location = e.Position.Location;
p.Content = (counter++).ToString();
p.Style = (Style)(Application.Current.Resources['PushpinStyle"]);
map1.Children.Add(p);
}