如何使用Bing地图在Windows应用商店应用中实现弹出气球?

时间:2013-01-30 19:20:20

标签: c# xaml popup windows-store-apps popup-balloons

我有一个应用程序,显示有关放置在地图上的某个图钉的信息。到目前为止,我将信息显示为消息对话框。这看起来不是很好,并不适合作为信息框。我将尝试实现一个弹出窗口,它将显示所有信息,这应该很容易,因为有很多关于它的文档。我的问题是如何让它看起来像在Windows地图应用程序中显示的弹出气球一样时髦?图像显示了我的意思。似乎这种气球更难找到信息。

也许我正在寻找错误的东西。

有谁知道这是否相对容易?以及如何自己做的任何信息?

popup balloon in windows maps image

2 个答案:

答案 0 :(得分:2)

我实际上是在寻找类似的东西,最后创建了一个UserControl。这就是我的样子:

enter image description here

这就是Xaml代码的样子:

<Popup 
    x:Name="bingMapsFlyout" 
    IsLightDismissEnabled="True"
    >
        <Popup.ChildTransitions>
            <TransitionCollection>
                <PaneThemeTransition/>
            </TransitionCollection>
        </Popup.ChildTransitions>
        <Canvas 
        x:Name="contentFlyoutPanel" 
        Height="126" 
        Width="259"
        >
            <Rectangle HorizontalAlignment="Left" Height="45.035" VerticalAlignment="Top" Width="20.552" RenderTransformOrigin="0,1" UseLayoutRounding="False" d:LayoutRounding="Auto" Fill="#FF252525" Opacity="0.6" Canvas.Left="26.902" Canvas.Top="26.128">
                <Rectangle.Clip>
                    <RectangleGeometry Rect="20.761,-7.16,21.378,58.646">
                        <RectangleGeometry.Transform>
                            <CompositeTransform CenterY="-7.6496992111206055" CenterX="20.250661849975586" Rotation="-3.03122615814209" SkewX="-21.284000396728516"/>
                        </RectangleGeometry.Transform>
                    </RectangleGeometry>
                </Rectangle.Clip>
                <Rectangle.RenderTransform>
                    <CompositeTransform SkewX="21" Rotation="163.744"/>
                </Rectangle.RenderTransform>
            </Rectangle>
            <Rectangle HorizontalAlignment="Left" Height="69" VerticalAlignment="Top" Width="245" Fill="#FF2B2B2B" Canvas.Left="7" Canvas.Top="8"/>
            <StackPanel HorizontalAlignment="Left" Height="69" VerticalAlignment="Top" Width="247" Canvas.Left="7" Canvas.Top="8">
                <TextBlock x:Name="txtLine1" HorizontalAlignment="Left" Height="18" TextWrapping="Wrap" VerticalAlignment="Top" Width="227" Margin="10,10,0,0" Foreground="White" FontFamily="Arial" FontSize="16" FontWeight="Bold"/>
                <TextBlock x:Name="txtLine2" HorizontalAlignment="Left" Height="26" TextWrapping="Wrap" VerticalAlignment="Top" Width="227" Margin="10,5,0,0" Foreground="White" FontFamily="Arial" FontSize="12" FontWeight="Bold"/>
            </StackPanel>
        </Canvas>
    </Popup>

答案 1 :(得分:0)