当前位置：文江博客话题详情

在 MXML Graphics 中绘制圆弧

发布于 2024-10-18 04:41:06 字数 80 浏览 4 评论 0原文

有没有一种简单的方法可以在 MXML 图形中绘制不涉及贝塞尔曲线的圆弧？或者我应该创建自己的组件？

谢谢！

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

孤蝉 2024-10-25 04:41:06

我最终创建了自己的 mxml 图形组件来绘制弧线。我覆盖 Ellipse Spark 原语并使用 AS 进行弧数学 - 主要是复制这篇很棒的文章，其中指向此代码。

回复收藏 0 原文

爱已欠费 2024-10-25 04:41:06

<s:Ellipse height="16" width="16">
    <s:stroke>
        <s:SolidColorStroke color="0x000000" joints="square" caps="square"/>
    </s:stroke>
    <s:fill>
        <s:SolidColor color="0x000000"/>
    </s:fill>
</s:Ellipse>

<s:Ellipse height="16" width="16">
    <s:stroke>
        <s:SolidColorStroke color="0x000000" joints="square" caps="square"/>
    </s:stroke>
    <s:fill>
        <s:SolidColor color="0x000000"/>
    </s:fill>
</s:Ellipse>

回复收藏 0 原文

策马西风 2024-10-25 04:41:06

您可以使用 Path 类绘制曲线。您将其 data 属性设置为一个字符串，其中包含执行光标放置和绘图操作的交替命令和数值。命令是：

C - 绘制贝塞尔曲线。
H - 绘制一条水平线。
L - 画一条线。
M - 移动光标。
Q - 绘制二次贝塞尔曲线。
V - 绘制一条垂直线。
Z - 关闭路径。

如何将其与 FXG 一起使用的示例如下：

<s:Path data="M 20 0
        C 50 0 50 35 20 35
        L 15 35 L 15 45
        L 0 32 L 15 19
        L 15 29 L 20 29
        C 44 29 44 6 20 6">
    <s:stroke>
        <s:SolidColorStroke color="0x000000" weight="1"/>
    </s:stroke> 
</s:Path>

You can draw curves using the Path class. You set its data property as a string containing alternating commands and numeric values that execute cursor placement and drawing operations. The commands are:

C - Draws a bezier curve.
H - Draws a horizontal line.
L - Draws a line.
M - Moves cursor.
Q - Draws a quadratic bezier curve.
V - Draws a vertical line.
Z - Closes path.

An example of how to use this with FXG is as follows:

<s:Path data="M 20 0
        C 50 0 50 35 20 35
        L 15 35 L 15 45
        L 0 32 L 15 19
        L 15 29 L 20 29
        C 44 29 44 6 20 6">
    <s:stroke>
        <s:SolidColorStroke color="0x000000" weight="1"/>
    </s:stroke> 
</s:Path>

You can find more infomation on it here:

http://help.adobe.com/en_US/flex/using/WS5B6A8436-0FF5-4029-8524-C7C1106C483D.html

回复收藏 0 原文