Flex 4: flex.components example source code
Flex 4: flex.components
Here is a very simple example that displays some of the components that are located in the new flex.components package. The SWF is interesting because it is visually a little different than the classic Flex theme. No CSS has been altered in this example. Flash Player 10 is required to view the SWF. The following Flex 4 components can be seen: Panel, CheckBox, List, RadioButton, TextArea, TextInput, ToggleButton, HSlider, VSlider, VScrollBar, HScrollBar.
JPG showing the components: Flex 4 components screehshot
SWF with the functional components: Flex 4 components SWF
Here is the sample source code:
<?xml version=”1.0″ encoding=”utf-8″?>
<Application xmlns=”http://ns.adobe.com/mxml/2009″
layout=”flex.layout.VerticalLayout”
backgroundColor=”white”
xmlns:ns=”library:adobe/flex/gumbo”>
<Script>
<![CDATA[
/**
*
* @project Flex 4 flex.components example
* @author Sean Moore, http://www.seantheflexguy.com
* @date: August 29, 2008
*
*/
private function onButtonClick():void
{
trace(">>onButtonClick");
}
private function onListSelectionChanged(event:Event):void
{
trace(">>onListSelectionChanged");
trace("event.currentTarget.selectedItem="+event.currentTarget.selectedItem);
}
private function onRadioButtonClick():void
{
trace(">>onRadioButtonClick");
}
]]>
</Script>
<Panel title=”Flex 4 flex.components example” width=”500″>
<Button click=”onButtonClick();” label=”Flex 4 Button” />
<CheckBox label=”Flex 4 CheckBox” />
<Group>
<Rect width=”200″ height=”100″>
<stroke>
<SolidColorStroke weight=”1″ color=”#000000″ alpha=”0.5″ />
</stroke>
</Rect>
<List content=”['row one','row two','row three','row four']” selectionChanged=”onListSelectionChanged(event);” />
</Group>
<RadioButton label=”Flex 4 RadioButton” click=”onRadioButtonClick();”/>
<TextArea height=”50″ content=”Flex 4 TextArea.”/>
<TextInput text=”Flex 4 TextInput”/>
<ToggleButton label=”Flex 4 ToggleButton” />
<HSlider />
<VSlider />
<VScrollBar />
<HScrollBar />
</Panel>
</Application>
Note that the <Group> element is not required to use the List component. It’s been added to help show where the List is in the example SWF. (Sorry that the code hasn’t been beautified…)
Thanks for posting the JPG. Saves me from having to install FP 10…
Hey Todd,
No problem. Thanks for checking out the post.
Regards,
Sean
If this is without any css modifications , or anything of that sort. basically out of hte box then its pretty bland and boring, which i think is a good thing . I dont remember which post this was on whos blog , but i remember the post talking about how clients are misconcived about how good a standard out of hte box flex app looks and makes it hard for hte developers/desginers to prove them otherwise. By making the application in flex 4 so bland, it gives a new meaning of prototyping applications in flex, thus giving the client an open mind as to how a flex app will look, esp with thermo around the corner i think this is a good move by adobe.
[...] post info By flexria Categories: Adobe, FLEX, Gumbo, RIA, Tutorial and rich internet applications Source [...]
[...] Gumbo还提供了flex.components包，一套轻量级的组件（可惜还是继承自mx.core.UIComponent),这样在开发一些简单的应用的时候可以选择使用这个包。这儿（Flex 4: flex.components example source code） 有朋友已经贴出了组件使用方法和预览文件，查看图片 查看SWF 标签：flash10, Flex4, Gumbo 分类： flash, flash技术资料 | 评论 (RSS) | 引用 [...]
Thanks for this example
Sean, would you please stop writing so many great tutorial/posts? I’m very busy and don’t have time to read them all. Then I feel guilty that I’m not learning all this good stuff you’re serving up. Thanks, dan.
@polyGeek, hey man, great to hear from you. thanks for the comment. thanks for checking out the post too! you need to talk to the software gods though, they are the ones who keep releasing all this bad-ass technology. i am left with no choice but to explore and blog
hello^^ i´m a german trainee for it specialist since a few weeks… for the time beeing i become acquainted with flex 2 and databases… i cant do anything with the most appliactions… can you call me a website where sourcecode examples are illustrated (especially in german)? sorry for my bad english… i hope you get my request