actionscript 3 - Preventing Application scale from cutting off button labels in Flex 3 -
actionscript 3 - Preventing Application scale from cutting off button labels in Flex 3 -
i've encountered problem that's driving me nuts. apparently button labels not scale appropriately in flex or i'm not going correctly. simple runnable test case below.
the issue:
in test case can see button label cutting off @ end @ multiple different window sizes "pops" new font level seems , looks correct? why this?
<?xml version="1.0" encoding="utf-8"?> <mx:application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:script> <![cdata[ import mx.events.resizeevent; public var minscale:number = 0.5; public var basewidth:number = 1000; public var baseheight:number = 800; override protected function updatedisplaylist(unscaledwidth:number, unscaledheight:number):void { super.updatedisplaylist(unscaledwidth,unscaledheight); if(width < basewidth || height < baseheight) { var sx:number = math.max(minscale, width / basewidth); var sy:number = math.max(minscale, height / baseheight); var s:number = math.min( sx, sy ); getchildat(0).scalex = s; getchildat(0).scaley = s; } else{ getchildat(0).scalex = 1; getchildat(0).scaley = 1; } } ]]> </mx:script> <mx:canvas> <mx:button label="wwwwwww" fontsize="12"/> </mx:canvas> </mx:application>
thanks.
after code review, detected when scale canvas, button not update display list, , button phone call intresting method textfield: truncatetofit(); prepare bug, create custom button class, , override updatedisplaylist method:
package classes { import mx.controls.button; import mx.core.iuitextfield; import mx.core.uitextfield; import mx.core.mx_internal; public class buttonscale extends button { public function buttonscale() { super(); } override protected function updatedisplaylist(unscaledwidth:number, unscaledheight:number):void { super.updatedisplaylist(unscaledwidth, unscaledheight); var tf:iuitextfield = mx_internal::gettextfield() iuitextfield; tf.width = tf.textwidth + uitextfield.mx_internal::text_width_padding; } } }
when scale, phone call button.invalidatedisplaylist(), or create custon canvas:
package classes { import mx.containers.canvas; import mx.core.uicomponent; public class canvasscale extends canvas { public function canvasscale() { super(); } override public function set scalex(value:number):void { super.scalex = value; (var i:uint = 0; i<numchildren; i++) { uicomponent(getchildat(i)).invalidatedisplaylist(); } } } }
main class:
<?xml version="1.0" encoding="utf-8"?> <mx:application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:classes="classes.*"> <mx:script> <![cdata[ import mx.events.resizeevent; import mx.core.iuitextfield; import mx.core.uicomponent; public var minscale:number = 0.5; public var basewidth:number = 900; public var baseheight:number = 700; override protected function updatedisplaylist(unscaledwidth:number, unscaledheight:number):void { super.updatedisplaylist(unscaledwidth,unscaledheight); var child:uicomponent = getchildat(0) uicomponent; if(width < basewidth || height < baseheight) { var sx:number = math.max(minscale, width / basewidth); var sy:number = math.max(minscale, height / baseheight); var s:number = math.min( sx, sy ); child.scalex = s; child.scaley = s; } else { child.scalex = 1; child.scaley = 1; } } ]]> </mx:script> <classes:canvasscale> <classes:buttonscale label="wwwwwww" fontsize="12" paddingleft="10" paddingright="10"/> </classes:canvasscale> </mx:application>
actionscript-3 flash flex flex3
Comments
Post a Comment