【问题标题】:Can you convert a XAML DrawingImage back into an SVG for editting?您可以将 XAML 绘图图像转换回 SVG 以进行编辑吗?
【发布时间】:2010-10-31 02:58:54
【问题描述】:

两年前,一家设计公司在 WPF 中进行了应用程序设计,现在我们正在考虑更改其中一张图片上的文字。没有提供 SVG 文件,只使用了 XAML 代码,并且在设计公司从事该项目的开发人员不再在那里工作。我知道他在设计中使用了 Expression Blend。

任何有关将这样的 XAML 转换为 SVG 的可能方法的帮助都会有所帮助,甚至可以就使用什么工具生成此 XAML 提出建议。我看到了 this topic on converting XAML to SVG,但看起来这些工具只对最初在其工具中转换的 SVG 进行转换。

资源字典包含用于通过应用程序显示图像的所有 DrawingImage 对象。这是我们正在编辑的一张图片:

<DrawingImage x:Key="MotorControlBackground">
<DrawingImage.Drawing>
  <DrawingGroup>
    <DrawingGroup.Children>
      <GeometryDrawing Brush="#FF466280" Geometry="F1 M -1138.47,3547.06C -1128.45,3557.08 -1112.14,3557.17 -1102.23,3547.25L -1024.29,3469.32L -1118.83,3374.78L -1214.79,3470.74L -1138.47,3547.06 Z ">
        <GeometryDrawing.Pen>
          <Pen Thickness="2.5" MiterLimit="2.75" Brush="#FF212121"/>
        </GeometryDrawing.Pen>
      </GeometryDrawing>
      <GeometryDrawing Brush="#FFFFFFFF" Geometry="F1 M -1131.22,3533.84L -1138.68,3533.84L -1138.68,3532.34L -1135.91,3532.34L -1135.91,3521.89L -1138.68,3521.89L -1138.68,3520.4C -1137.64,3520.4 -1136.87,3520.25 -1136.38,3519.95C -1135.88,3519.65 -1135.6,3519.09 -1135.54,3518.26L -1133.99,3518.26L -1133.99,3532.34L -1131.22,3532.34L -1131.22,3533.84 Z "/>
      <!-- ... Heavily shortened. Expect around 100 more lines here ... -->
      <GeometryDrawing Geometry="F1 M -1175.94,3268.96L -1057.64,3475.82">
        <GeometryDrawing.Pen>
          <Pen Thickness="1.33333" MiterLimit="2.75" Brush="#88C7C7C7"/>
        </GeometryDrawing.Pen>
      </GeometryDrawing>
      <GeometryDrawing Geometry="F1 M -1086.99,3255.92L -1147.5,3485.59">
        <GeometryDrawing.Pen>
          <Pen Thickness="1.33333" MiterLimit="2.75" Brush="#88C7C7C7"/>
        </GeometryDrawing.Pen>
      </GeometryDrawing>
      <GeometryDrawing Brush="#FF0C407C" Geometry="F1 M -1025.41,3324.46C -1035.45,3304.48 -1051.7,3288.14 -1071.58,3278.06C -1085.54,3270.98 -1101.28,3266.99 -1117.91,3266.99C -1131.79,3266.99 -1145.06,3269.78 -1157.2,3274.82C -1182.66,3285.41 -1203.09,3305.94 -1213.63,3331.52C -1218.64,3343.71 -1221.42,3357.05 -1221.42,3371C -1221.42,3385.48 -1218.44,3399.29 -1213.06,3411.83C -1202.56,3436.34 -1182.94,3456.06 -1158.55,3466.61C -1146.05,3472.01 -1132.31,3475.02 -1117.91,3475.02C -1103.67,3475.02 -1090.09,3472.09 -1077.72,3466.81C -1052.97,3456.24 -1033.07,3436.25 -1022.56,3411.38C -1017.3,3398.95 -1014.39,3385.3 -1014.39,3371C -1014.39,3354.3 -1018.37,3338.48 -1025.41,3324.46 Z "/>
      <!-- ... shortened some more ... -->
      <GeometryDrawing Geometry="F1 M -1021.98,3324.73C -1021.98,3355.74 -1069.88,3368.43 -1117.29,3372.09C -1117.75,3372.13 -1120.57,3372.05 -1120.57,3372.05C -1167.81,3368.32 -1215.32,3355.62 -1215.32,3324.73C -1215.32,3286.57 -1170.4,3255.35 -1115.48,3255.35L -1121.82,3255.35C -1066.92,3255.35 -1021.98,3286.57 -1021.98,3324.73 Z ">
        <GeometryDrawing.Brush>
          <LinearGradientBrush StartPoint="0.548505,0.143509" EndPoint="0.548505,0.805904">
            <LinearGradientBrush.GradientStops>
              <GradientStop Color="#7FFFFFFF" Offset="0"/>
              <GradientStop Color="#00FFFFFF" Offset="1"/>
            </LinearGradientBrush.GradientStops>
          </LinearGradientBrush>
        </GeometryDrawing.Brush>
      </GeometryDrawing>
    </DrawingGroup.Children>
  </DrawingGroup>
</DrawingImage.Drawing>
</DrawingImage>

【问题讨论】:

    标签: c# xaml svg


    【解决方案1】:

    Inkscape(SVG 编辑器)对 XAML 的支持有限。

    上次我尝试它时,XAML 支持并不完美,但那可能是 6 个月前的事了。从那以后它可能有所改善。

    【讨论】:

    • 虽然它最终没有解决我的问题,但我接受了这个答案,因为我没有意识到 Inkscape 支持 XAML,而且我可能会弄清楚 Inkscape 的格式,复制- 从我自己的 XAML 中粘贴路径,然后重新打开。我了解到上面的代码是通过在 Illustrator 中创建图像,将其导入 Micrsoft Design,然后将其导入 Microsoft Blend 生成的。
    • 微软设计指的是什么程序? microsoft.com/en/us/sitemap.aspx#Products 显示“设计和用户体验”类别仅包含 Expression 和 Silverlight。
    • 我找到了解决方案。它被称为 Microsoft Expression Design 4,在安装 Microsoft Expression Studio 4 Ultimate 时安装。
    • 使用命令行:&amp; 'C:\Program Files\Inkscape\inkscape.exe' -z input.xaml -l output.svg
    【解决方案2】:

    通过http://www.codeproject.com/Articles/422523/Convert-XAML-Vector-Graphic-to-PNG将XAML转换为PNG,然后将PNG转换为SVG,可能是一种解决方案。在转换方面,PNG 和 SVG 之间有更多选择。我已经使用这种方法将我的 XAML 绘图转换为 EMF。

    【讨论】:

    • Xaml 和 SVG 是矢量格式,而 png 是像素格式,所以从 png 到 svg 没有意义...
    • @Peter 如果他们有一个不支持 SVG 的工具,这可能与很多人有关。从矢量到像素是微不足道的,只是完全相反。
    • @Chazt3n 当从向量到像素时,你会丢失很多数据,所以从向量 -> 像素 -> 向量是一个坏主意,如果可能的话跳过像素步骤,否则你可以99.9% 确定它不再是同一个矢量图像了......
    • @Peter 很明显,您会丢失数据,并且在进行此类转换时无法获得相同的数据。我需要将 SVG 用于移动开发,因为当然不支持 XAML。但是我有一个非常大的 XAML 图标库。将 XAML 转换为位图,然后转换为 SVG 后,对于简单的图标工作正常,丢失数据是绝对可以接受的。
    猜你喜欢
    • 1970-01-01
    • 2012-01-14
    • 1970-01-01
    • 2013-02-14
    • 1970-01-01
    • 1970-01-01
    • 2011-05-05
    • 1970-01-01
    • 2022-08-19
    相关资源
    最近更新 更多