当前位置:文档之家› Flash中利用组件完成选择题的设计

Flash中利用组件完成选择题的设计

我们来利用Label 组件(文本组件)、RadioButton组件(单选按钮组件)、CheckBox组件(多选框组件)、Button组件(按钮组件)以及TextInput 组件(文本框组件)来完成第一节中的选择题的设计,先来分析下各组件的分布情况,如图:下面我们按组件的类型来加以介绍:1Label 组件(文本组件)课件中,用到了5个Label组件,我们来完成第一个,具体方法如下:1、新建一个AS3.0文件,打开窗口→组件,选User Interface文件夹下的Label组件,直接拖入到舞台上,放在最上端。

2、在选中这个组件的状态下,到属性面板中修改组件参数的text值为“1、酗酒对哪个脏器影响最大( )(单选)”,然后在该参数输入框以外的任意位置点击鼠标,我们会发现,组件的标签变了,但却不能完全显示,如何全部显示呢?3、再次选中这个组件,用工具栏上的变形工具拖大,使文字能完全显示即可。

4、至此,一个完整的Label组件就好了,你能依照这个步骤完成另外的四个吗?试试吧。

最后再调整下各自的位置,效果如图所示:5、点文件→保存,确定保存路径,命名为“选择题设计”。

拓展:Label 组件有什么特点?Label 组件显示单行文本,通常用于标识网页上的其它某些元素或活动。

下图是其组件参数:各参数具体意义如下:1、autoSize :指示如何调整标签大小和对齐标签,有四个选项:①left:调整标签右边和底边的大小以适合文本,不会调整左边和上边的大小。

②center:调整标签左边和右边的大小以适合文本。

标签的水平中心锚定在它原始的水平中心位置。

③right:调整标签左边和底边的大小以适合文本。

不会调整上边和右边的大小。

④none:不调整标签大小或对齐标签来适合文本。

2、condenseWhite :指示是否应从包含HTML 文本的Label 组件中删除额外空白,如空格和换行符。

3、enabled :指示组件能否接受用户输入。

选中为接受,取消选中为不接受。

4、htmlText :获取或设置由Label 组件显示的文本,包括表示该文本样式的HTML 标签。

5、selectable :指示文本是否可选。

选中为可选,取消选中为不可选。

6、text :获取或设置由Label 组件显示的纯文本。

7、visible :指示当前组件实例是否可见,选中则可见,取消选中则不可见。

8、wordWrap :指示文本字段是否支持自动换行。

选中则自动换行,取消选中则不自动换行。

这里要注意组件的大小,如果太小则无法实现换行。

2RadioButton组件(单选按钮组件)在课件中,我们用到了八个RadioButton组件,我们还是来完成一个示范:1、打开上节的文件“选择题设计”;2、打开窗口→组件,选User Interface文件夹下的RadioButton组件,直接拖入一个到舞台上,放在第1题的下方,作为该题的第一个选项。

3、在选中这个组件的状态下,到属性面板中修改组件参数的label值为“A.肺”,然后在该参数输入框以外的任意位置点击鼠标,我们会发现,组件的标签变了4、至此,一个完整的RadioButton组件就好了,你能依照这个步骤完成另外的七个吗?试试吧。

最后再调整下各自的位置,效果如图所示:5、千万别忘记保存啊。

拓展:RadioButton组件有什么特点?使用RadioButton 组件可以强制用户只能选择一组选项中的一项。

该组件必须用于至少有两个RadioButton 实例的组中。

在任意给定时刻,都只能有一个组成员被选中。

选择组中的一个单选按钮将取消选择该组中当前选中的单选按钮。

可以设置groupName 参数来指示单选按钮属于哪个组。

下图是其组件参数:各参数具体意义如下:1、enabled :指示组件能否接受用户输入。

选中为接受,取消选中为不接受。

2、groupName :单选按钮实例或组的组名。

3、label :获取或设置组件的文本标签。

4、labelPlacement :标签相对于指定图标的位置,有四个选项:①right:文本标签位于图标的右侧②left:文本标签位于图标的左侧③bottom:文本标签位于图标的底部④top:文本标签位于图标的顶部5、selected :指示单选按钮当前处于选中状态(true) 还是取消选中状态(false)。

6、value :与单选按钮关联的用户定义值。

7、visible :指示当前组件实例是否可见,选中则可见,取消选中则不可见。

3CheckBox组件(多选框组件)在课件中,我们还用到了八个CheckBox组件,我们还是来完成一个示范:1、继续打开上节的文件“选择题设计”;2、打开窗口→组件,选User Interface文件夹下的CheckBox组件,直接拖入一个到舞台上,放在第3题的下方,作为该题的第一个选项。

3、在选中这个组件的状态下,到属性面板中修改组件参数的label值为“A.尽量不与患病动物接触”,然后在该参数输入框以外的任意位置点击鼠标,我们会发现,组件的标签变了。

如果不能完整再次选中这个组件,用工具栏上的变形工具拖大,使文字能完全显示即可。

4、至此,一个完整的CheckBox组件就好了,你能依照这个步骤完成另外的七个吗?试试吧。

最后再调整下各自的位置,效果如图所示:5、千万别忘记保存啊。

拓展:CheckBox组件有什么特点?CheckBox 组件是一个可以选中或取消选中的方框。

当它被选中后,框中会出现一个复选标记。

我们还可以为CheckBox 添加一个文本标签,并可以将它放在CheckBox 的左侧、右侧、上面或下面。

下图是其组件参数:各参数具体意义如下:1、enabled :指示组件能否接受用户输入。

选中为接受,取消选中为不接受。

2、label :获取或设置组件的文本标签。

3、labelPlacement :标签相对于指定图标的位置。

4、selected :指示切换按钮是否已切换至打开或关闭位置。

5、visible :指示当前组件实例是否可见,选中则可见,取消则不可见。

4Button组件(按钮组件)前面应该把题目准备好了,还得需要一个按钮,这个按钮也可以利用组件,当然也可以从公用库中调用按钮,但公用库中的按钮标签修改相对来说不如按钮组件容易些,下面我们来看如何使用这个button组件:1、继续打开上节的文件“选择题设计”;2、打开窗口→组件,选User Interface文件夹下的button组件,直接拖入一个到舞台上,放在舞台底部的中央位置。

3、在选中这个组件的状态下,到属性面板中修改组件参数的label值为“提交”,然后在该参数输入框以外的任意位置点击鼠标,我们会发现,组件的标签变了。

4、至此,按钮组件完成,最后别忘记保存文件。

拓展:Button组件有什么特点?Button 组件(按钮组件)是一个可调整大小的矩形按钮,我们可以通过鼠标或空格键按下该按钮以在应用程序中启动操作。

下图是其组件参数:各参数具体意义如下:1、emphasized :指示当按钮处于弹起状态时,Button 组件周围是否绘有边框。

选中会有边框,取消选中在没有边框。

2、enabled :指示组件能否接受用户输入。

选中为接受,取消选中为不接受。

3、label :获取或设置组件的文本标签。

4、labelPlacement :标签相对于指定图标的位置。

5、selected :指示切换按钮是否已切换至打开或关闭位置。

6、toggle :指示按钮能否进行切换,true值指示按钮可以进行切换;false指示按钮不能进行切换。

7、visible :指示当前组件实例是否可见,选中则可见,取消则不可见。

5TextInput 组件通过前面四节的制作,课件的界面基本完成了,但为了显示成绩,还得一个文本框,在此,我们继续使用一个新组件——TextInput 组件,下面让我们来继续操作:1、继续打开上节的文件“选择题设计”;2、打开窗口→组件,选User Interface文件夹下的TextInput组件,直接拖入一个到舞台上,放在舞台下方“分数”的右边。

3、至此,课件界面所需要的元件已经齐全,完整效果如图所示:4、保存文件。

拓展:TextInput组件有什么特点?TextInput 组件是单行文本组件,下图是其组件参数:各参数具体意义如下:1、displayAsPassword :指示当前创建的TextInput 组件实例用于包含密码还是文本。

选中为密码,取消选中为文本。

2、editable :指示用户能否编辑组件中的文本。

如果editable 属性为true,也可以用它来编辑和接收文本输入。

3、enabled :指示组件能否接受用户输入。

选中为接受,取消选中为不接受。

4、maxChars :获取或设置用户可以在文本字段中输入的最大字符数。

5、restrict :获取或设置文本字段从用户处接受的字符串。

6、text :获取或设置字符串,其中包含当前TextInput 组件中的文本。

7、visible :指示当前组件实例是否可见,选中则可见,取消选中则不可见。

6代码书写通过前面5节的介绍,我们已经具备了课件的基本元素,如果此时测试文件,会发现多选题中的多选框都可以画上√,但单选题中的八个选项中却只能选中其中的一个,而我们要的应该是每题一个,这是第一个问题,第二个问题就是还没有做出判断,提交按钮还没起作用,为什么呢?因为我们还没有利用代码来实现交互的效果。

这节课就来解决这些问题。

1、如何把单选组件分为两个组呢?通过测试,我们会发现八个单选组件只能选中一个,如何解决这个问题呢?这就要用到一个组件参数——groupName,将第一题的四个单选组件的groupName修改为t1,第二题的四个单选组件的groupName修改为t2,这样就把它们分为了两组,再次测试就会发现每题只能选一个了。

2、给需要控制的组件起实例名通过前面的学习,我们知道,要控制元件,就必须先给元件起个实例名,组件实际就是带参数的影片剪辑,所以,要控制它也得起个实例名。

⑴在本课件中,我们需要判断答案是否正确,所以八个选项都必须得起实例名,我们从上往下依次起实例名为“da11”、“da12”、“da13”、“da14”、“da21”、“da22”、“da23”、“da24”、“da31”、“da32”、“da33”、“da34”、“da41”、“da42”、“da43”、“da44”。

⑵按钮“提交”起实例名为“tiJiao”。

⑶分数右边的那个TextInput 组件,起实例名为“fenShu”,用来显示成绩。

3、书写代码这样我们就完成了所有的准备工作,那么我们需要用代码完成哪些任务呢?主要有以下几个方面:⑴点提交按钮,系统应该给出判断。

相关主题