5

最近、WPFでいくつかの作業を開始し、マップをアプリケーションに統合するというアイデアを思いつきました。私はグーグルマップでいくつかのことを試しましたが、機能はそれほど素晴らしいものではないので、しばらくして私はWPFのグーグルマップをあきらめました。

しばらくして、BingMapsに出くわしました。これは、WPFで使用するGoogleマップよりもはるかに有望に見えました。私はBingのマップをいじり始めましたが、機能は素晴らしいです！

しかし、画鋲を地図に配置しようとすると、画鋲にカーソルを合わせたときに、情報ボックスを画鋲に追加する方法がすぐにはわかりませんでした。その方法の例をいくつか見つけましたが、xamlにリンクされた手続き型コードが必要でした。私は実際に手続き型コードを使用せずにメソッドを探していました。

xamlだけで情報ボックスを画鋲に追加することは可能ですか？または、誰かがそうする方法について良い代替方法を持っていますか？

利用可能なツールチッププロパティがありますが、私は実際にはそれを探していませんでした。私は実際にGoogleマップのプッシュピンのようなスタイルを探していました（利用可能な場合）。

4

1 に答える 1

8

私があなたの望むものを正しく理解していると仮定すると、簡単な答えは次のとおりです。申し訳ありませんが、XAMLだけでGoogleマップスタイルの情報ボックスを画鋲に追加することはできません。ただし、できる限りお手伝いさせていただきます。

免責事項：私はSilverlightのBing Mapsコントロールで遊んでいるので、これがWPFバージョンのコントロールにも適用できることを願っています。

組み込みのツールチップを使用したくないのは、見た目を変えたい（つまり、テキスト付きの黄色いボックスだけではない）ため、またはユーザーがマウスを離したときにツールチップが消えないようにするためだと思います。

見た目を変えたいだけなら、以下をご用意します。画鋲のテンプレートを指定したときは、先に進み、再テンプレート化されたツールチップを使用して、ユーザーが画鋲をクリックして詳細情報を取得できるようにしました。

カスタムツールチップを使用したBingMap

StaticResourceとして定義されたToolTipテンプレートは次のとおりです。もちろん、必要なものをすべて含めることができます。

<Style x:Key="MyToolTipStyle" TargetType="ToolTip">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate>
                <Border CornerRadius="5" BorderBrush="Black" BorderThickness="2" Background="#5c87b2">
                    <ContentPresenter Margin="5">
                        <ContentPresenter.Content>
                            <StackPanel Margin="5" MaxWidth="400">
                                <TextBlock Text="{Binding Name}" FontWeight="Bold" FontSize="16" Foreground="White" TextWrapping="Wrap"/>
                                <TextBlock Text="{Binding Description}" Foreground="White" TextWrapping="Wrap"/>
                            </StackPanel>
                        </ContentPresenter.Content>
                    </ContentPresenter>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

そして、これが私がそれを使用した場所です：

<maps:Map>
    <maps:MapItemsControl ItemsSource="{Binding SearchResultsManager.Items}">
        <maps:MapItemsControl.ItemTemplate>
            <DataTemplate>
                <maps:Pushpin Location="{Binding Location}" Cursor="Hand" MouseLeftButtonUp="Pushpin_MouseLeftButtonUp">
                    <ToolTipService.ToolTip>
                        <ToolTip Style="{StaticResource MyToolTipStyle}" />
                    </ToolTipService.ToolTip>
                </maps:Pushpin>
            </DataTemplate>
        </maps:MapItemsControl.ItemTemplate>
    </maps:MapItemsControl>
</maps:Map>

次に、ユーザーが画鋲をクリックして詳細領域に移動したときに処理します。

private void Pushpin_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    // Get a reference to the object that was clicked.
    var clickedSearchResult = (sender as FrameworkElement).DataContext as SearchResultViewModel;

    // Do something with it.
}

ただし、ユーザーがツールチップ内のコントロールをクリックできるように、ツールチップが消えないようにする必要があると思います。残念ながら、それを行う簡単な方法があるかどうかはわかりません。独自のカスタムコントロールを定義する必要がある場合がありますが、もちろん、C＃/VBコードが必要になります。

おそらく、この新しいコントロールは画鋲から派生する可能性があり、マウスオーバーやクリックで情報ボックスのコンテンツを表示する可能性があります。VisualStateManagerを使用して、ほとんどのコードをXAMLに保持できます。C＃/ VBは、コンテンツの依存関係プロパティと、正しい時間に視覚的な状態間を遷移するためのいくつかのオーバーライドを提供する必要があります。

それが少なくとも少し役立つことを願っています！

于 2011-09-27T02:38:02.397 に答える