[转]解决重大技术问题--FLEX动态配置界面

本人在无意中看到这篇文章,正如原文作者想的问题一样,希望对看到的人也有所帮助吧,除了可以解决原作者的问题,我想还可以作为语言包来用,呵呵,大家可以想想还可以用来做什么!——火舞天涯
[<wbr><a href="http://www.dongligo.com/?uid-2-action-viewspace-itemid-10402" target="_blank"><u>原始地链接</u></a><wbr>]<br>RMM系统需要自适应分辩率,但它不是简单的大小,它要做到连里面的字,图同比地扩大。<br>我们给出的方案是,初始化时,根据分辩调用不同的目录下的图片(图片大小已定)及CSS。<br> 正常情况下的<wbr><a href="javascript:;" target="_blank"><u><wbr><b><wbr>界面</wbr></b><wbr></wbr></wbr></u><wbr></wbr></a><wbr>是会根据图片的大小自适应的。但是按钮是要多种状态的,我们使用的BUTTON,导入的三种SKIN,在固定的CSS下会自动适应,可是动态LOAD的CSS却不能自适应,只是使用了默认的长宽,让界面非常难看。<br>在这里,我首先给出<wbr><a href="javascript:;" target="_blank"><u><wbr><b><wbr>动态</wbr></b><wbr></wbr></wbr></u><wbr></wbr></a><wbr>导入CSS的方法:<br>一、写不同的CSS文件,然后在<wbr><a href="javascript:;" target="_blank"><u><wbr><b><wbr>文件</wbr></b><wbr></wbr></wbr></u><wbr></wbr></a><wbr>右键选择:Compile CSS to swf,这样它就可以编入SWF供系统调用。<br> 二、写一个LOADSTYLE函数:<br> /**<br>* 调用CSS<br>**/<br>private function loadStyles( name:String ) : void<br>{<br>var styleI:IEventDispatcher = StyleManager.loadStyleDeclarations( name );<br><br>}<br>这个函数可以动态调用相应的CSS文件的SWF,调用的示例如下:<br>if(RmmWidth&gt;1390)<br>{<br> loadStyles("assets/cssToswf/interface1440.swf");<br>}<br>else if(RmmWidth&gt;1300)<br>{<br>loadStyles("assets/cssToswf/interface1360.swf");<br>}<br> 我通过把BUTTON的风格写在CSS就可以决定不同的分辩率用不同的图片了,而且动态效果也出来了,代码如下:<br>/* CSS file */<br>.soundbtDown<br>{<br><br>width: 30;<br>height: 30;<br>upSkin :Embed(source='assets/1440/button/soundDown_up.png');<br>overSkin : Embed(source='assets/1440/button/soundDown_up.png');<br>downSkin : Embed(source='assets/1440/button/soundDown_down.png');<br>}<br>可是运行时,效果却并非想像的那样,那个width,height根据不起作用。<br> 大小不能自适应,相反把图给压缩了。我试过想在代码里面重新得到图片,然后根据图片的大小设置BUTTON的大小,可是发现根据不能再得到原来这张资源图片。<br>笨笨的我,使用了getStyle:<br>1、var obj:Object=this.getStyle("upSkin ");<br>2、var obj:Image = this.getStyle("upSkin ") as Image;<br> 发现都不能得到原图。正当我要放弃的时候,打算通过别一个配置来配置相应的长跟宽,突然发现自己真笨,不是可以直接配置在CSS吗?<br> 通过this.getStyle("width"),不就可以得到width了吗?而且这个WIDTH是可以自己配置的,同时,我发现,这个名字还可以自己取,自己想配置什么就是什么。应用例子如下:<br>给文件加一个updateComplete事件,如下:<br>&lt;mx:Button xmlns:mx="<wbr><a href="http://www.adobe.com/2006/mxml" target="_blank"><u>http://www.adobe.com/2006/mxml</u></a><wbr>"<br>updateComplete="OnUpdateComplete()"&gt;<br>/**<br> * 可以直接通过CSS配置参数<br> * 当图片更新的时候,改变大小<br> **/<br>private function OnUpdateComplete():void<br>{<br> var w:int = this.getStyle("width");<br> var h:int = this.getStyle("height");<br> if (w != this.width)<br> {<br>this.width = w;<br> }<br> if (h != this.height)<br> {<br> this.height = h;<br>}<br>}<br>这样就可以根据CSS设置尺寸了,在其他地方我也使用了这个方法,发现真好用。<br> 用法如下:<br> 一、随便拿一个<wbr><a href="javascript:;" target="_blank"><u><wbr><b><wbr>控件</wbr></b><wbr></wbr></wbr></u><wbr></wbr></a><wbr>,设置它的StyleName:<br>&lt;mx:Box id="styleBox" width="100%" height="100%" styleName="leftAdView"<br> verticalAlign="middle" horizontalAlign="center"&gt;<br>CSS文件写法:<br>.leftAdView<br>{<br>adwidth: 405;<br>adheight : 665;<br>}<br>定义两个变量:<br>[Bindable] private var adw:int;<br> [Bindable] private var adh:int;<br>然后在初始化函数里面添加:<br>adw = styleBox.getStyle("adwidth");<br> adh = styleBox.getStyle("adheight");<br>这两个变量,就可以任意绑定界面中的控制了。<br>同理,我们还可以配置String 类型的,如:<br>.message<br>{<br>okmessage:"ok,i am here";<br>errormessage:"error,where are you?"<br>}<br>通过这个CSS配置相应的信息。<br>问题<wbr><a href="javascript:;" target="_blank"><u><wbr><b><wbr>解决</wbr></b><wbr></wbr></wbr></u><wbr></wbr></a><wbr>!! </wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>

你可能感兴趣的:(Flex)