显示两个重叠边框xaml WP8

Question

我有两个 Canvas，其中包含 Path 类型。这些元素放置在地图中，其中我有一个顶部坐标和左侧坐标。这些元素的边框颜色不同。在它们的边界处它们重叠，因此只显示了一个有颜色的元素边界。有没有办法调整我的 xaml 代码，以便显示两个边框，而不更改顶部和左侧坐标，因为当我将这些元素放入我的地图时，我是从 ViewModel 中的列表中获取它们。两个重叠国家的一个例子是：

所以你可以在图片中看到你只能看到苏格兰和爱尔兰的边界，但看不到英格兰。我为每个国家/地区使用的 xaml 代码是

    Canvas.Left="{Binding CountryView.X}" Canvas.Top="{Binding CountryView.Y}" Canvas.ZIndex="{Binding CountryView.Z}">     

<Canvas>
        <Path x:Name="CountryUser" Stretch="Fill" StrokeThickness="{StaticResource StrokeUserControl}" StrokeLineJoin="Round" Fill="{StaticResource CountryBackground}" Stroke="{Binding CountryView.CountryColor}" Data="{Binding CountryView.MapData}"/>
    </Canvas>

CountryView 是我的国家/地区列表。我对 DashArray 进行了一些研究，是否可以在国家共享边界的地方应用破折号，这样在边界处您可以更改每种颜色的破折号，但该国其他地区与国家一致颜色？

Answer 1

如果你和我有同样的经历，你会遇到很多这些小问题，它们可能会成为 * 的一大痛点，但是....幸运的是几乎总是一种解决方法或技巧，您可以做到这一点，您将在此过程中学习。对于您当前的问题，您有一些选项可以帮助您的用户。这里只是其中的几个；

ScaleTransform 或 Margin 你的 Path 用于轮廓 1 像素或更多，以便为你的边框留出一点空间，让它们彼此相邻显示，而不必重叠。

在您的路径之间使用Opacity，无论是通过将Opacity 直接设置为Path，还是使用作为笔划提供的颜色的Alpha 通道，例如#59ff0000，至少允许重叠边界上的颜色对比。例如，假设您有 2 个路径，一个蓝色，一个黄色，然后它们重叠的地方将显示绿色。

通过StrokeDashArray 创建对比，正如您所指出的那样，通过使用空间/宽度来错开边框，因此即使它们确实重叠，它们仍然不会彼此重叠，这也是StrokeDashOffset 的地方可以派上用场。

如果您允许您的用户与这些形状进行交互，我还可以向您展示如何将VisualStateManager 应用于路径并在Stroke 短划线被选中时为它们设置动画等，以使其更加可见用户选择的区域。

无论如何，希望这会有所帮助。如果你想要具体的例子，请告诉我。干杯。

更新： 您可以像这样使用 ScaleTransform；

<Canvas>
   <Path x:Name="CountryUser" Stretch="Fill" StrokeThickness="{StaticResource StrokeUserControl}" StrokeLineJoin="Round" Fill="{StaticResource CountryBackground}" Stroke="{Binding CountryView.CountryColor}" Data="{Binding CountryView.MapData}">
     <Path.RenderTransform>
        <CompositeTransform ScaleX="0.95" ScaleY="0.95"/>
     </Path.RenderTransform>
   </Path>
</Canvas>

您可以调整 X/Y 比例因子以满足您的需要，但 .95 本身可能会提供不错的结果。