我們將使用畫圖工具和ActionScript 3.0中的時(shí)間軸，鼠標(biāo)事件做一個(gè)好看的單選按鈕。

最終預(yù)覽

我們先看一下最終作品：

第一步：概述

一個(gè)單選按鈕或選項(xiàng)按鈕是一個(gè)圖形用戶界面元素，允許用戶只選擇一個(gè)預(yù)定義的選項(xiàng)集的類型。

在這個(gè)教程中，我們將創(chuàng)建一個(gè)傳統(tǒng)的單選按鈕。

第二步：設(shè)置Flash

打開Flash創(chuàng)建一個(gè)新文檔，舞臺大小設(shè)為320*190，顏色為#181818 ，幀頻為 24fps.

第三步：界面

這是我們將要使用的界面：一個(gè)帶標(biāo)題的簡單背景，一些用來與用戶交互的文本，一個(gè)可以工作的單選按鈕和兩個(gè)靜態(tài)按鈕樣本。

還有一個(gè)動(dòng)態(tài)文本(圖片里叫做 [Disabled] )可以通過工作的按鈕來進(jìn)行修改。

第四步：背景

選擇矩形工具并畫一個(gè) 320×40 px大小的矩形，將它放置在舞臺的頂端，并將其顏色填充為放射狀 #D45C10到 #B43B02的過渡。

現(xiàn)在需要些什么將它分成幾部分。

還是用矩形工具，畫一個(gè) 300×1 px 大小的矩形用另一種顏色填充： #737173到#181818。將其復(fù)制并按下圖擺放。

第五步：標(biāo)題

選擇文本工具將字體屬性設(shè)為Helvetica Bold, 20pt, #FFFFFF。(如果你用的是Windows，可能沒有Helvetica 字體，用Arial 來代替) 輸入標(biāo)題并將其放在屏幕的左上角。

為了獲得印刷效果，可將其復(fù)制，并將顏色改為#8C2D00將它向上移 1px，執(zhí)行修改> 排列>移到底層。即可得到下面的效果。

第六步：用戶反饋

我們將創(chuàng)建一系列靜態(tài)文本，用來告訴用戶每個(gè)按鈕所代表的意思。這有兩種文本：標(biāo)題文本和描述文本。

標(biāo)題文本的屬性為： Myriad Pro Regular, 20pt, #DDDDDD.

描述文本的屬性為： Myriad Pro Regular, 14pt, #BBBBBB.