none
新人请教,关于Path的Data生成问题 RRS feed

  • 问题

  • 最近学习Silverlight,在学习一些Demo的时候发现http://demos.devexpress.com/AgMenuDemos/这里的LOGO是使用以下代码生成的图片。请问下生成Path 的Data数据有专门的工具吗?如果没有,如何可以得到这些数据?


                                        <Path Stretch="Fill" Fill="#FF36395E" Data="F1 M 477.95,133.045L 475.899,133.045L 475.26,135.455C 475.038,136.325 474.824,137.282 474.67,138.143L 474.631,138.143C 474.487,137.262 474.273,136.353 474.061,135.463L 473.461,133.045L 471.382,133.045L 470.868,140.524L 472.397,140.524L 472.522,137.862C 472.561,137.06 472.609,136.005 472.639,135.077L 472.667,135.077C 472.822,135.995 473.035,137.011 473.219,137.727L 473.887,140.388L 475.174,140.388L 475.909,137.708C 476.112,136.992 476.373,135.976 476.566,135.077L 476.595,135.077C 476.586,136.063 476.625,137.06 476.664,137.852L 476.77,140.524L 478.376,140.524M 465.141,134.534L 466.834,134.534L 466.834,140.524L 468.537,140.524L 468.537,134.534L 470.25,134.534L 470.25,133.045L 465.141,133.045M 462.19,142.49L 457.861,142.49L 457.861,155.213C 457.861,158.309 455.547,159.876 453.569,159.876C 450.734,159.876 449.727,157.526 449.727,153.982L 449.727,142.453L 445.398,142.453L 445.398,154.691C 445.398,161.258 448.496,163.459 452.041,163.459C 455.361,163.459 457.376,161.481 458.233,160.064L 458.345,160.064L 458.57,163.049L 462.375,163.049C 462.301,161.407 462.19,159.466 462.19,157.153M 433.235,142.042C 430.139,142.042 427.974,143.796 427.003,145.549L 426.891,145.549L 426.668,142.49L 422.899,142.49C 422.974,144.243 423.049,145.996 423.049,148.273L 423.049,163.049L 427.377,163.049L 427.377,150.661C 427.377,147.376 429.652,145.624 431.779,145.624C 434.727,145.624 435.698,148.086 435.698,150.996L 435.698,163.049L 440.026,163.049L 440.026,150.475C 440.026,144.131 436.444,142.042 433.235,142.042 Z M 414.765,150.661L 405.736,150.661C 405.96,148.273 407.303,145.139 410.474,145.139C 413.796,145.139 414.803,148.198 414.765,150.661 Z M 410.773,142.042C 404.952,142.042 401.52,146.929 401.52,153.048C 401.52,159.317 405.101,163.459 411.297,163.459C 414.095,163.459 416.37,162.899 417.825,162.227L 417.116,159.167C 415.773,159.728 414.205,160.138 411.93,160.138C 408.684,160.138 405.811,158.384 405.699,153.757L 418.758,153.757C 418.832,153.236 418.87,152.639 418.87,151.93C 418.87,146.855 416.557,142.042 410.773,142.042 Z M 390.7,134.467L 386.559,147.004C 385.439,150.549 384.544,153.795 383.835,156.854L 383.722,156.854C 383.014,153.72 382.156,150.549 381.112,147.041L 377.081,134.467L 371.708,134.467L 369.769,163.049L 373.797,163.049L 374.432,151.258C 374.656,147.266 374.88,142.751 374.954,139.205L 375.066,139.205C 375.775,142.638 376.783,146.37 377.94,150.1L 381.857,162.787L 385.104,162.787L 389.357,149.84C 390.551,146.221 391.67,142.563 392.529,139.205L 392.641,139.205C 392.603,142.751 392.827,147.154 393.013,151.034L 393.648,163.049L 397.827,163.049L 396.11,134.467M 360.44,154.466C 360.44,157.9 358.201,159.616 355.963,159.616C 352.754,159.616 350.926,156.743 350.926,152.713C 350.926,148.31 353.015,145.474 356,145.474C 358.65,145.474 360.44,147.713 360.44,150.436M 360.925,145.251L 360.851,145.251C 359.993,143.609 358.276,142.042 355.216,142.042C 350.739,142.042 346.523,145.922 346.523,152.899C 346.523,158.646 349.843,162.937 354.694,162.937C 357.344,162.937 359.358,161.668 360.404,159.914L 360.477,159.914L 360.477,161.891C 360.477,166.556 358.09,168.422 354.732,168.422C 352.419,168.422 350.44,167.713 349.172,166.966L 348.202,170.324C 349.806,171.295 352.306,171.817 354.694,171.817C 364.433,171.817 364.769,164.242 364.769,160.138L 364.769,148.422C 364.769,145.661 364.843,143.944 364.955,142.49L 361.112,142.49M 328.874,151.333L 331.151,143.833C 331.635,142.079 332.083,139.989 332.494,138.236L 332.569,138.236C 332.978,139.989 333.464,142.004 333.986,143.87L 336.226,151.333M 330.031,134.504L 321.3,163.049L 325.74,163.049L 328.203,154.653L 336.935,154.653L 339.508,163.049L 344.06,163.049L 335.33,134.504L 330.031,134.504 Z " Height="38.772" HorizontalAlignment="Stretch" Margin="42.3129997253418,1.22800004482269,0,0" VerticalAlignment="Stretch" Width="157.075"/>
    2008年12月31日 5:08

答案

全部回复

  • 其实就是把图像转化为Byte数组,然后以固定的格式存入XML文件中,我这样解释您应该明白了吧。

    至于生成类似文件的方法,您可以参考这篇文章

    http://www.cnblogs.com/eugene0221/articles/294012.html

    当然,也许格式与您想要的不一样,但是原理是一样的。改改代码就可以了。

    2008年12月31日 6:02
    版主
  • 按你的方法得到是的以下的代码,不是我想要的Path 格式的代码

    iVBORw0KGgoAAAANSUhEUgAAAEsAAAAWCAYAAACIXmHDAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAABUZJREFUeNrsWG1oG2Ucf+4lzSXrpenr6rq26QfT1pcRkGKx1GVfRjcQKpvSqYPAPrgv+kFEESaKb+g2HEwsg03pRKGfajooBulYB5tE3eA61zYbKtFk9iWYpUmbXpK7i8/d/ocP17x3/ZY/PKR3z91zz/93v9///7tS2WwWVaO0oKsQVMHalmCNJ5KKjDRlUhSiaRplFQVR6q8k1a75ftyd/Olnp6mlOWZ+4rFly97BIJ5LIUabRztYk7YGhe/NE6149OARw0MosjdHGXnEYFQcpZQjthjtsjTNrH5/6cnYN98NbtwUGuVYTAODaWxAlr6nQi0fvDvNdTv/kovvx46HBw8ODxGPJRj5wlNGrjMw9BcyVCZW6j58lYGlgoHZlJi+sif65bmBtcszO7OZDKIYBiFZ0d6CvBxB8YlL7an5wMudUxNfse27lws8R01gGIBSGeWCY28RwIox0A5rkcEBK4US2eaqWIYaUBSNoue/di+/855bSawhijMjhOXIdjky7OO961h6cno+wKPQvRoMVk3k1Jn9bV98/q1KxDxyGoEkvJBEEMBS2TMOx7mCKyJHrsBcAF5EDEB1wDmRAJorR+7sZqxo6t+zo88uvXXCTVk4RLEsou12VHv0yNyOo0euWrqdK7gy8eLcQve9wy8dkNIpZm36Slcqer+Oa6g3vkk3DEQAheBXJADzg4zEh1iPRwCsc8AeNzxHgPNuOF9yvdsEViYUdkQ+OblPY1M6jcwD/ZH6M5/5TM5H/zDRWIa3bveG3z5xQI7HWSUepymOQ/JKhE7/HWpA/4Olb84OGxnPIbcAJKIm1Q/3CIbaIRKs0yUXINayg8RzhUDswwX39MAYI55nr5hZonCrSUms4xkGsY5OseHs6Um2oz1Mra6iGosVhd7/aDDu89kYvg5RZrPWBVXmKTY+SSzTD5tYgmSOl1Bg7UTyQwRIDoPkWg3yC8I1QwagdSBIZovwcjzENe6KwUot3OlUizn2DKjGtSfJ9/SE5UQCUUpWkyRjsT7wZrKMlNW4Vs/4V49dZ5qbVohlxg1FGBk6lWAo3KQU7AVqWKBIM8jVJT0AkmAAN1jgOaWBxbY9ch9hm0RbrSg55WtYn5jcW/fcwauSJGtMajn54aRcY9ov/bPYiK9dt7542M/1980iEe+H53NtPJYnsWCBpPUkSy2+Y3nWsxsaRZDYT9n1cRNYtkPDv0ZHz/dt/HKDo/latPLp6X3ZtXWr5Zmn5xkbv8LU2xd3XRi9KCqyCUtQptIZJYtrG8pt6jx5upcrBxC+PDZirIglGSrQKd1ENxwCKepWoadM44soo3PdUKV4564z/MqxQ6nZ38xqR1RZpppQU9uuuLm3+08M6O+WwYHb6VQKSckkUnDdUj17c3Oz0cHnAqs1TwcyglUpsxxwr14vx+HXDWzi4PoR2IMIDn6sbGap0GFHfrfzB++FxdffPJi8dr1LWlxGUjSKUnMLtlQo7FLSmTa6ro7B4M3SuL5JWIIa6ABWAVboiQiE4y5U9PUirJtMHQQ/nNM7nJiHdUGoc0Gim87AsR8aESpijAs7eEWdaGqM2F54/mL9G685Ni5fcZo6OtLJGzd5JZGw7Dz18RS2C5QUiTz4hsz/LbiV8AMbholijQh2uODvfEXfS8yJBHP9hk+k4xXL8GEElqG7nJZs6F4CAOQgwBAJSxIgpNUPzNI/o7wEe8cKNBH9iyKmezeMw/iWPqS3EEK5bdlgIWLABN3pe4i2P0NIx0uwbMlgZMUiz2kFaQZKKAnbx6zqP/+qUQWrCtY2xX8CDABlYgB+Uh1L5QAAAABJRU5ErkJggg==

    2008年12月31日 15:46
  • 你可以有两种方法做到
    一种是用 Expression Blend
    另一种是自已利用程序生成Path ,这里有一个附源代码的例子
    http://www.slblogger.cn/p68.htm

    注意看一下其中随手绘制部分的代码
    2009年7月23日 6:07
  • 用Microsoft Expression Design 可以解决path问题  画好 复制xaml到blend就可以
    2009年7月23日 7:16
  • Path的Data数据有三种生成方式:

    1. 最简单的是用Expression Design。可以粘贴来自其它软件的矢量图形。导出时选择,文件->导出->导出属性->格式->XAML Silverlight 画布,即可得到XAML格式的矢量图形,也就是Path。

    2. 如果只是把文字转成图形,相当于印刷行业里的文字转曲,可以直接用Expression Blend。对象->路径->转换为路径,即可。

    3. 自己动手写。当然这也是最难的方式。不过对于简单图形来说非常有用。用Design生成的数据量很大,手写就会变得很简洁。命令的使用方法如下:

    ==============================

    1. 移动指令:Move Command(M):M 起始点,或者:m 起始点
    比如:M 100,240 或 m 100,240
    使用大写M时,表示绝对值; 使用小写m时; 表示相对于前一点的值,如果前一点没有指定,则使用(0,0)。

    2. 绘制指令(Draw Command): 
    (1) 直线:Line(L)
    (2) 水平直线: Horizontal line(H)
    (3) 垂直直线: Vertical line(V)
    (4) 三次方程式贝塞尔曲线: Cubic Bezier curve(C)
    (5) 二次方程式贝塞尔曲线: Quadratic Bezier curve(Q)
    (6) 平滑三次方程式贝塞尔曲线: Smooth cubic Bezier curve(S)
    (7) 平滑二次方程式贝塞尔曲线: smooth quadratic Bezier curve(T)
    (8) 椭圆圆弧: elliptical Arc(A)

    上面每种形状后用括号括起的英文字母为命令简写的大写形式,但你也可以使用小写。使用大写与小写的区别是:大写是绝对值,小写是相对值。重复使用同一种类型时,就可以省略前面的命令。比如:L 100,200 L 300,400简写为:L 100,200 300,400。

    绘制指令格式语法:

    (1) 直线:Line(L)
    格式:L 结束点坐标 或: l 结束点坐标。
    比如:L 100,100 或 l 100 100。坐标值可以使用x,y(中间用英文逗号隔开)或x y(中间用半角空格隔开)的形式。

    (2) 水平直线  Horizontal line(H):绘制从当前点到指定x坐标的直线。
    格式:H x值 或 h x值(x为System.Double类型的值)
    比如:H 100或h 100,也可以是:H 100.00或h 100.00等形式。

    (3) 垂直直线 Vertical line(V):绘制从当前点到指定y坐标的直线。
    格式:V y值 或 v y值(y为System.Double类型的值)
    比如:V 100或y 100,也可以是:V 100.00或v 100.00等形式。

    (4) 三次方程式贝塞尔曲线 Cubic Bezier curve(C):通过指定两个控制点来绘制由当前点到指定结束点间的三次方程贝塞尔曲线。
    格式:C 第一控制点 第二控制点 结束点 或 c 第一控制点 第二控制点 结束点
    比如:C 100,200 200,400 300,200 或 c 100,200 200,400 300,200
    其中,点(100,200)为第一控制点,点(200,400)为第二控制点,点(300,200)为结束点。

    (5) 二次方程式贝塞尔曲线 Quadratic Bezier curve(Q):通过指定的一个控制点来绘制由当前点到指定结束点间的二次方程贝塞尔曲线。
    格式:Q 控制点 结束点 或 q 控制点 结束点
    比如:q 100,200 300,200。其中,点(100,200)为控制点,点(300,200)为结束点。

    (6) 平滑三次方程式贝塞尔曲线: Smooth cubic Bezier curve(S):通过一个指定点来“平滑地”控制当前点到指定点的贝塞尔曲线。
    格式:S 控制点 结束点 或 s 控制点 结束点
    比如:S 100,200 200,300

    (7) 平滑二次方程式贝塞尔曲线 smooth quadratic Bezier curve(T):与平滑三次方程贝塞尔曲线类似。
    格式:T 控制点 结束点 或 t 控制点 结束点
    比如:T 100,200 200,300

    (8) 椭圆圆弧: elliptical Arc(A) : 在当前点与指定结束点间绘制圆弧。
    A 尺寸 圆弧旋转角度值 优势弧的标记 正负角度标记 结束点 或: a 尺寸 圆弧旋转角度值 优势弧的标记 正负角度标记 结束点
    尺寸(Size): System.Windows.Size类型,指定椭圆圆弧X,Y方向上的半径值。
    旋转角度(rotationAngle):System.Double类型。
    圆弧旋转角度值(rotationAngle):椭圆弧的旋转角度值。
    优势弧的标记(isLargeArcFlag):是否为优势弧,如果弧的角度大于等于180度,则设为1,否则为0。
    正负角度标记(sweepDirectionFlag):当正角方向绘制时设为1,否则为0。
    结束点(endPoint):System.Windows.Point类型。
    比如:A 5,5 0 0 1 10,10

    3. 关闭指令(close Command):用以将图形的首、尾点用直线连接,以形成一个封闭的区域。
    用Z或z表示。

    F0 指定 EvenOdd 填充规则。
    F1 指定 Nonzero 填充规则。
    如果省略此命令,则路径使用默认行为,即 EvenOdd。如果指定此命令,则必须将其置于最前面。
    EvenOdd 确定一个点是否位于填充区域内的规则,具体方法是从该点沿任意方向画一条无限长的射线,然后计算该射线在给定形状中因交叉而形成的路径段数。如果该数为奇数,则点在内部;如果为偶数,则点在外部。 
    Nonzero 确定一个点是否位于路径填充区域内的规则,具体方法是从该点沿任意方向画一条无限长的射线,然后检查形状段与该射线的交点。从 0 开始计数,每当线段从左向右穿过该射线时加 1,而每当路径段从右向左穿过该射线时减 1。计算交点的数目后,如果结果为 0,则说明该点位于路径外部。否则,它位于路径内部。

    2009年7月24日 3:34
  • 这是用blend工具生成的,如果用命令手写,会累死的,呵呵!design工具也可以生成的。
    2009年7月24日 4:13
  • 用Expression Blend去画Path

    导入Adobe .ai的矢量资源

    还可以导入Flash的swf
    如果您觉得对您有帮助,请在“是否有帮助”点“是”;如果你觉得回复很满意,请“标记为已解答”
    2009年8月27日 10:10
    版主