如何在悬停时显示 bing 地图图钉的工具提示？答案

【问题标题】：How to show tooltip for bing maps pushpins on hover?如何在悬停时显示 bing 地图图钉的工具提示？
【发布时间】：2013-08-10 12:39:11
【问题描述】：

我正在使用必应地图，但在显示工具提示时遇到了一些问题。

我有我的 PushPin 模型，所以我可以绑定到它：

public class PushpinModel : DependencyObject, INotifyPropertyChanged
{
    private double _latitude;
    private double _longitude;
    private string _description;
    private string _title;

    public double Latitude
    {
        get
        {
            return _latitude;
        }
        set
        {
            if (_latitude != value)
            {
                _latitude = value;
                NotifyPropertyChanged("Latitude");
            }
        }
    }

    public double Longitude
    {
        get
        {
            return _longitude;
        }
        set
        {
            if (_longitude != value)
            {
                _longitude = value;
                NotifyPropertyChanged("Longitude");
            }
        }
    }

    public string Description
    {
        get
        {
            return _description;
        }
        set
        {
            if (_description != value)
            {
                _description = value;
                NotifyPropertyChanged("Description");
            }
        }
    }

    public string Title
    {
        get
        {
            return _title;
        }
        set
        {
            if (_title != value)
            {
                _title = value;
                NotifyPropertyChanged("Title");
            }
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    private void NotifyPropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

我有 PushPinViewModel（我的愿望是用 MVVM 做所有事情，但现在我不使用命令，所以我把它写在后面的代码中）。

私有 ObservableCollection _pushpins = new ObservableCollection();

    public ObservableCollection<PushpinModel> Pushpins
    {
        get
        {
            return _pushpins;
        }
    }

在主页：

public sealed partial class MainPage : Page
{
    PushpinViewModel pvm;

    public MainPage()
    {
        this.InitializeComponent();

        pvm = new PushpinViewModel();
        map.DataContext = pvm;
    }
...

在 XAML 中：

<Page.Resources>
    <Style TargetType="ToolTip">
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="BorderBrush" Value="Transparent" />
        <Setter Property="BorderThickness" Value="0" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>
                    <Border CornerRadius="5">
                        <Border.Background>
                            <SolidColorBrush Color="Black" Opacity="0.5"/>
                        </Border.Background>
                        <ContentPresenter Margin="5">
                            <ContentPresenter.Content>
                                <StackPanel Margin="5" MaxWidth="200">
                                    <TextBlock Text="{Binding Title}" FontWeight="Bold" FontSize="16" Foreground="White"/>
                                    <TextBlock Text="{Binding Description}" Foreground="White" TextWrapping="Wrap"/>
                                </StackPanel>
                            </ContentPresenter.Content>
                        </ContentPresenter>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Page.Resources>

有更多代码，例如绑定到位置（工作正常）。但是点击工具提示的问题。

    private void Pushpin_Tap(object sender, TappedRoutedEventArgs e)
    {
        //Just hard coded for testing
        PushpinModel tooltipPin = new PushpinModel();
        tooltipPin.Latitude = 26.820553;
        tooltipPin.Longitude = 30.802498000000014;
        tooltipPin.Title = "Pin 2";
        tooltipPin.Description = "This is an example of a custom infobox that is created using a tooltip and a user control.";

        pvm.AddPushpin(tooltipPin);

        ToolTipService.SetToolTip(tooltipPin, new ToolTip()
        {
            //What to do here?
            //DataContext = tooltipPin
        });
    }

此代码创建图钉并将其放在地图上，但没有显示工具提示，有人可以帮我吗？

非常感谢！！！

【问题讨论】：

标签： c# windows-store-apps winrt-xaml bing-maps pushpin

【解决方案1】：

您需要不在 PushpinModel 上设置 ToolTipService.ToolTip 属性，而是在应该是 UIElement 的 PushpinViewModel 上设置。 ToolTips 必须连接到 UIElement，它实际呈现在您的可视化树中，由鼠标悬停触发。

例如，以下代码有效，因为 Pushpin 类派生自 UIElement（DependencyObject --> UIElement --> FrameworkElement --> Control --> Pushpin）。

Pushpin pin = new Pushpin();
pin.Text = "Pin";
ToolTipService.SetToolTip(pin, "Sweet tooltip!!");
MapLayer.SetPosition(pin, loc);
MyMap.Children.Add(pin);

【讨论】：

【解决方案2】：

设置 DataContext = tooltipPin 看起来是正确的。尝试为您的工具提示样式添加一个键并将其传递到新工具提示的样式属性中。

【讨论】：

是的，我以前做过，但没有帮助，我觉得没有钥匙更好，所以更容易接受（我所有的工具都想要这种风格）

【解决方案3】：

我已经解决了，这比我想象的要简单，而不是在后面的代码中添加一个工具提示，我应该像这样将它添加到图钉模板中：

<ToolTipService.ToolTip>
    <ToolTip Style="{StaticResource ToolTipStyle}">
        <StackPanel Orientation="Vertical">
            <TextBlock Text="{Binding Title}" />
            <TextBlock Text="{Binding Description}" TextWrapping="Wrap" />
        </StackPanel>
    </ToolTip>
</ToolTipService.ToolTip>

【讨论】：