如前所述,Flex 4 SDK 引入了许多使用新架构的新组件类,它们应当可以令外观和其他自定义操作更简单。下表列出了 Flex 3 MX 组件及其 Flex 4 Spark 对应组件:
FLEX 3 MX 组件
FLEX 4 BETA SPARK 组件
mx.controls.Button |
spark.components.Button |
mx.controls.ButtonBar |
spark.components.ButtonBar |
mx.controls.CheckBox |
spark.components.CheckBox |
mx.controls.ComboBox |
spark.components.DropDownList(不可编辑) |
mx.controls.HorizontalList |
spark.components.List(带一个 HorizontalLayout) |
mx.controls.HRule |
spark.primitives.Line |
mx.controls.HScrollBar |
spark.components.HScrollBar |
mx.controls.HSlider |
spark.components.HSlider |
mx.controls.Image |
spark.primitives.BitmapImage(不支持外部图像) |
mx.controls.LinkBar |
spark.components.ButtonBar(带一个自定义外观) |
mx.controls.LinkButton |
spark.components.Button(带一个自定义外观) |
mx.controls.List |
spark.components.List |
mx.controls.NumericStepper |
spark.components.NumericStepper |
mx.controls.RadioButton |
spark.components.RadioButton |
mx.controls.RadioButtonGroup |
spark.components.RadioButtonGroup |
mx.controls.TextArea |
spark.components.TextArea |
mx.controls.TabBar |
spark.components.TabBar |
mx.controls.TextInput |
spark.components.TextInput |
mx.controls.TileList |
spark.components.List(带一个 TileLayout) |
mx.controls.ToggleButtonBar |
spark.components.ButtonBar |
mx.controls.VideoDisplay |
spark.components.VideoPlayer |
mx.controls.VRule |
spark.primitives.Line |
mx.controls.VScrollBar |
spark.components.VScrollBar |
mx.controls.VSlider |
spark.components.VSlider
|
mx.core.Application |
spark.components.Application |
mx.core.Window |
spark.components.Window |
mx.core.WindowedApplication |
spark.components.WindowedApplication |
mx.containers.ApplicationControlBar |
spark.components.Application(带 controlBarContent) |
mx.containers.Canvas |
spark.components.Group |
mx.containers.ControlBar |
spark.components.Panel(带 controlBarContent 属性) |
mx.containers.HBox |
spark.components.HGroup |
mx.containers.Panel |
spark.components.Panel |
mx.containers.Tile |
spark.components.Group(带一个 TileLayout) |
mx.containers.VBox |
spark.components.VGroup |
Adobe 鼓励您与 Spark 组件一起使用 MX 组件和容器。由于 Adobe 在同一基类 (UIComponent) 上构建组件,Spark 与 MX 之间应当可以实现全面的可互操作性。下表列出了目前没有 Spark 直接等效类的组件和容器。
FLEX 3 类,没有直接的 FLEX 4 BETA 对应类
mx.controls.Alert |
mx.controls.ColorPicker |
mx.controls.DataGrid |
mx.controls.DateChooser |
mx.controls.DateField |
mx.controls.Menu |
mx.controls.MenuBar |
mx.controls.PopUpButton |
mx.controls.PopUpMenuButton |
mx.controls.ProgressBar |
mx.controls.RichTextEditor |
mx.controls.Tree |
mx.containers.Accordion |
mx.containers.DividedBox |
mx.containers.Form |
mx.containers.Grid |
mx.containers.TabNavigator |
mx.containers.TitleWindow |
mx.containers.ViewStack |
要将 MX 导航器(ViewStack、Accordion、TabNavigator)用于 Spark 组件,导航器的子代应当是一个 NavigatorContent 组件。否则,您无法在 MX 导航器中使用 Spark 基元。此处是一个示例:
<mx:ViewStack id="vs" selectedIndex="{tb.selectedIndex}">
<s:NavigatorContent label="bar">
<s:layout>
<s:VerticalLayout />
</s:layout>
<s:Label text="bar" />
<s:TextInput />
</s:NavigatorContent>
</mx:ViewStack>
http://www.adobe.com/cn/devnet/flex/articles/flex3and4_differences_04.html
分享到:
相关推荐
- **新的视觉组件**:Flex4新增了一系列视觉上更为现代化的组件,满足了更多设计需求。 ### Spark vs Halo - **MX(Halo体系)**:这是Flex 3中使用的组件体系结构,其中每个组件包含了行为、布局、样式和皮肤四个...
- **Spark动画和特效组件**:Flex 4在Spark架构下新增了专门用于创建动画和特效的组件,这些组件利用了Flash Player 10的强大功能,从而可以实现更加流畅和细腻的视觉效果。 - **Pixel Bender集成**:Pixel Bender是...
- Flex 4在Flex 3的基础上增加了许多新特性,提升了开发效率和用户体验。 1. Flex的技术特点: - **增强用户体验**:通过创建个性化的多媒体应用程序,提升用户与Web的交互体验。 - **完善的开发环境**:提供了...
2. 弹性项和容器:容器设置flex属性控制子元素的行为,子元素使用flex属性调整自身大小。 3. 自动对齐:justify-content、align-items和align-self属性用于控制元素在主轴和侧轴上的对齐方式。 4. 弹性比例:flex-...
CSS3不仅在样式设计上提供了更多的选择,例如新增了多种选择器(如属性选择器、伪类和伪元素),还引入了过渡(Transitions)、动画(Animations)和变形(Transforms),使得网页元素的动态效果更加丰富。CSS3的...
Spark组件是Flex4中新增的,设计更为现代,侧重于性能优化和模块化。MX组件则沿用了Flex早期的组件结构,适用于向后兼容的需求。两者在样式和皮肤的使用上存在差异,Spark采用了更加灵活的样式系统。对于容器组件,...
Spark 组件是 Flex4 中新增的,位于 `spark.*` 包下,而 MX 组件是 Flex 之前的版本中定义的,位于 `mx.*` 包下。Spark 组件强调样式和皮肤的分离,提供更现代的外观和布局方式,而 MX 组件则保留了传统的数据可视化...
- **新增的移动组件**: Flex 新增了一组专门为移动设备设计的组件,帮助开发者更快速地构建符合移动设计模式的应用程序。 - **Flash Builder 的更新**: Flash Builder 增加了大量新功能,如针对不同移动平台(如 ...
它通过flex属性(如flex-grow、flex-shrink和flex-basis)控制元素的弹性,以及align-items、justify-content等属性控制容器内元素的对齐方式。 Bootstrap是最流行的开源前端框架,它包含了一系列预设的CSS样式、...
### FLEX4的皮肤制作教程 #### 一、SparkSkin介绍 ...综上所述,SparkSkin和Skin是Flex 4中非常重要的概念,它们提供了强大的工具来定制UI组件的外观。通过理解和掌握这些技术,可以显著提升应用程序的用户体验。
- **Window 容器**: 管理多个窗口之间的交互和布局。 #### 5. 窗体(Windows)和菜单 - **窗体基础**: 窗体是 AIR 应用程序的基础组成部分,用于展示内容和接收用户输入。 - **创建和控制窗体**: 学习如何创建新的...
- Window 容器: 管理多个窗口或面板之间的交互。 - **命令行工具**: 除了使用 Flex Builder 或 Flex SDK 外,还可以通过命令行工具来管理 AIR 应用的构建过程。 - amxmlc 编译器: 用于编译程序代码。 - acompc ...
- **新增组件**:随着EXT的发展,不断有新的组件被引入,如Calendar、Map等。 - **组件特性**:介绍了这些新组件的特点和应用场景。 #### 29. EXT2简介 - **版本历史**:简要回顾了EXT2版本的历史背景和发展历程。 ...
- **数据访问层新增OXM功能**:提供了对象与XML之间的映射支持。 - **Web层的增强**:改进了 Spring MVC 和 RESTful Web 服务的支持。 - **其他改进**:例如安全性增强、性能优化等。 - **1.6 Spring对Java版本...
- 弹性盒布局模型(Flexible Box),通过`display: flex`或`display: inline-flex`实现更加灵活的容器内元素布局。 8. **Grid布局** - CSS Grid布局提供二维网格系统,用`grid-template-columns`、`grid-template...
55. 伪元素::before和:before的区别是,::before是CSS3中的新语法,而:before是CSS2中的老语法。 56. 伪类:first-child与:first-of-type的区别是,:first-child是选择父元素的第一个子元素,而:first-of-type是选择...