Way's Blog » ActionScript

Designer Effects for Flex

Way — Fri, 15 Jan 2010 04:42:42 +0000

Efflex is a good site providing a number of custom effects for Flex.

http://www.efflex.org/orgefflexmxviewstackeffects/

Here is the Effect Explorer by Efflex. You can preview all the effects and try to customize the effect options.

http://www.efflex.org/EfflexExplorer.html

Flash / Flex application: Can’t type chinese character

Way — Mon, 03 Aug 2009 03:52:50 +0000

If you have added parameter “wmode” (e.g. opaque, transparent) into the flash application object tag in the HTML. You may not able to type non-English character into the text input of the flex application by using non-IE browsers.


 
 id="flashapp" width="100%" height="500"
 codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
 
 
 
 
 
 
 width="100%" height="500" name="flashapp" align="middle"
 play="true"
 loop="false"
 quality="high"
 allowScriptAccess="sameDomain"
 wmode="opaque"
 type="application/x-shockwave-flash"
 pluginspage="http://www.adobe.com/go/getflashplayer">

To solve this issue, you can simply remove the wmode paramater. And you can type Chinese normally.
References:

http://blog.rive.be/2009/03/25/flash-wmodetransparent-breaks-textinput-field/

Using hand cursor in Flex Text control

Way — Thu, 16 Jul 2009 09:37:01 +0000

By default, the flex application can show hand cursor when rollover by enabling useHandCursor and buttonMode properties.

However, in Text control, the cursor will not change to hand even you set the selectable = false. The tricky thing is that we have to set its mouseChildren to false also.

mouseChildren=”false” />

mouseChildren - Determines whether or not the children of the object are mouse enabled. If an object is mouse enabled, a user can interact with it by using a mouse. The default is true.

http://www.mail-archive.com/flexcoders@yahoogroups.com/msg29930.html

http://livedocs.adobe.com/flex/201/langref/flash/display/DisplayObjectContainer.html#mouseChildren

Flex MultiLine FormItem

Way — Thu, 18 Jun 2009 02:59:35 +0000

This is a very good control to break the form item label into multiple lines.

I found it from Google by Nick bilyk.

http://www.nbilyk.com/multiline-formitem-label

http://www.nbilyk.com/examples/betterFormItemExample/index.html

Multiline TabNavigator #2

Way — Mon, 20 Apr 2009 15:28:29 +0000

MultiLineTab.as
package controls { import flash.display.DisplayObject; import flash.text.TextLineMetrics; import mx.controls.tabBarClasses.Tab; import mx.core.IFlexDisplayObject; import mx.core.UITextField; import mx.core.mx_internal; use namespace mx_internal; public class MultiLineTab extends Tab { public function MultiLineTab() { super(); } override protected function createChildren():void { if (!textField) { textField = new UITextField(); textField.styleName = this; addChild(DisplayObject(textField)); } super.createChildren(); textField.multiline = true; textField.wordWrap = true; } override protected function measure():void { if (!isNaN(explicitWidth)) { var tempIcon:IFlexDisplayObject = getCurrentIcon(); var w:Number = explicitWidth; if (tempIcon) w -= tempIcon.width + getStyle("horizontalGap") + getStyle("paddingLeft") + getStyle("paddingRight"); textField.width = w; } super.measure(); } override public function measureText(s:String):TextLineMetrics { textField.text = s; var lineMetrics:TextLineMetrics = textField.getLineMetrics(0); lineMetrics.width = textField.textWidth + 4; lineMetrics.height = textField.textHeight + 4; return lineMetrics; } override protected function updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void { super.updateDisplayList(unscaledWidth,unscaledHeight); if (this.getCurrentIcon()) { this.getCurrentIcon().y = 2; } } } }
MultiLineTabBar.as
package controls { import mx.controls.TabBar; import mx.core.ClassFactory; import mx.core.mx_internal; use namespace mx_internal; public class MultiLineTabBar extends TabBar { public function MultiLineTabBar() { super (); navItemFactory = new ClassFactory (MultiLineTab);� } } }
MultiLineTabNavigator.as
package controls { import flash.display.DisplayObject; import mx.containers.TabNavigator; public class MultiLineTabNavigator extends TabNavigator { public function MultiLineTabNavigator() { super(); } override protected function createChildren():void { if (!tabBar) { tabBar = new MultiLineTabBar(); tabBar.name = "tabBar"; tabBar.focusEnabled = false; tabBar.styleName = this;� tabBar.setStyle("borderStyle", "none"); tabBar.setStyle("paddingTop", 0); tabBar.setStyle("paddingBottom", 0); rawChildren.addChild(tabBar); } super.createChildren(); } override protected function updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void { super.updateDisplayList(unscaledWidth,unscaledHeight); } } }

Corelib

Way — Thu, 16 Apr 2009 15:51:49 +0000

CORELIB有一堆UTILITIES … 有陣時都幾好用~~

http://code.google.com/p/as3corelib/

http://weblogs.macromedia.com/as_libraries/docs/corelib/com/adobe/utils/package-detail.html

Flex Multiline TabNavigator

Way — Thu, 16 Apr 2009 15:50:19 +0000

Currently, if your label text is too long. The text will be truncated as “…” in the tab. However, there are very few posts talking about how to build a multiline tavnavigator in flex. And the flex API does not provide a style and properties to do such styling. We have to create custom classes.

Step 1: create a custom class extends the original mx.controls.tabclasses.tab class, and break the text of the tab into multiline. The steps are exactly the same as creating a multiline button (Creating multiline button: http://blogs.adobe.com/aharui/2007/04/multiline_buttons.html). It is because tab class itself extends Button class originally.

Step 2: create a custom class extends mx.controls.tabBar. and change the tab class to your custom tab class created in Step 1 by following code.

navItemFactory = new ClassFactory( CustomTab );

Step 3: create a custom class extends mx.containers.tabNavigator and change the tabBar into your custom tabBar class created in Step 2.

override protected function createChildren ():void

{

   if (!tabBar) {

   tabBar = new CustomTabBar();

   tabBar.set …..

   }

}

It is really not that easy to have a multiline tabNavigator. ~I will attach the sample source code later.

Reference:

http://www.remotesynthesis.com/post.cfm/using-custom-tab-classes-with-the-flex-tabbar

http://wiki.mediaboxtraining.com/doku.php/tutorials:flex:tabcontrol

http://blogs.adobe.com/aharui/2007/04/multiline_buttons.html

http://www.mail-archive.com/flexcoders@yahoogroups.com/msg106481.html

ActionScript 2 External Interface

Way — Wed, 08 Apr 2009 09:28:53 +0000

前幾日打算寫個flash button 點知office得flash 8, 要用actionscript 2 … 真係幾挑戰..因為自己未用過8 + as 2

當初諗住好似好簡單既野.. 用external interface call js 點知攪左好耐都唔得..

最後搵到個site 先幫到我..

要將 ExternalInterface.call(); 改做 flash.external.ExternalInterface.call(); 先用到.. 但係我真係唔明 =.=

唔通佢有兩個api 都係叫 ExternalInterface ?! 算啦…應該都唔會點用as 2 架啦..

Reference:

http://www.psyked.co.uk/actionscript/externalinterface-not-working-in-firefox.htm

Copying an ArrayCollection

Way — Sun, 24 Aug 2008 09:03:00 +0000

There are multiple ways to copy an arraycollection ..

1. ac1 = ac2;
2. ac1 = new ArrayCollection (ac2.source);
3. ac1 = ObjectUtil.copy (ac2) as ArrayCollection;

Method 1 copy the ac by reference.
Method 2 will create an new ac instance, but the value (array) inside two ac are still the same.
Method 3 will create completely two different objects.

Dynamic source of Image control

Way — Sun, 24 Aug 2008 08:57:00 +0000

In order to change the image source dynamically instead of creating multiple image instances, we could make use of [Embed] tag as follows:

[Embed(source="a.png")]
private var _src_a:Class;
[Embed(source="b.png")]
private var _src_b:Class;

_img = new Image ();
if ( … ) {
_img.source = _src_a;
} else {
_img.source = _src_b;
}

http://livedocs.adobe.com/flex/2/docs/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Parts&file=00000968.html