Flex Graphics图形绘制示例
Flex 的图形绘制功能挺强的，适合做一些简单但有视觉冲击力的图形界面。这个例子主要演示了怎么用 Flex 的 Graphics API 来画矩形、圆角矩形，还有怎么切换不同的样式，比如线条、渐变、纯色填充。你可以根据按钮选项一键切换样式，响应也快，效果还挺不错。
基础结构方面，代码用的是标准的 Flex 应用框架，最小宽高设好了，还引了fx、s、mx这些命名空间。老 Flex 开发者一眼就能看懂。
绘图函数里重点是两个方法：一个是rect()画矩形，一个是circleRect()画圆角矩形。每次绘制前先clear()清掉之前的内容，再根据用户的选择应用不同的样式。比如：
rectBoxID.graphics.lineStyle(20, 0xFF0000, 1.0);
rectBoxID.graphics.beginFill(0xFF0000);
rectBoxID.graphics.beginGradientFill(...);语法还是挺直观的，不管是填色还是画线，都用graphics对象就能搞定。
渐变填充这块要注意下Matrix类的用法，它是设置渐变角度和方向的关键。不熟悉的同学可以先试试默认的createGradientBox()配置，慢慢调。
线条样式相关的LineScaleMode、CapsStyle、JointStyle这些枚举值你可以灵活用，是做细线的时候，用VERTICAL可以防止横向拉伸变形。
还有一个小坑，circleRect()函数里有个笔误，结尾的rectBoxID.graphics.endFill()其实应该是cRectBoxID.graphics.endFill()，不然填充会出问题。
如果你是做 Flex 组件开发，或者想用 ActionScript 实现更丰富的 UI 效果，这份代码挺值得参考的。调试简单，效果直观，新手也能上手。
文件大小：6.66KB
评论区