您的位置:首页 > 其它

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

2009-01-09 22:22 393 查看
本人在无意中看到这篇文章,正如原文作者想的问题一样,希望对看到的人也有所帮助吧,除了可以解决原作者的问题,我想还可以作为语言包来用,呵呵,大家可以想想还可以用来做什么!——火舞天涯
[原始地链接]
RMM系统需要自适应分辩率,但它不是简单的大小,它要做到连里面的字,图同比地扩大。
我们给出的方案是,初始化时,根据分辩调用不同的目录下的图片(图片大小已定)及CSS。
正常情况下的界面是会根据图片的大小自适应的。但是按钮是要多种状态的,我们使用的BUTTON,导入的三种SKIN,在固定的CSS下会自动适应,可是动态LOAD的CSS却不能自适应,只是使用了默认的长宽,让界面非常难看。
在这里,我首先给出动态导入CSS的方法:
一、写不同的CSS文件,然后在文件右键选择:Compile CSS to swf,这样它就可以编入SWF供系统调用。
二、写一个LOADSTYLE函数:
/**
* 调用CSS
**/
private function loadStyles( name:String ) : void
{
var styleI:IEventDispatcher = StyleManager.loadStyleDeclarations( name );

}
这个函数可以动态调用相应的CSS文件的SWF,调用的示例如下:
if(RmmWidth>1390)
{
loadStyles("assets/cssToswf/interface1440.swf");
}
else if(RmmWidth>1300)
{
loadStyles("assets/cssToswf/interface1360.swf");
}
我通过把BUTTON的风格写在CSS就可以决定不同的分辩率用不同的图片了,而且动态效果也出来了,代码如下:
/* CSS file */
.soundbtDown
{

width : 30;
height : 30;
upSkin : Embed(source='assets/1440/button/soundDown_up.png');
overSkin : Embed(source='assets/1440/button/soundDown_up.png');
downSkin : Embed(source='assets/1440/button/soundDown_down.png');
}
可是运行时,效果却并非想像的那样,那个width,height根据不起作用。
大小不能自适应,相反把图给压缩了。我试过想在代码里面重新得到图片,然后根据图片的大小设置BUTTON的大小,可是发现根据不能再得到原来这张资源图片。
笨笨的我,使用了getStyle:
1、var obj:Object= this.getStyle("upSkin ");
2、var obj:Image = this.getStyle("upSkin ") as Image;
发现都不能得到原图。正当我要放弃的时候,打算通过别一个配置来配置相应的长跟宽,突然发现自己真笨,不是可以直接配置在CSS吗?
通过this.getStyle("width"),不就可以得到width了吗?而且这个WIDTH是可以自己配置的,同时,我发现,这个名字还可以自己取,自己想配置什么就是什么。应用例子如下:
给文件加一个updateComplete事件,如下:
<mx:Button xmlns:mx="http://www.adobe.com/2006/mxml"
updateComplete="OnUpdateComplete()">
/**
* 可以直接通过CSS配置参数
* 当图片更新的时候,改变大小
**/
private function OnUpdateComplete():void
{
var w:int = this.getStyle("width");
var h:int = this.getStyle("height");
if (w != this.width)
{
this.width = w;
}
if (h != this.height)
{
this.height = h;
}
}
这样就可以根据CSS设置尺寸了,在其他地方我也使用了这个方法,发现真好用。
用法如下:
一、随便拿一个控件,设置它的StyleName:
<mx:Box id="styleBox" width="100%" height="100%" styleName="leftAdView"
verticalAlign="middle" horizontalAlign="center">
CSS文件写法:
.leftAdView
{
adwidth : 405;
adheight : 665;
}
定义两个变量:
[Bindable] private var adw:int;
[Bindable] private var adh:int;
然后在初始化函数里面添加:
adw = styleBox.getStyle("adwidth");
adh = styleBox.getStyle("adheight");
这两个变量,就可以任意绑定界面中的控制了。
同理,我们还可以配置String 类型的,如:
.message
{
okmessage: "ok,i am here";
errormessage:"error,where are you?"
}
通过这个CSS配置相应的信息。
问题解决!!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐