WP7 图钉工具提示/气泡答案

【问题标题】：WP7 Pushpin tooltip/bubbleWP7 图钉工具提示/气泡
【发布时间】：2010-11-22 14:30:02
【问题描述】：

我正在将一个 iPhone 应用程序移植到 WP7，其中包含我从网络服务（位置、图标和标题）获得的带有多个标记/图钉的地图。

我已经设置了显示地图所需的 XAML 以及图钉的一些代码：

<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>

我正在寻找一种在用户单击图钉时添加某种气泡的方法。我对信息框/工具提示进行了一些研究，但由于它们在悬停时工作，所以我不能在手机上使用（点击/点击）。

我猜在 WP7 中没有类似的控件可以创建一个气泡 - 我怎么能创建类似的东西？

提前致谢，

亚历克斯

【问题讨论】：

标签： windows-phone-7 bing-maps pushpin

【解决方案1】：

您可以简单地在 LayoutRoot 中放置一个方形边框，并设置 Visibility="Collapsed"，然后当您单击图钉时更新其内容并使其可见。

只需确保将其放在您的地图控件之后（否则它将呈现在地图后面并因此不可见）。

【讨论】：

感谢您的回答，我实际上采用了类似的方法。我在屏幕底部放置了一个边框（在 Blend 中有一些奇特的效果），当用户单击带有所述 pin 信息的 pin 时会显示该边框。
我也在找这个。太糟糕了，没有内置的方法可以将它添加到气泡旁边。我很惊讶他们没有保留工具提示并将其基于选项卡而不是鼠标进入/离开。

【解决方案2】：

出于某些性能考虑，实现此目的的最简单方法是在点击时显示/隐藏图钉的内容，而不是 MouseLeftButtonUp。

void pushPin_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
   this.border.Visibility = System.Windows.Visibility.Visible;

    //stop the event from going to the parent map control
    e.Handled = true;
}

private void map_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
   this.border.Visibility = System.Windows.Visibility.Collapsed;   
}

【讨论】：

【解决方案3】：

您可以创建一个自定义弹出窗口。

解释如何执行此操作的精彩视频位于 here。

【讨论】：

【解决方案4】：

其他解决方案是使用适用于 Windows Phone 的 Silverlight 工具包中的 ContextMenu！只需转到 CodePlex 上的 Coding4Fun 页面并下载它（它包含工具包）并在 PushPin 定义内的 XAML 中添加以下内容：

<map:Pushpin x:Name="currentLocation">
<toolkit:ContextMenuService.ContextMenu>
    <toolkit:ContextMenu IsZoomEnabled="False">
        <toolkit:MenuItem Header="this is menu item 1" Click="MenuItem_Click" />
        <toolkit:MenuItem Header="this is menu item 2" Click="MenuItem_Click" />
        <toolkit:MenuItem Header="this is menu item 3" Click="MenuItem_Click" />
    </toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu></map:Pushpin>

这样，当您点击并按住图钉时，您将获得联系菜单！（也可以在这里找到很好的例子：example）

【讨论】：