Flex中利用PopUpManager和TitleWindow类创建自定义对话框的例子(实用)

By Minidxer | July 28, 2008

和前面Flex中利用PopUpManager和TitleWindow类创建自定义对话框的例子一样，接下来的例子演示了Flex中利用PopUpManager和TitleWindow类，创建自定义对话框。不过本例包含了CheckBox选择框，可以选中点击“Continue”进入下一个画面。

让我们先来看一下Demo（可以右键View Source或点击这里察看源代码）：


下面是完整实现代码(或点击这里察看)：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         title="Installing Super Awesome Component Set for Flex 3"
  4.         layout="vertical"
  5.         width="480"
  6.         height="240"
  7.         titleStyleName="titleText"
  8.         backgroundColor="white"
  9.         backgroundAlpha="1.0"
  10.         borderColor="white"
  11.         borderAlpha="1.0"
  12.         cornerRadius="0"
  13.         dropShadowEnabled="false"
  14.         showCloseButton="true"
  15.         close="titleWindow_close(event)">
  16.  
  17.     <mx:Script>
  18.         <![CDATA[
  19.             import mx.controls.Alert;
  20.             import mx.events.CloseEvent;
  21.             import mx.managers.PopUpManager;
  22.  
  23.             private function titleWindow_close(evt:CloseEvent):void {
  24.                 PopUpManager.removePopUp(this)
  25.             }
  26.  
  27.             private function titleWindow_continue():void {
  28.                 Alert.show("Installing...");
  29.                 PopUpManager.removePopUp(this);
  30.             }
  31.         ]]>
  32.     </mx:Script>
  33.  
  34.     <mx:Style>
  35.         .titleText {
  36.             fontSize: 14px;
  37.         }
  38.         .headingText {
  39.             paddingTop: 10px;
  40.             paddingBottom: 10px;
  41.             fontSize: 10px;
  42.         }
  43.     </mx:Style>
  44.  
  45.     <mx:Text text="You must accept the software license terms in order to continue the installation."
  46.             width="100%"
  47.             styleName="headingText" />
  48.  
  49.     <mx:TextArea text="The quick brown fox jumped over the lazy dog"
  50.             width="100%"
  51.             height="100%" />
  52.  
  53.     <mx:HBox width="100%">
  54.         <mx:CheckBox id="checkBox"
  55.                 label="Click here to accept the software license terms."
  56.                 width="100%" />
  57.  
  58.         <mx:Button label="Continue"
  59.                 enabled="{checkBox.selected}"
  60.                 click="titleWindow_continue()" />
  61.     </mx:HBox>
  62.  
  63. </mx:TitleWindow>
代码：Peter deHaan 翻译/整理/编译：minidxer

Topics: Flex | Tags: , , , , , , ,

Related Post

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll

Sponsored Ads