XAML 中从形状到路径的转换答案

【问题标题】：Conversion from Shape to Path in XAMLXAML 中从形状到路径的转换
【发布时间】：2012-06-19 19:29:02
【问题描述】：

如何将 XAML 代码（代表一组形状）更改为 PATH 呈现的单个图形？

假设我们有 XAML 代码，例如：

  <Ellipse Fill="#FF0A0A0E" HorizontalAlignment="Left" Margin="192,184,0,0" 
           Stroke="Black" Width="8" Height="8" VerticalAlignment="Top"/>
  <Rectangle Fill="Black" HorizontalAlignment="Left" Margin="152,187.5,0,0" 
             Stroke="Black" Width="89.5" Height="1" VerticalAlignment="Top"/>

并且需要将其转换为单个路径对象？

我尝试使用 Blend 4，它允许您将形状转换为路径，但随后上面的代码被转换为：

<Path Data="M7.5,4 C7.5,5.9329966 5.9329966,7.5 4,7.5 C2.0670034,7.5 0.5,5.9329966 0.5,4 C0.5,2.0670034 2.0670034,0.5 4,0.5 C5.9329966,0.5 7.5,2.0670034 7.5,4 z" 
      Fill="#FF0A0A0E" HorizontalAlignment="Left" Height="8" Margin="192,184,0,0" 
      Stretch="Fill" Stroke="Black" VerticalAlignment="Top" Width="8"/>
<Path Data="M0.5,0.5 L89,0.5 z" Fill="Black" HorizontalAlignment="Left" Height="1" 
      Margin="152,187.5,0,0" Stretch="Fill" Stroke="Black" VerticalAlignment="Top" 
      Width="89.5" />

我问这个问题的原因是因为我只能定义一个路径。如我错了请纠正我。如果是这样，那么我怎样才能在一种样式中嵌入 2 条或更多条路径？

【问题讨论】：

标签： wpf xaml path expression-blend

【解决方案1】：

您可以使用 Expression Blend 4 将两个形状组合成一个 Path。

要做到这一点，按住 ctrl 或 shift 同时选择它们

之后，选择对象 -> 组合 -> 联合

在你的情况下它会输出这个

<Path Data="M44,0.5 C45.932995,0.50000024 47.5,2.0670036 47.5,4.0000002 L89,4.0000002 89,4.0100003 47.499496,4.0100003 47.48193,4.3578544 C47.302696,6.122751 45.812183,7.5000002 44,7.5000002 42.187817,7.5000002 40.697304,6.122751 40.51807,4.3578544 L40.500504,4.0100003 0.5,4.0100003 0.5,4.0000002 40.5,4.0000002 C40.5,2.0670036 42.067005,0.50000024 44,0.5 z"
      Fill="Black"
      HorizontalAlignment="Left"
      Height="8"
      Margin="152,184,0,0"
      Stretch="Fill"
      Stroke="Black"
      VerticalAlignment="Top"
      Width="89.5"/>

请注意，如果 Rectangles Height 恰好为 1，则会出现错误。然后它就会消失。要解决此问题，只需将 Height 设置为 1.00001

<Rectangle Fill="Black" HorizontalAlignment="Left" Margin="152,187.5,0,0"  
         Stroke="Black" Width="89.5" Height="1.00001" VerticalAlignment="Top"/>

【讨论】：

【解决方案2】：

可以使用一个数据字段执行多个单独的路径。例如：

<Path Data="M0,0 L 10,10 L 20, 10 L 20,0 z M 100,5 L 110,15 L 120,15 L 120,5 z" 
      Stroke="Black" Fill="Red" />

但是，假设您在两个部分中都需要相同的 Fill、Stroke 等，而您的示例中并非如此。

【讨论】：