Hello,Flex4之Panel动态切换效果

最新推荐文章于 2025-08-16 01:38:26 发布

haha_mingg

最新推荐文章于 2025-08-16 01:38:26 发布

阅读量2.2k

点赞数

文章标签： flex library application encoding function bash

本文介绍如何在Flex中通过双击面板标题实现最大化功能，通过编写相应的MXML和ActionScript代码来实现这一交互效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

双击Panel的标题可以实现最大化:

HPanel.mxml:
<?xml version="1.0" encoding="utf-8"?>
<s:Panel xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
creationComplete="onCreationComplete()">
<fx:Metadata>
[Event(name="headerClick")]
</fx:Metadata>
<fx:Script>
<![CDATA[
import flash.events.Event;

import spark.skins.spark.PanelSkin;
private function onCreationComplete():void
{
var panelSkin:PanelSkin=skin as PanelSkin;
if(panelSkin==null) return;
panelSkin.addEventListener(MouseEvent.CLICK,onHeaderClick);
}

private function onHeaderClick(event:MouseEvent):void
{
if(event.currentTarget is PanelSkin)
{
var ps:PanelSkin=PanelSkin(event.currentTarget);
if(event.localY<30)
{
dispatchEvent(new Event("headerClick"));
}
}
}
]]>
</fx:Script>
<s:layout>
<s:VerticalLayout paddingLeft="10" paddingTop="10"
paddingBottom="10" paddingRight="10"/>
</s:layout>
</s:Panel>

FlexTest.mxml

<?xml version="1.0" encoding="utf-8"?>
<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="components.*"
   width="100%" height="100%">
<fx:Script>
<![CDATA[
private function toggleState(newState:String):void
{
currentState=(currentState==newState)?'':newState;
}
]]>
</fx:Script>
<s:layout>
<s:BasicLayout/>
</s:layout>
<s:states>
<s:State name="default"/>
<s:State name="stateOne" stateGroups="[noStateTwo,noStateThree]"/>
<s:State name="stateTwo" stateGroups="[noStateOne,noStateThree]"/>
<s:State name="stateThree" stateGroups="[noStateOne,noStateTwo]"/>
</s:states>
<comp:HPanel id="stateOnePanel" title="State One Panel"
left="10" top="10" width="200" right.stateOne="10"
height="100" bottom.stateOne="10" excludeFrom="noStateOne"
headerClick="toggleState('stateOne')">
<s:Label text="松尾芭蕉" fontSize="20" fontSize.stateOne="140"/>
</comp:HPanel>

<comp:HPanel id="stateTwoPanel" title="State Two Panel"
left="10" bottom="10" top="115" top.stateTwo="10"
width="200" right.stateTwo="10" excludeFrom="noStateTwo"
headerClick="toggleState('stateTwo')">
<s:Label width="100%" height="100%" fontStyle="italic"
text="I am trusting that the following pages
http://en.wikipedia.org/wiki/Matsuo_Bash%C5%8D
and http://en.wikisource.org/wiki/Frog_Poem
have the Kanji of Matsuo Bashō's name and
famous poem correct.)"/>
</comp:HPanel>
<comp:HPanel id="stateThreePanel" title="State Three Pane"
excludeFrom="noStateThree" top="10" left="220"
left.stateThree="10" right="10" bottom="10"
headerClick="toggleState('stateThree')">
<s:Label fontSize="50" fontSize.stateThree="70" text="古池や蛙飛びこむ水の音"/>
<s:Label text="--Matsuo Bashō
The ancient pondA frog leaps inThe sound of the water.
--Donald Keene"/>
</comp:HPanel>
</s:Application>