- 浏览: 51008 次
- 性别:
- 来自: 大连
最新评论
-
zhangshoukai:
任何问题都应该从两个角度看,lz是个心态比较积极的人,希望大家 ...
[RIA]HTML5怎么就成了RIA“杀手”? -
xiangkun:
brightACE 写道在嵌入SWF的html里面加入如下的功 ...
[Flex]Flex编程注意之自动获取焦点、监听全局键盘事件 -
f1120:
2012就世界末日了,还想到2022
[RIA]HTML5怎么就成了RIA“杀手”? -
TonyLian:
2022年??
[RIA]HTML5怎么就成了RIA“杀手”? -
namespace:
关于网页里获得焦点,真是帮了大忙了。
[Flex]Flex编程注意之自动获取焦点、监听全局键盘事件
详细请看:http://www.k-zone.cn/zblog/post/flash-builder-gumbo-customer-sparkskin-4.html
通过《Flex SDK 4(Gumbo)更方便的自定义样式、自定义SparkSkin》这三篇文章,我们可以得到一个结论:Spark组件和Halo组件是可以共享、公用一套皮肤的。
本篇文章,让我们分析一下Flex SDK 4(Gumbo)里面的默认皮肤式样(主要是Spark组件和Halo组件)。
通过分析Flex SDK 4(Gumbo)默认的皮肤,有助于我们理解、学习如何使用SparkSkin、Skin等方式制作皮肤。
下图所示了全部的Flex SDK 4(Gumbo)CSS样式:
sdks\4.0.0\frameworks\themes目录下面的内容就是Flash Builder 4 新增的主题(theme)样式所在的位置。
包括:AeonGraphical、Halo、HaloClassic、Ice、Institutional、Smoke、Spark、Wireframe、Wooden等主题。
我们比较常用的是:Halo、HaloClassic、Spark这三种主题样式。
在\sdks\4.0.0\frameworks\projects如下的三个文件夹:
halo、haloclassic、sparkskins、wireframe这四个文件夹里面的内容是对应theme文件中四种样式的源代码。
在\sdks\4.0.0\frameworks\projects下面有一个叫做sparkskins的文件夹,它里面的内容做什么的呢?仔细看一下其中的路径:
sdks\4.0.0\frameworks\projects\sparkskins\src\mx\skins\spark
通过这个路径(mx\skins)就可以看出这个文件夹中的内容是关于Halo组件的皮肤文件。
sdks\4.0.0\frameworks\projects\sparkskins\src\mx\skins\spark包括如下的文件:
AccordionHeaderSkin.mxml、BorderSkin.mxml、ButtonBarFirstButtonSkin.mxml、ButtonBarLastButtonSkin.mxml、ButtonBarMiddleButtonSkin.mxml
.........
我们随便打开一个,例如ButtonSkin.mxml。
<?xml version="1.0" encoding="utf-8"?>
<!--
ADOBE SYSTEMS INCORPORATED
Copyright 2008 Adobe Systems Incorporated
All Rights Reserved.
NOTICE: Adobe permits you to use, modify, and distribute this file
in accordance with the terms of the license agreement accompanying it.
-->
<!--- The Spark skin class for the Halo Button component. -->
<local:SparkSkinForHalo xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:local="mx.skins.spark.*" minWidth="21" minHeight="19" alpha.disabled="0.5">
...............................................................................................................................................................
看着是不是很眼熟?“The Spark skin class for the Halo Button component”说明这是Spark Skin应用于Halo组件的皮肤文件。
不过有一个有意思的地方,我在sdks\4.0.0\里面没有找到关于这套组件相应的CSS文件,也就是当我们使用Flex SDK 4(Gumbo)里面的Halo组件时,并没用使用
sdks\4.0.0\frameworks\projects\sparkskins\src\mx\skins\spark里面的内容作为默认皮肤。
Flex SDK 4(Gumbo)里面的Halo组件默认使用了sdks\4.0.0\frameworks\projects\halo\src\mx\skins\halo下面的皮肤,也就是用传统方式制作的皮肤。
总结一下,比较重要的三套皮肤所在的位置:
Spark组件默认皮肤的位置:
sdks\4.0.0\frameworks\projects\flex4\src\spark\skins\default
Halo组件默认皮肤的位置:
sdks\4.0.0\frameworks\projects\halo\src\mx\skins\halo
Spark skin for Halo皮肤的位置:
sdks\4.0.0\frameworks\projects\sparkskins\src\mx\skins\spark
那么我们如何使用Spark skin for Halo皮肤呢?请看以下代码:
<fx:Style>
Button {
skin: ClassReference("mx.skins.spark.ButtonSkin");
}
</fx:Style>
<mx:Button label="我是halo组件" />
其中引入的位置:mx.skins.spark.ButtonSkin,而mx.skins.spark.*包里面的内容对应了sdks\4.0.0\frameworks\projects\sparkskins\src\mx\skins\spark。
以上就是关于Flex SDK 4(Gumbo)里面默认的一些皮肤,希望对大家有所帮助。
发表评论
-
Flash Player 10.1 and AIR 2.0 消息汇总
2009-11-18 09:03 1223详细请看:http://www.k-zone.cn/zblog ... -
Kenshin走进哈工程
2009-11-18 09:00 1044详细请看:http://www.k-zone.cn/zblog ... -
Adobe Flex
2009-11-10 08:21 1140详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Flash Builder Beta 2 and Flash Catalyst Public Beta 2 download
2009-10-09 10:48 1108详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Flash Builder Beta 2 serial number(sn)
2009-10-09 10:47 1316详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Adobe BrowserLabe
2009-09-03 08:07 1129详细请看:http://www.k-zone.cn/zblog ... -
[Flex]构建基于Flex技术的Blog程序(一)
2009-09-01 08:08 2075详细请看:http://www.k-zone.cn/zbl ... -
[Flex]用编程的方式来写CSS - LESS的应用(一)
2009-08-07 11:17 1218详细请看:http://s.k-zone.cn/less1 ... -
[Flex]Flex SDK 4(Gumbo)浅析ASDoc - ASDoc MXML应用篇
2009-08-06 14:18 1476详细请看:http://s.k-zone.cn/asdoc3上 ... -
http://www.k-zone.cn/zblog/post/silvergreen.html
2009-07-31 15:31 1071详细请看:这是完全基于Flex SDK 4(Gumbo)基础上 ... -
[Flex]Flex SDK 4(Gumbo)浅析ASDoc - ASDoc Tags参数篇
2009-07-30 17:32 1270详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Flex SDK 4(Gumbo)浅析ASDoc - Flash Builder 4配置篇
2009-07-29 10:07 1110详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Flex SDK 4(Gumbo)自定义皮肤 - SilverGreen(Spark和Halo)预览版
2009-07-27 08:04 976详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Flex SDK 4(Gumbo)自定义皮肤 - SilverGreen(Spark和Halo)预览版
2009-07-27 08:02 1153详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Flex SDK 4(Gumbo)改善的Layout和Scroller(二)
2009-07-16 13:07 1110详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Flex SDK 4(Gumbo)改善的Layout和Scroller(一)
2009-07-15 18:12 1394详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Flex SDK 4(Gumbo)更方便的自定义样式、自定义SparkSkin(二)
2009-07-06 09:39 782详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Flash Builder 4 编辑器配色方案 - 黑色系
2009-07-02 20:36 1820详细请看:http://www.k-zone.cn/zblog ... -
[Flex]Flex SDK 4(Gumbo)更方便的自定义样式、自定义SparkSkin(一)
2009-06-30 09:38 812在Flex SDK 4(Gumbo)新增加了一个包:spark ... -
[RIA]HTML5怎么就成了RIA“杀手”?
2009-06-25 13:27 2152详细请看:http://www.k-zone.cn/zbl ...
相关推荐
此外,Flex4中MX组件的默认主题已更改为Spark主题,这可能会影响应用程序的外观和感觉。不过,Flex4仍然保留了Flex3的Halo主题,可以通过设置编译参数来恢复Flex3的外观。 ### 总结 Flex4与Flex3之间的主要区别...
1. **Spark组件模型**:Flex 4引入了Spark组件模型,提供了一套全新的组件设计和实现,强调了外观和行为的分离,增强了组件的可定制性。 2. **Gumbo CSS3样式支持**:引入了更强大的样式系统,支持类似于CSS3的属性...
Flex 4,也被称为Gumbo,是Adobe Flex框架的一个重大更新,它引入了许多关键变化以提升RIA(Rich Internet Applications)的开发效率和用户体验。以下是Flex 4中的十大变化的详细说明: 1. **Adobe Catalyst集成**...
3. **Spark组件架构**:Flex 4引入了全新的Spark组件架构,相较于Flex 3的 Halo 组件,Spark组件更注重设计模式和组件重用。Spark组件支持自定义样式和主题,提供了更好的性能和更丰富的用户界面。 4. **Gumbo架构*...
在Flex4中,最重要的变化之一是引入了Spark组件模型,它替代了原有的 Halo 组件模型。Spark组件模型提供了更现代、可自定义的设计,允许开发者创建更加美观且交互性更强的用户界面。Spark组件库包括了一系列基本和...
2. **Flex 4**:Flex 4,又称为Gumbo,是Flex框架的一个重大更新。它引入了全新的Skinning和Component架构,使得开发者可以更加灵活地定制UI组件,创建出更具视觉冲击力的应用。Spark组件库取代了原有的MX组件,带来...
Flex4相较于之前的版本,主要改进在于更强大的Flex SDK,引入了全新的Spark组件架构,这允许开发者更好地控制应用的外观和行为。Spark组件模型比以往的MX组件模型更加灵活和可定制化,允许设计者通过CSS样式和MXML来...
Flex 4,也被称为Gumbo,是Adobe Flex框架的一个重大更新,它引入了许多新特性,提高了开发人员构建富互联网应用程序(RIAs)的效率。Flash Builder 4是用于开发Flex和ActionScript应用的主要集成开发环境(IDE),...
4. **Gumbo**:Flex 4的早期代号,它引入了新的皮肤层(Skinning)和样式(Styling)机制,使得开发者可以更自由地定制组件外观,而无需深入到组件内部代码。 5. **Flex Builder**:Adobe的IDE,为Flex 4开发提供了...
1. **Flex 4概述**:Flex 4引入了全新的Spark组件模型,与之前的 Halo 组件相比,Spark组件更加轻量级,可定制性更强,设计时支持皮肤和样式分离,极大地提高了UI设计的灵活性。此外,Flex 4还引入了ActionScript ...
SparkSkin是Flex 4(Gumbo)引入的主要皮肤类,位于`spark.skins`包下。它是一个Group类型的容器,这意味着你可以直接添加图形元素和子组件来构建皮肤。SparkSkin是所有Spark可视组件外观的基础,涵盖了mx.spark包中...
2. **Spark Components**:Flex 4引入了一套全新的组件库——Spark Components,与传统的 Halo Components 相对。Spark组件以其灵活性、可定制性和高性能而著称,支持自定义样式和皮肤,使得开发者可以创建独特的...
Spark组件基于Flex4的图形渲染引擎——Gumbo,允许开发者自定义组件外观和行为,提供了更丰富的UI设计可能性。例如,Button、Label、Accordion、TabNavigator等都是常用的Spark组件,它们可以通过MXML或ActionScript...
1. **Spark组件模型**:与Flex 3中的 Halo 组件不同,Flex 4引入了Spark组件模型,它基于CSS样式和MXML组件设计,提供了更高级别的定制性和视觉表现力。 2. **ActionScript 3.0强化**:Flex 4基于ActionScript 3.0...
1. **组件体系结构的改变**:Flex4引入了Spark组件架构,与之前的 Halo 组件架构并行存在。Spark组件更加模块化,允许开发者自定义组件样式和行为,提供了更好的性能和可扩展性。 2. **Skinning和Styling**:在Flex...
1. **Flex 4架构**:了解Flex 4的Spark和Gumbo架构,包括新的组件模型、样式系统和数据绑定改进。 2. **ActionScript 3.0**:掌握ActionScript的基础,它是Flex的主要编程语言,与Flex 4的API交互。 3. **MXML**:...
总的来说,Flex 4是一个强大且灵活的RIA开发工具,其Spark组件模型、Gumbo架构和Stage3D等特性,为开发者提供了构建高质量、高性能Web应用的可能性。配合权威指南,无论是初学者还是有经验的开发者,都能从中...
1. **Spark组件体系**:Flex 4引入Spark组件代替了原来的 Halo 组件,这些组件设计更为灵活,允许开发者自定义样式和行为。书中会详细介绍如何使用和定制Spark组件,如Button、Label、Canvas等。 2. **MXML与...
1. **Flex 4框架**:Flex 4,又称为Gumbo,是Adobe Flex SDK的第四个主要版本。它引入了全新的Spark组件模型,与原有的MX组件模型并存。Spark组件设计更为灵活,允许开发者自定义外观和行为,同时提供了更好的性能...
Flex 4,也称为Gumbo,是Adobe Flex SDK的一个重大更新,引入了Spark组件模型和FXG图形格式,为开发者提供了更多的设计自由度和性能提升。 集成Cairngorm 2.2.1与Flex 4时,首先需要确保你已经正确安装了Flex ...