*Flex 的基础架构
关于 flex 基本上常被问到的不外乎就是“如何可以学好它?”,要了解这个问题的答案基本上只要看懂下面这个图就OK了。
*Actionscript 该学的重点
从最底层看起,最下面的 actionscript 3是一切的基础,它是 flash/flex 编程使用的唯一程式语言,因此任何人想学好 flex 第一件事绝对是先摸熟 actionscript 这个语言,包含:
1. 它的基本语法与结构(array, hash, loop, if else…)
2. DisplayList (DisplayObject, DisplayObjectContainer)与 Event system(bubbling, propagating…)
3. Sound, Video, NetConnection 与 Graphics class
掌握 as3 的精华后,接下来就可以进入 flex framework。
*Flex framework 的重点
基本上 flex framework 就是用 actionscript 写成的框架,因此也可以把它看成是 as3的最好示范,看着 framework source 学 actionscript 也是挺不错的,只是路会变很长。
Flex Framework 整个体系非常博大精深,通常一般人不太可能完整把它学完,只需要针对最常用到的部份熟悉就好,图中列出的那三块(component, managers, style/skin)就是我个人认为所有初学者最优先该学会的。
*Component 该学些什么
Component 是整个 flex framework 的基础,几乎80% 的元素都是由 UIComponent 继承而来,例如最根本的它本身就是一个 UIComponent,因此,熟悉 component 就成为学好 flex framework 最根本也最重要的基本功
Flex 内建了 二十几个 UI controls, 例如 Button, DataGrid, HBox等,以种类来分,这些 components 可以概分为三大类:
• Controls: Button, DateChooser, Slider…
• Containers: Box, DividedBox, Panel…
• List: DataGrid, Tree, TileList…
初学者第一步至少该学会怎么用这些元件,了解每个元件的 properties, events, styles, effects…,知道怎么在手册里查它的 API 文件,以及何时该用何种元件。
进一步,则是学会怎么修改这些元件,例如继承一个 Button 下来加上不同的功能,或是写不同的 skin border 来改变它的外观。
再进一步,则是开始研究元件的生命周期,了解每个元件是何时初始化,元件内部有那些关键指令与它们个别的功能,然后可以试着建立自已的 custom component。
这一关看起来容易但实际上最困难,因为 flex 的 component framework 写的非常庞大,虽然乱中有序但要在混沌中看出隐藏的架构然后抓住重点整串提起,就非得有人带着指引正确的途径才比较可能完成。
*manager 是什么
图中最上方的第二块就是 manager。
flex 里有很多的 managers,负责做各种不同的工作(废话…),几个比较重要的包含:
• SystemManager:
它是每个 flex 程序的根源,最先被下载,也最早启动,由它进行一连串的 app boot流程
• StyleManager:
它负责整支app 的 css style 套用与 skin 生成,如果想玩动态 css 载换也靠它
• DragManager:
Flex最大的卖点就是 drag and drop(拖放),这个 manager 就是背后的英雄,初学者至少要学会怎么处理 drag 行为的五个事件,以及如何在不同元件间做拖放;进阶的玩家则应该深入研究这支 manager 是怎么写成的,详细阅读它的 source 会得到意想不到的无穷乐趣(如果你读完却没有这种感觉,呃,那代表你该再多读几次,如果还是没有,那请私下联络我 )
• ModuleManager:
使用 Flex 开发大型应用程式时,往往会将程式切割成许多小的 module, 这个 manager 就是负责载入并管理所有的 module (包含它的 class partition),初心者或许用不到,但有志深入的玩家一定要很熟。
• CursorManager:
这个用到的时机不是很多,但偶尔要换一下 cursor 时还是会用到,初学者至少要知道怎么用指定的图案去换掉系统cursor。
*Style/Skin 的重点
CSS style 与 skinning 是 Flex 最大的卖点之一,也是开发过程中较为麻烦也最耗时的部份。
初学者应该要彻底了解如何使用 CSS style 来打点一支 flex app 的外观,换颜色、素材,使用外部 assets 修饰介面。
中阶玩家则应该了解 skinning 的系统,包含 programmatic skinning 与 graphical skin,它们俩的差别?使用时机?如何客制化(zrong注1)?
更高阶的玩家则应该熟悉整个 Styling system 的运作模式,外加如何动态载入 css 在 runtime 换掉整个介面。
简而言之,flex app 写的好不好,外行人其实看不太出来,但一支 app UI 美不美则是一翻两瞪眼,比较漂亮的那就先加十分
(当然,有一种情况是刻意用心去美化了介面结果弄巧成拙搞的怨声载道人人喊打,但那种比较不多见,也不是每家公司都会搞到这步田地,就先不讨论)
*学完基本功后下一步
在我的标准里,当一个 developer 对上图内每一块都有中等程度的了解后,就算是完成 flex 养成教育,可以迈向下一个阶段。
也就是开始熟悉 application 的制作手法,这包含
• 了解至少一种以上的开发框架,例如 Cairngorm,老实说我对这个框架没什么好感(因为手法太复杂,只适合超复杂登月计画或火星探勘时使用),但它结构设计良好,又是业界公认的圣杯,等于是专家们共通的语言,因此至少要先了解它在做什么,将来在专业场合才好沟通(俗话说 know the rules so you know what you are breaking, 就是指这情况)
• 接着可以看看比较简单的手法,像 Riawave, Model-Glue:Flex, PureMVC…等,基本上这些框架设计方式都大同小异,每个都有不同的应用场合,可以挑一个喜欢的再自行修改。
• 了解基本的概念,例如 Value Object, DAO, MVC 等,它们在大部份的程式框架里都会出现,早点学会日子比较轻松。
• 接着就是开始实际 coding,写一个中小型规模的app,不论是单纯的 CRUD (zrong注2)程序,或是留言版、电话簿、进销存管理都可以,籍由多写来强化编程的概念,然后透过大量的 peer code review 来找出可改进的地方。
*结论
结论还是老话一句:要入门 flex 超级简单,只要不是白痴应该一小时就行,但要成为可独当一面的专业开发者,路就很长,如果没有走对方向很容易就迷失甚至最后放弃。
换句话说,要能成为职场上真正需要的 professional developer,并不如表面上想象的容易(其实我想每种技术领域跟产业都一样吧),这也是我过去半年来协助很多公司做 recruiting 后的感想。
- 大小: 25.5 KB
分享到:
相关推荐
13. **Flex的最佳实践**:包括代码组织、性能优化、错误处理和调试技巧,这些都是开发者在学习Flex过程中需要掌握的重要知识。 综上所述,"Flex3学习指南1-8"这个压缩包文件包含了Flex 3从基础到深入的多个章节,...
是学习Flex4中文版这本书的代码,可以参考代码去学习
10. **最佳实践和设计模式**:学习Flex的过程中,了解和应用设计模式,如MVC(模型-视图-控制器)模式,可以帮助编写出可维护、可扩展的代码。 通过这份"Flex中文帮助"资料,你可以系统地学习Flex的基础概念、编程...
在“学习flex基础知识”这个主题中,我们首先需要理解Flex的基本概念。Flex框架包括了开发工具、运行时环境和组件库。开发工具如Adobe Flex Builder或IntelliJ IDEA等,提供了一整套集成开发环境(IDE)来编写、调试...
在学习Flex时,掌握以下几个关键知识点至关重要: 1. **ActionScript**: Flex的主要编程语言,是一种面向对象的语言,基于ECMAScript。学习ActionScript意味着理解类、对象、继承、包、事件处理等概念。 2. **MXML...
在学习Flex中文帮助时,开发者应关注以下几个关键点: 1. **基础概念**:理解ActionScript的基础语法、变量、函数、类和对象等概念,以及MXML的元素和属性。 2. **组件使用**:熟悉Flex提供的各种组件,学习如何在...
本教程将带你逐步学习Flex,从开发环境的安装到基础概念的理解,再到实际案例的实践。 一、开发环境安装 在开始Flex学习之前,首先需要安装开发工具——Adobe Flex Builder或Apache Flex SDK。Adobe Flex Builder是...
学习了一段时间的flex... 上传点资源,大家分享。 flex,怎么学习flex,Flex_3_Cookbook_中文版
【如何学习Flex,从0开始】 Flex是一种基于Adobe Flash技术的开发框架,主要用于构建富互联网应用程序(RIA)。学习Flex需要掌握ActionScript 3(AS3)语法和Flex框架,包括组件、管理器和样式/皮肤等方面。以下是...
标题中的“这两天学习flex同时,用flex做的一个记账本、图片相册”揭示了本文主要涉及的技术领域是Adobe Flex,这是一种基于ActionScript和MXML的开源框架,用于构建富互联网应用程序(RIA)。Flex提供了丰富的用户...
通过源码学习Flex4:Adobe Flex 4 Vol.1,这一资源为开发者提供了一个深入了解Adobe Flex 4框架内部机制的机会。Adobe Flex是一个用于构建和部署跨浏览器、跨平台的富互联网应用程序(RIA)的开源软件框架。它由...
通过这个"Flex学习大礼包",你可以系统地学习Flex开发,从基础概念到高级特性,再到实战经验,全面提升自己的Flex技能。无论你是初学者还是有一定经验的开发者,都能从中受益匪浅。在学习过程中,结合实际操作,理论...
这份教程包含了从基础到高级的全方位学习内容,是学习Flex开发的宝贵资料。 教程的第一部分,即“第一套”资源,可能是对Flex开发环境的介绍,包括安装Adobe Flex Builder或Flex SDK,设置开发环境以及理解Flex项目...
本学习资料集全面覆盖了Flex4的基础与进阶知识,是学习Flex4开发的理想资源。 1. **基础概念** - **ActionScript 3.0**:Flex4的核心编程语言,具有面向对象的特性,性能比Flex3中的ActionScript 2.0显著提升。 -...
学习Flex首先要了解这两种语言的使用和相互配合。 2. **Flex SDK与Flex Builder**:Flex SDK是开发Flex应用的基础工具,包含了编译器和库。Flex Builder(现已被Adobe Flash Builder取代)是一个集成开发环境,提供...
在开始学习Flex之前,你需要对基础的编程概念有所了解,包括变量、数据类型、控制结构(如循环和条件语句)、函数等。此外,熟悉ActionScript,它是Flex的核心编程语言,基于ECMAScript,类似于JavaScript。你可以...
本文将深入探讨学习Flex所需掌握的关键知识点,包括ActionScript、Flex框架、组件、管理者以及样式与皮肤。 首先,ActionScript是Flex编程的核心。ActionScript 3.0(AS3)是Flash/Flex平台的基础,它是一种面向...
学习Flex布局
在学习Flex手绘笔源码的过程中,你会接触到以下几个关键知识点: 1. **MXML**:这是Flex的主要标记语言,用来描述用户界面组件的布局和外观。MXML文件通常包含UI控件的实例化,如Canvas、Button、TextInput等,并...