Flash教程:彻底学习RadioButton组件

RadioButton基础篇
RadioButton是常用组件之一,但是做的并不非常好,下面随便说说关于RadioButton的使用。打开窗口,组件,可以看到RadioButton。



把它拖出来打开熟悉面板,可以看到以下属性:


RadioButton.data:与单选按钮实例相关的值。
RadioButton.groupName:按钮组的名字
RadioButton.label:显示文本
RadioButton.labelPlacement:按钮的LABEL的方向。
RadioButton.selected:按钮是否被选中
还有两个是组的属性:
RadioButtongroup.selectedData:组中被选中的按钮的Data属性
RadioButtongroup.selection:组里被选中的按钮

首先来说组的概念
都考过四级吧?单选题中,一般有ABCD四个选项。对,这四个选项就可以看做是一组如下图:


四个按钮的组都是test1,这么做的意义就是,当我们选中其中1个按钮的时候其他3个按钮都会回到未被选中状态,也就是说一组只可能有一个被选中的项,这个项可以直接被RadioButtongroup.selection引用。如果组里没有选任何项的话,RadioButtongroup.selection=undefined。
分组之后,我们就可以顺利的做test2,test3了,而不出现彼此影响了。
下面讲讲如何把FLASH中选中的内容显示出来:首先我们在舞台上放测试题目,然后我们在下面放一个按钮叫做btn。
然后我们在所有的按钮中的data里都写为2,把正确的选项的data做成1
然后打开动作面板,这一帧上写下如下代码:
var socre = 0;
btn.onRelease = function() {
switch (test1.selection.data) {
case 1 :
trace("right");
socre ;
break;
case 2 :
trace("wrong");
break;
default ://这个default实际上就是在等着组里对没有选中任何选项时返回的那个undefined
trace("请选择答案");
break;
}
trace(socre);
};
实际上可以换一种写法将
switch (test1.selection.data) {
换成
switch (test1.selectedData) {
这两行语句实际上是一样的,但是写法不一样。不过这个无所谓。
除了这样写,还可以写成其他的模式:比如将test1的四个分别命名为t1r1,t1r2,t1r3,t1r4
然后可以用下面的代码来写
btn.onRelease = function() {
if (t1r2.selected) {
trace("right");
socre ;
} else {
trace("wrong!");
}
这样写的后果就是要命名很多个元件,但是可以不用给按钮写data,而刚才用组的话,只需要在组里加data,剩下的一个组名就全部解决了。
不过这个题目就是一个简单的对错判断,所以怎么写都无所谓,但是如果按钮上的data值要被用到比如时下流行的一些测试性格的小东西,group selectedData就方便一些。

下面是RadioButton提高篇
这里说一下RadioButton的禁用和启用,以及侦听器的使用。
FLASH比较蠢,按照下面的代码,你完全写不出效果的。
if (cbx.selected == true) {//此代码为错误代码
_root.g3_1.enabled = true;
_root.g3_2.enabled = true;
} else {
g3_1.enabled = false;
g3_2.enabled = false;
}
首先在舞台上放两个RadioButton,命名为g3_1,g3_2 另外放一个CheckBox叫做cbx
g3_1.enabled = false;//将RadioButton禁用。
g3_2.enabled = false;
mylistener = new Object();//新建侦听器
mylistener.click = function(eventObject) {
if (cbx.selected == true) {//如果cbx被选中
_root.g3_1.enabled = true;
_root.g3_2.enabled = true;
} else {
g3_1.enabled = false;
g3_2.enabled = false;
}
};
cbx.addEventListener("click", mylistener);//将侦听器添加到cbx上
这里的enabled属性是从button类继承下来的。侦听器的添加方式也完全一样,在这里CheckBox和RadioButton是完全一样的。RadioButton也可以按照给CheckBox加侦听器的方式加上侦听器。
功能上基本就这么多下面说一下RadioButton的外观
首先说正统的办法
基本上说,我很讨厌FLASH的一些UI组件的外观,正如惹急了我常常会自己写一个滚动条而不用FLASH自带的。
RadioButton.setSize(50,50)//里面是两个数值,宽和高。
RadioButton.setStyle("fontFamily","Arial")//是可以的,但是换成汉字字体的时候就不一定有用了。其他论坛上有一些解决办法如:自己在舞台上放一个textfield将字体设置成黑体,然后用getStyle把字体抽出来给setStyle使用。
RadionButton.setStyle("fontSize",20)//是可以用,但是超级不爽的是,如果你把字体设置过大的时候它显示出来的字是不完全的。
以下是一些setStyle的其他属性名称。有一些是可以用的
themeColor 组件的背景。
color 组件文本颜色。
disabledColor 禁用时的文本颜色。
fontFamily 文本的字体
fontSize 字体的大小
fontStyle 字体样式:“常规”或“斜体”。
fontWeight 是否加粗。
RadioButton.labelPlacement可以改RadioButton和label的相对位置默认为right
下面说一些歪门邪道
RadioButton是不能直接变形的,但是这个不妨碍我们把它放到MC里面之后变形。这个可以替代setsize(),但是千万注意,RadioButton不能旋转,宣传会让label完全失效。
UI的label都很垃圾,完全可以不用。自己用静态文本写上去不就好了。这样label失效的问题也同时解决。
关于颜色,从RadioButton.setStyle()里改,当然可以,但是有更好的办法的时候你会选择它么?自己用代码或者文字描述UI的界面颜色?太不靠谱了。FLASH8支持对FLASH中间MC的混合模式的更改,用这个就可以直接改UI的颜色。当然包括RadioButton的颜色。
方法就是直接用方块画一个色块放在RadioButton上面一层,盖住RadioButton,然后将混合模式改为叠加即可。背景色的更改方式雷同,只是如果两个颜色修改都要用的时候要计算一下混合出来的背景色值。
注意,如果使用上面说的办法,我们的UI在不可用状态下,到可用状态下的时候Label的颜色会变回去(要不怎么说FLASH自带的UI很烂呢?)。这个时候就要重新在AS里刷新一下那里的颜色可以用attachMovie()和RadioButton的_x ,_y的值直接在原先的位置上再复制一个色块出来。