欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Flex导航菜单

程序员文章站 2022-03-02 13:34:12
...
<?xml version="1.0" encoding="utf-8"?>
<!--created:Oct 6, 2010 file:FLEX4EffectExample1.mxml  author:Michael -->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   xmlns:comp="comp.*"
			   creationComplete="application1_creationCompleteHandler(event)" viewSourceURL="srcview/index.html">
	<s:layout>
		<s:VerticalLayout horizontalAlign="center"
						  verticalAlign="middle"/>
	</s:layout>
	<fx:Script>
		<![CDATA[
			import mx.events.FlexEvent;
			private var myTimer:Timer;

			protected function application1_creationCompleteHandler(event:FlexEvent):void
			{
				this.currentState="s1";
				doShow();
				this.myTimer=new Timer(5000);
				myTimer.addEventListener(TimerEvent.TIMER, onMoveCover);
				this.myTimer.start();

			}

			private function onMoveCover(e:TimerEvent):void
			{

				switch (this.currentState)
				{
					case "s1":
						{
							this.currentState="s2";
							doShow();
							break;
						}
					case "s2":
						{
							this.currentState="s3";
							doShow();
							break;
						}
					case "s3":
						{
							this.currentState="s1";
							doShow();
							break;
						}
				}
			}


			protected function label_clickHandler(event:MouseEvent):void
			{
				this.currentState=event.target.id;
				this.myTimer.stop();
				this.myTimer.start();
				doShow();

			}

			private function doShow():void
			{
				this.myAnimate.end();
				this.cover.visible=false;
				this.imgHolder.visible=false;
				this.cover.width=0;
				this.cover.height=0;
				this.cover.depth=0;
				this.cover.visible=true;
				this.imgHolder.visible=true;
				this.myAnimate.play();
			}
		]]>
	</fx:Script>

	<s:states>
		<s:State name="s1"/>
		<s:State name="s2"/>
		<s:State name="s3"/>
	</s:states>
	<fx:Declarations>
		<s:Animate duration="600"
				   id="myAnimate"
				   target="{cover}">
			<s:SimpleMotionPath property="width"
								valueBy="330"/>
			<s:SimpleMotionPath property="height"
								valueBy="80"/>
		</s:Animate>
	</fx:Declarations>
	<s:BorderContainer borderVisible="false">
		<s:Group width="500"
				 height="200">
			<s:BorderContainer width="200"
							   height="80"
							   depth="1"
							   top="0"
							   backgroundAlpha="0"
							   borderVisible="false">
				<mx:Image source="images/a.png" 
						  left="10"
						  top="7"/>
				<s:Label text="ITEYE首页"
						 color="0"
						 left="90"
						 top="20"
						 fontSize="24"
						 color.s1="0xFFFFFF"
						 id="s1"
						 buttonMode="true"
						 click="label_clickHandler(event)"/>
				<s:Label text="欢迎加入我们"
						 color="0"
						 color.s1="0xFFFFFF"
						 left="80"
						 top="50"
						 fontSize="14"/>
			</s:BorderContainer>
			<s:BorderContainer width="200"
							   height="80"
							   top="80"
							   depth="1"
							   backgroundAlpha="0"
							   borderVisible="false">
				<mx:Image source="images/b.png"
						  left="10"
						  top="7"/>
				<s:Label text="热点新闻"
						 left="90"
						 top="20"
						 fontSize="24"
						 color="0"
						 color.s2="0xFFFFFF"
						 id="s2"
						 buttonMode="true"
						 click="label_clickHandler(event)"/>
				<s:Label text="ITEYE博客"
						 left="80"
						 top="50"
						 fontSize="14"
						 color="0"
						 color.s2="0xFFFFFF"/>
			</s:BorderContainer>
			<s:BorderContainer width="200"
							   height="80"
							   top="160"
							   depth="1"
							   backgroundAlpha="0"
							   borderVisible="false">
				<mx:Image source="images/c.png"
						  left="10"
						  top="7"/>
				<s:Label text="ITEYE论坛"
						 left="90"
						 top="20"
						 fontSize="24"
						 color="0"
						 color.s3="0xFFFFFF"
						 id="s3"
						 buttonMode="true"
						 click="label_clickHandler(event)"/>
				<s:Label text="问答社区"
						 left="80"
						 top="50"
						 fontSize="14"
						 color="0"
						 color.s3="0xFFFFFF"/>
			</s:BorderContainer>

			<s:BorderContainer width="400"
							   height="240"
							   left="300"
							   backgroundImage.s1="@Embed('images/img1.png')"
							   id="imgHolder"
							   backgroundImage.s2="@Embed('images/img2.png')"
							   backgroundImage.s3="@Embed('images/img3.png')"
							   backgroundImageFillMode="clip"
							   borderVisible="false"
							   showEffect="Fade"
							   visible="false"/>
			<comp:MyCover depth="0"
						  top.s1="0"
						  top.s2="80"
						  top.s3="160"
						  height="0"
						  width="0"
						  showEffect="{myAnimate}"
						  id="cover"
						  visible="false"/>
		</s:Group>

	</s:BorderContainer>

</s:Application>
 
  • Flex导航菜单 
            
    
    博客分类: Flex FlexITeyeAdobeXML 
  • 大小: 38.8 KB