Flex中如何通过在全局selector中设置不同的样式（如：modalTransparencyBlur, modalTransparency, modalTransparencyColor以及modalTransparencyDuration）使其应用于Alert和PopUpManager的对话框的例子

By Minidxer | October 19, 2008

接下来的例子演示了Flex中如何通过在全局selector中设置不同的样式（如：modalTransparencyBlur, modalTransparency, modalTransparencyColor以及modalTransparencyDuration），使其应用于Alert和PopUpManager的对话框。

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


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

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:Style>
  8.         global {
  9.             modalTransparencyBlur: 0;
  10.             modalTransparency: 0.8;
  11.             modalTransparencyColor: black;
  12.             modalTransparencyDuration: 500;
  13.         }
  14.     </mx:Style>
  15.  
  16.     <mx:Script>
  17.         <![CDATA[
  18.             import mx.controls.Alert;
  19.             import mx.managers.PopUpManager;
  20.  
  21.             private function showAlert():void {
  22.                 Alert.show("hello", "world");
  23.             }
  24.  
  25.             private function showContactForm():void {
  26.                 var contactForm:ContactForm = new ContactForm();
  27.                 PopUpManager.addPopUp(contactForm, this, true);
  28.             }
  29.         ]]>
  30.     </mx:Script>
  31.  
  32.     <mx:ApplicationControlBar dock="true">
  33.         <mx:Button label="Alert" click="showAlert();" />
  34.         <mx:Button label="ContactForm" click="showContactForm();" />
  35.     </mx:ApplicationControlBar>
  36.  
  37. </mx:Application>

下面是ContactForm.mxml的代码：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         width="320"
  4.         height="240"
  5.         showCloseButton="true"
  6.         close="titleWindow_close();"
  7.         creationComplete="titleWindow_creationComplete();">
  8.  
  9.     <mx:Script>
  10.         <![CDATA[
  11.             import mx.controls.Alert;
  12.             import mx.managers.PopUpManager;
  13.  
  14.             private function titleWindow_close():void {
  15.                 PopUpManager.removePopUp(this);
  16.             }
  17.  
  18.             private function titleWindow_creationComplete():void {
  19.                 PopUpManager.centerPopUp(this);
  20.             }
  21.  
  22.             private function sendButton_click():void {
  23.                 Alert.show("Thanks for the feedback");
  24.                 titleWindow_close();
  25.             }
  26.         ]]>
  27.     </mx:Script>
  28.  
  29.     <mx:Form styleName="plain" width="100%" height="100%">
  30.         <mx:FormHeading label="Contact Us" />
  31.         <mx:FormItem label="Name:" width="100%">
  32.             <mx:TextInput id="feedbackName" width="100%" />
  33.         </mx:FormItem>
  34.         <mx:FormItem label="Email:" width="100%">
  35.             <mx:TextInput id="feedbackEmail" width="100%" />
  36.         </mx:FormItem>
  37.         <mx:FormItem label="Comments:" width="100%" height="100%">
  38.             <mx:TextArea id="feedbackComments" width="100%" height="100%" />
  39.         </mx:FormItem>
  40.     </mx:Form>
  41.  
  42.     <mx:ControlBar horizontalAlign="right">
  43.         <mx:Button id="sendButton"
  44.                 label="Send"
  45.                 click="sendButton_click();" />
  46.     </mx:ControlBar>
  47.  
  48. </mx:TitleWindow>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Alert, PopUpManager | No Comments » | Tags: , , , , ,

你可能还对下列文章感兴趣:

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll