`
shlei
  • 浏览: 287697 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

Flex 4中Spark组件利用Skin Class外观设计(4)

    博客分类:
  • FLEX
阅读更多
FXG的基本形状有三种,矩形(圆角矩形)、椭圆(圆形)、直线。

Rect矩形(圆角矩形),以下是基本的一些属性:

width <length>: 矩形的宽度。
height <length>: 矩形的高度。
radiusX <length>: 圆角矩形,圆角在X轴椭圆半径的弯道,此值四舍五入。
radiusY <length>: 圆角矩形,圆角在y轴椭圆半径的弯道,此值四舍五入。
rotation <Number>: 旋转角度,正数为顺时针,负数为逆时针。
scaleX <Number>: x轴缩放,1为100%。
scaleY <Number>: y轴缩放,1为100%。
visible <Boolean>: 可见性。

Ellipse椭圆(圆形),以下是基本的一些属性:

width <length>: 椭圆的宽度。
height <length>: 椭圆的高度。
rotation <Number>: 旋转角度,正数为顺时针,负数为逆时针。
scaleX <Number>: x轴缩放,1为100%。
scaleY <Number>: y轴缩放,1为100%。
visible <Boolean>: 可见性。

Line直线,以下是基本的一些属性:

xFrom <Number>: X轴起点,默认为0。
yFrom <Number>: y轴起点,默认为0。
xTo <Number>: X轴终点,默认为0。
yTo <Number>: y轴终点,默认为0。
rotation <Number>: 旋转角度,正数为顺时针,负数为逆时针。
scaleX <Number>: x轴缩放,1为100%。
scaleY <Number>: y轴缩放,1为100%。
alpha <Number>: 不透明度,1为100%。
visible <Boolean>: 可见性。

FXG的复杂图形使用Path来绘制。

以下是一个尖角向下的红色三角形的绘制(其主要通过节点坐标来绘制):
<Path data="M 0 0 L 100 0 L 50 100 Z">
    <fill>
        <SolidColor color="#FF0000"/>
    </fill>
</Path>


P.S. data中M表示起始位置,Z表示返回到起始位置。

来自http://flex4jiaocheng.com/blog/272
分享到:
评论

相关推荐

    Flex4 Spark皮肤

    本篇文章将详细介绍如何利用Flex4中的Spark Skin进行控件样式的自定义。 #### 二、Spark Skin与Skin类的关系 在Flex4中,`spark.skins` 包含了一个核心类 `SparkSkin`。`SparkSkin` 是一个继承自 `Group` 类型的...

    FLEX4的皮肤skin

    在Flex 4中,皮肤(Skin)是一种强大的机制,用于改变和定制UI组件的外观和交互体验。本文将深入探讨FLEX4中的皮肤系统,特别是SparkSkin类,并通过实例展示如何创建和应用自定义皮肤。 1. SparkSkin的介绍: ...

    Flex4的皮肤文档及demo

    通过以上内容,我们可以了解到在Flex4中如何利用`SparkSkin`和`Skin`类来定制组件的外观,以及如何将自定义皮肤应用到实际项目中。这对于初学者来说是一个很好的起点,能够帮助他们理解Flex4的皮肤机制,并进一步...

    Flex4皮肤资料

    在Flex4中,皮肤(skin)是一种用于控制UI组件外观的设计模式,允许开发者和设计师定制组件的视觉表现,而不必触及组件的核心功能代码。这不仅提高了开发效率,还实现了设计与逻辑的分离,使得UI设计更加灵活且易于...

    Flex4中头部背景图片的Accordion

    在Flex4中,Accordion组件属于`spark.components`包。 #### 栢心知识点二:自定义Accordion头部样式 在Flex4中,可以通过多种方式来自定义Accordion头部的样式。其中一种方法是使用`headerStyleName`属性结合...

    flex皮肤flex皮肤

    在Flex中,皮肤是可定制的外观组件,允许开发者根据项目需求改变控件的视觉表现。 1. **什么是Flex皮肤?** Flex皮肤是Flex组件的外观表示,它可以改变组件的颜色、形状、大小等视觉元素。通过更换皮肤,开发者...

    Flex各种超酷实例代码大全

    ### FlexGumbo中利用自定义Button和TextInput 在Flex开发中,自定义控件样式是一项非常实用的功能,它可以让你根据自己的需求来调整界面的外观和感觉。在这个例子中,我们学习如何在Flex Gumbo(Flex的一个版本)中...

    FLEX4的皮肤制作教程

    ### FLEX4的皮肤制作教程 #### 一、SparkSkin介绍 ...综上所述,SparkSkin和Skin是Flex 4中非常重要的概念,它们提供了强大的工具来定制UI组件的外观。通过理解和掌握这些技术,可以显著提升应用程序的用户体验。

    flex皮肤学习

    2. **Spark Skin**:Spark皮肤是Flex 4引入的新概念,支持更灵活的组件外观定制,它基于组件的状态来改变皮肤的显示。 3. ** Halo Skin**:Halo皮肤是Flex 3时代的皮肤体系,适用于较旧的组件,相对简单,但定制程度...

    FLEX4 皮肤制作教程

    - SparkSkin是Adobe Flex 4 (Gumbo)框架中的一个关键类,用于自定义用户界面(UI)组件的外观。它提供了一种机制,允许开发者通过XML或者ActionScript对控件的外观进行高度定制。 - SparkSkin类位于`spark.skins`...

    flex skinning 机制实践

    Flex Skinning机制是Adobe Flex框架中的一个重要特性,它允许开发者为UI组件自定义外观和行为,从而实现应用程序的独特设计和交互体验。通过深入理解并实践Flex Skinning,开发者可以更灵活地控制用户界面的视觉样式...

    Flex 4.1 语言参考

    - 样式表(CSS)和皮肤类(Skin Class)可以独立于组件代码定义,实现外观的可复用和可扩展性。 7. **模块化开发**: - Flex支持模块化,可以将大型应用程序拆分为多个模块,按需加载,提高启动速度。 - Module ...

    Spark皮肤相关文档

    Spark皮肤机制为开发者提供了高度定制化的界面设计能力,不仅可以改变组件的外观,还能根据组件的不同状态动态调整界面元素。通过遵循上述的最佳实践,开发者可以更加高效地开发出既美观又功能强大的用户界面。同时...

    ArcGIS Flex API—高级篇

    皮肤设计在ArcGIS Flex API中非常重要,它能够帮助用户定制UI的外观和感觉。 - **Spark框架**:Spark框架将视图(View)、模型(Model)和控制器(Controller)分离,提高了代码的复用性和维护性。 - **组件**:...

    如何定制FlexViewer_的ScaleBar(比例尺)外观

    4. **Skinning**:Flex中的一种技术,允许开发者通过创建新的皮肤文件来自定义组件的外观。 #### 三、定制ScaleBar的步骤 ##### 1. 创建ScaleBarSkin.mxml文件 ScaleBar的外观定制主要通过创建一个新的皮肤文件来...

    ActionScript_ItemRenderer

    在ActionScript中,ItemRenderer是一种关键的组件,用于在数据驱动的UI组件中自定义数据项的显示方式。本教程将深入探讨如何创建和使用ActionScript自定义ItemRenderer,以及如何实现与上一个示例相同的效果。 首先...

Global site tag (gtag.js) - Google Analytics