FlexLib --开源Flex UI组件库

       FlexLib由Doug McCune、Ted Patrick和Mike Chambers发起了一个开源的Flex组件库项目。该项目的目的是汇集Flex社区的努力为大家提供一个高质量的Flex UI组件库。

      目前Flex社区已经有多个开源的组件库项目了，如：flexBox、JAM、Flex cookbook、RIAForge以及CFFLEX，所以，在自己创建某一组件的之前，不妨先看看是否已经有人做了同样的工作，避免闭门造车。
     

      Flex官方主页：http://www.darronschall.com/weblog/2007/02/announcing-flexlib.cfm

      Flex组件库主页:http://code.google.com/p/flexlib/ 

      在线Demo:http://code.google.com/p/flexlib/wiki/ComponentList

    

     为便于阅览，分别转载官方的英文版和翻译的中文版：

     

英文版

FlexLib component list¶

This wiki page contains a list of all components contained in the current build of flexlib. After adding new components to FlexLib, you should edit this page and include a short summary of the component and the links to the ASDoc documentation and the sample SWF file, if available. Include the names of contributors for each component.

package: flexlib.controls¶

Base64ImageDocumentation | Example | Contributor: Stacy Young

An image component that renders base-64 encoded images.

 

CanvasButtonDocumentation | Example | Contributor: Doug McCune

The CanvasButton is an extension of Button that lets you set the contents of the Button to any UI components, as opposed to only a single icon and label like the normal Button control allows.

 

CanvasButtonAccordionHeaderDocumentation | Example | Contributor: Doug McCune

The CanvasButtonAccordionHeader allows you to use a CanvasButton component as the header renderer of an Accordion, meaning you have full control over the header renderer and can add additional UI control, etc.

 

ConvertibleTreeListDocumentation | Example | Contributor: Doug McCune

A control that combines the functionality of the Tree component and the List component. The ConvertibleTreeList allows you to use one control and have it display the dataProvider either as a Tree or as a List. You only have to set the dataProvider once. You can set the mode at any time to change the display mode.

 

Fire¶

A component to produce a simulated fire effect.

Documentation | Example | Contributor: Doug McCune

Highlighter¶

A component to highlight selected words or phrases within a text control

Documentation | Example | Contributor: Tom Lee

HSlider and VSlider¶

Alternatives to the HSlider and VSlider controls included in the Flex framework. This version of the HSlider and VSlider allows you to drag the region between the thumbs, if the slider has mutliple thumbs. If there is more than one thumb then the region between the leftmost thumb and the rightmost thumb is draggable.

Documentation | Example | Contributor: Doug McCune

IconLoaderDocumentation | Example | Contributor: Tobias Patton

The IconLoader component converts a Macintosh OS X (.icns) or Windows XP (.ico) icon file, along with its alpha mask, to a Flex 2 UIComponent.

 

ImageMapDocumentation | Example | Contributor: Doug McCune

The ImageMap control is an implementation of a client-side image map component, like it is supported in HTML.

 

PromptingTextInputDocumentation | Example | Contributor: Darron Schall

The PromptingTextInput component is a small enhancement to standard TextInput. It adds the ability to specify a prompt value that displays when the text is empty, similar to how the prompt property of the ComboBox behaves when there is no selected value.

 

PromptingTextAreaDocumentation | Example | Contributor: Darron Schall

The PromptingTextArea component is a small enhancement to standard TextArea. It adds the ability to specify a prompt value that displays when the text is empty, similar to how the prompt property of the ComboBox behaves when there is no selected value.

 

ScrollableArrowMenuDocumentation | Example | Contributor: Doug McCune

An extension of ScrollableMenu that uses two arrow buttons placed at the top and bottom of the menu for scrolling.

 

ScrollableMenuDocumentation | Example | Contributor: Doug McCune

An extension of mx.controls.Menu that allows the control to scroll vertically.

 

ScrollableMenuBarDocumentation | Example | Contributor: Doug McCune

ScrollableMenuBar is an extension of MenuBar that uses flexlib.controls.ScrollableMenu instead of using the original mx.controls.Menu. This allows us to specify a maxHeight for the ScrollableMenuBar and that maxHeight will be used to determine the maxHeight for all the menus that the component generates.

 

ScrollablePopUpMenuButtonDocumentation | Example | Contributor: Doug McCune

ScrollablePopUpMenuButton is an extension of PopUpMenuButton that uses flexlib.controls.ScrollableMenu instead of using the original mx.controls.Menu, which adds scrolling functionality to the menu.

 

SuperTabBarDocumentation | Example | Contributor: Doug McCune

The SuperTabBar control extends the TabBar control and adds drag and drop functionality and closable tabs. Used by the SuperTabNavigator.

 

TreeGridDocumentation | Example | Contributor: Yaniv De Ridder

A control that combines the functionality of the Tree component and the DataGrid component.

 

VerticalMenuBarDocumentation | Example Contributor: Doug McCune

A VerticalMenuBar control defines a vertical, top-level menu bar that contains one or menu items, just like the horizontal MenuBar control.

 

package: flexlib.containers¶

AdvancedFormDocumentation | Example | Contributor: Renaun Erickson

The Advanced Form component provides Reset, Undo and Redo functionality. Undo and Redo are accessed by pressing "ctrl-Z" and "ctrl-Y" respectively.

 

ButtonScrollingCanvasDocumentation | Example | Contributor: Doug McCune

This is a Container component that uses buttons placed over the edges of the container to do the scrolling of its children. These buttons can either scroll the children when the user moves the mouse over them, or via mouse click. The buttons can be fully skinned.

 

Docking ToolBar¶

The docking toolbar component collectively helps managing toolbars in an application. The toolbars can be docked to the top or bottom edges or kept floating within application area. The contents within a toolbar use a flow based layout approach.

Documentation | Example | Contributor: Adobe Flex Team (Bangalore)

DragScrollingCanvasDocumentation | Example | Contributor: Doug McCune

This is a Container component that allows the user to drag the contents to scroll the children, instead of or in addition to using the scrollbars.

 

HAccordion¶

A Horizontal Accordion component. Works exactly like the normal Accordion component, except the item headers are rotated and they cascade from left to right, instead of top to bottom.

Documentation | Example | Contributor: Doug McCune

FlowBoxDocumentation | Example | Contributor: Darron Schall

The FlowBox is an extension of Box that implements a FlowLayout algorithm for layout out children. FlowBox will position children in a horizontal fashion. When the width of the child exceeds the width of the container, the child is placed on a new row.

 

SuperTabNavigatorDocumentation | Example | Contributor: Doug McCune

The SuperTabNavigator is an extension of the TabNavigator navigation container. It functions exactly like the TabNavigator, but adds some functionality. Added functionality includes: 1. Draggable, re-orderable tabs, 2. Closable tabs, 3. Scrolling tab bar if too many tabs are open, 4. Drop-down list of tabs

 

WindowShadeDocumentation | Example | Contributor: Dave Glasser, Doug McCune

The WindowShade is a container that displays a header button, which when clicked, will cause a panel to "unroll" beneath it like a windowshade being pulled down; or if the panel is already displayed it will be "rolled up" like a windowshade being rolled up.

 

package: flexlib.charts¶

HorizontalAxisDataSelectorDocumentation | Example | Contributor: Darron Schall

The HorizontalAxisDataSelector is a chart annotation that allows the user to select a value along the x axis of the chart. The selector dispatches a change event with the values of each of the y values of the chart series at the given x axis location.

 

package: flexlib.skins¶

EnhancedButtonSkinDocumentation | Example | Contributor: Daniel Wabyick

This is the enhanced version of the Halo ButtonSkin that has been customized to support four numeric values in the corner, a more configurable border, and also a large number of colors in the gradient, individually specified for up, over, etc states.

 

package: flexlib.scheduling¶

Put some better Scheduling Framework documentation here, or put a link to a separate wiki page?

Original Adobe Labs wiki entry

Documentation | Example 1 demo source | Example 2 demo source | Example 3 demo source | Example 4 demo source | Example 6 demo source | Example 7 demo source | Contributor: Adobe Consulting, Wim Roelens Contributor: Adobe Consulting

 

 

 

中文版

 

包：flexlib.controls 

Base64Image

一个图像组件，能渲染base-64编码的图像。

文档 | 范例 | 贡献者：Stacy Young

CanvasButton

CanvasButton是Button的扩展，使您可以设置任何UI组件作为按钮的内容，而不是像普通的按钮控件允许的那样只有一个单一的图标和标签。

文档 | 范例 |贡献者：Doug McCune

CanvasButtonAccordionHeader

CanvasButtonAccordionHeader允许您使用CanvasButton组件作为Accordion头渲染项，这意味着你完全能控制头渲染项，可以添加额外的UI控件等。

文档 | 范例 |贡献者：Doug McCune

ConvertibleTreeList

该组件的功能是组合Tree组件和List组件。ConvertibleTreeList允许您使用一个控件，并显示为一个树或列表形式的dataProvider数据。你只需要设置dataProvider一次。您可以在任何时间设定， 模式 来改变显示模式。

文档 | 范例 |贡献者：Doug McCune

 

Fire

一个组件产生一个模拟火焰的效果。

文档 | 范例 |贡献者：Doug McCune

 

Highlighter

该组件突出显示选择文本或控件内的单词或词组

文档 | 范例 |贡献者：Tom Lee

HSlider和VSlider 

可以替代Flex框架的HSlider和VSlider。这个HSlider和VSlider版本允许你拖动某个区域，如果滑块上有多个数值点。如果有一个以上的控制点之间，在最左边和最右边的控制点之间是可拖动的区域。

文档 | 范例 |贡献者：Doug McCune

IconLoader

IconLoader将Macintosh OS X(.icns)或Windows XP(.ico)图标文件，连同alpha遮罩，一同转换为Flex 2的UIComponent。

文档 | 范例 |贡献者：Tobias Patton

ImageMap

ImageMap控件是一个客户端图像地图组件的实现，HTML支持该组件。

文档 | 范例 |贡献者：Doug McCune

PromptingTextInput

PromptingTextInput组件是标准的TextInput组件的增强版本。当文本内容为空时它会显示一个提示值，类似于ComboBox的提示属性的行为（在没有选择值的情况下）。

文档 | 范例 |贡献者：Darron Schall

PromptingTextArea

PromptingTextArea组件是标准的TextArea增强版。当文本内容为空时它会显示一个提示值，类似于ComboBox的提示属性的行为（在没有选择值的情况下）。

文档 | 范例 |贡献者：Darron Schall

ScrollableArrowMenu

ScrollableMenu的扩展，使用了两个箭头按钮，放置在滚动菜单的顶部和底部。

文档 | 范例 |贡献者：Doug McCune 

ScrollableMenu

一个mx.controls扩展。允许垂直滚动的菜单。

文档 | 范例 |贡献者：Doug McCune 

ScrollableMenuBar

ScrollableMenuBar 是flexlib.controls.MenuBar的扩展。ScrollableMenu可代替原始的mx.controls.Menu。它允许指定 ScrollableMenuBar的maxHeight属性，maxHeight将被用来决定组件生成的菜单项高度。

文档 | 范例 |贡献者：Doug McCune

ScrollablePopUpMenuButton

ScrollablePopUpMenuButton是PopUpMenuButton的扩展，使用flexlib.controls.ScrollableMenu而不是使用原始mx.controls.Menu，增加了菜单滚动功能。

文档 | 范例 |贡献者：Doug McCune

SuperTabBar

该SuperTabBar控件扩展自TabBar控件，并增加了拖放功能以及关闭标签。使用SuperTabNavigator。

文档 | 范例 |贡献者：Doug McCune

TreeGrid

该控件是组合Tree组件和DataGrid组件的功能。

文档 | 范例 |贡献者：Yaniv De Ridder

VerticalMenuBar

VerticalMenuBar控件定义一个垂直，顶级菜单栏，其中包含一个或多个菜单项，就像水平MenuBar控件那样。

文档 | 范例 贡献者：Doug McCune

包：flexlib.containers 

AdvancedForm

高级表单组件提供复位，撤消和重做功能。撤消和重做可以用“Ctrl-Z的”和“Ctrl-Y”快捷键。

文档 | 范例 |贡献者：Renaun Erickson

ButtonScrollingCanvas

这是一个容器组件，它在容器边缘放置按钮来滚动其内容。你可以将鼠标放在按钮上或点击鼠标来滚动显示内容。这些按钮都是可以应用皮肤的。

文档 | 范例 |贡献者：Doug McCune

停靠工具栏

停靠工具栏可以帮助你集中管理在应用程序中的工具栏。工具栏可以停靠到应用程序顶部或底部边缘，也可以是浮动的。在工具栏的内容中使用以流为基础的布局方法。

文档 | 范例 |贡献者：Adobe Flex Team (Bangalore)

DragScrollingCanvas

这是一个容器组件，允许用户拖动滚动的内容，而不是使用滚动条。

文档 | 范例 |贡献者：Doug McCune

HAccordion 

一个水平Accordion组件。使用方式和正常的Accordion组件完全一样，除了项目标题是从左到右，而不是从上到下。

文档 | 范例 |贡献者：Doug McCune

FlowBox

FlowBox是使用FlowLayout布局算法扩展Box。FlowBox将所以子组件以水平方式排列。当子组件宽度超过容器的宽度，将被放在下一行。

文档 | 范例 |贡献者：Darron Schall

SuperTabNavigator

SuperTabNavigator是TabNavigator的扩展。它酷似TabNavigator的功能，但增加了一些功能。新增的功能包括：1。可拖动，重新排序标签，2。可关闭标签，3。如果标签太多可以滚动标签栏，4。下拉列表标签

文档 | 范例 |贡献者：Doug McCune

WindowShade

该WindowShade是一个容器组件，它显示一个标题按钮，点击它时，会造成一个面板展开或收拢。

文档 | 范例 |贡献者：Dave Glasser, Doug McCune

包：flexlib.charts 

HorizontalAxisDataSelector

该HorizontalAxisDataSelector是一个图表，使用户可以沿图表X轴来选择数值。当选择某个x轴上的数值时，该组件会发出change事件。

文档 | 范例 |贡献者：Darron Schall

包：flexlib.skins 

EnhancedButtonSkin

这是一个增强版本的Halo ButtonSkin，以支持四个顶角数字值，可配置边界，也是大量的颜色参数用于渐变，或单独为up，over等状态指定。

文档 | 范例 |贡献者：Daniel Wabyick

包：flexlib.scheduling 

日程管理组件

原Adobe实验室wiki条目

文档 |例1 演示 源代码 |例2 演示 源代码 |示例3 演示 源代码 |范例4 演示 源代码 |例6 演示 源代码 |示例7 演示 源代码 |贡献者：Adobe Consulting, Wim Roelens Contributor: Adobe Consulting