I am having some trouble making things work for a custom titleWindow. I want to be able to minimize, maximize, and use an effect on create and close. I can get it all to work except for the close. And it does work except that when the state is collapsed, it expands then fades away. Any help would be much appreciated.Casey Bentz<?xml version="1.0" encoding="utf-8"?>
<utils:TitleButtonWindow xmlns:utils = "com.utils.*"
xmlns:mx = "http://www.adobe.com/2006/mxml"
width = "{Model.instance.stageWidth * .99}"
height = "{Model.instance.stageHeight * .99}"
backgroundAlpha = "0"
title = "{permit.FILE_NAME}"
titleIcon = "@Embed('com/assets/icons/i_permit3.png')"
horizontalScrollPolicy= "off"
verticalScrollPolicy = "off"
titleBtnClick= "changeState();"
creationCompleteEffect= "{addEffect}"
addedEffect= "{addEffect}"
removedEffect= "{removeEffect}"
showCloseButton= "true"
close= "this.closePopUp();">
<mx:Script>
<![CDATA[
import mx.core.Application;
import mx.managers.PopUpManager;
import com.model.Model;
private var _isVisible : Boolean = false;
private var _permit : Object;
[Bindable]
public function get permit():Object{
return _permit;
}
public function set permit(value:Object):void{
_permit = value;
}
public function showPopUp():void
{
if (!this._isVisible)
{
PopUpManager.addPopUp( this, mx.core.Application.application.mainView );
PopUpManager.centerPopUp( this );
this._isVisible = true;
}
}
public function closePopUp():void
{
this._isVisible = false;
PopUpManager.removePopUp( this );
}
private function changeState():void
{
switch( currentState )
{
case "":
case null:
currentState = "collapsedState";
break;
case "collapsedState":
currentState = "";
break;
}
}
]]>
</mx:Script>
<!-- States -->
<utils:states>
<mx:State name="collapsedState">
<mx:SetProperty name="height" value="38"/>
</mx:State>
</utils:states>
<utils:transitions>
<mx:Transition fromState="*" toState="collapsedState">
<mx:Sequence targets="{ [this] }">
<mx:Resize target="{this}" duration="500"/>
</mx:Sequence>
</mx:Transition>
<mx:Transition fromState="collapsedState" toState="*">
<mx:Resize target="{this}" duration="500"/>
</mx:Transition>
</utils:transitions>
<!-- Effects -->
<mx:Fade id="addEffect" duration="1000" alphaFrom="0" alphaTo="1"/>
<mx:Fade id="removeEffect" duration="1000" alphaFrom="1" alphaTo="0"/>
<mx:VBox width="100%" height="100%" styleName="panelBox">
<mx:Label text="{}"
</mx:VBox>
</utils:TitleButtonWindow>
Custom Title Windowpackage com.utils
{
import com.events.TitleButtonClickEvent;
import flash.events.MouseEvent;
import flash.filters.GlowFilter;
import mx.containers.HBox;
import mx.containers.TitleWindow;
import mx.controls.Image;
[Event(name="titleBtnClick", type="flash.events.MouseEvent")]
public class TitleButtonWindow extends TitleWindow
{
private var _titleBtn:HBox = new HBox();
public var _source:String = "";
public function TitleButtonWindow()
{
super();
}
override protected function createChildren():void{
super.createChildren();
_titleBtn.visible = false;
_titleBtn.height = 22;
_titleBtn.width = 22;
_titleBtn.useHandCursor = true;
_titleBtn.buttonMode = true;
_titleBtn.mouseChildren = false;
_titleBtn.addEventListener(MouseEvent.CLICK, handleTitleBtnClick);
var img:Image = new Image();
img.source = _source;
img.height = 20;
img.width = 20;
var filter:GlowFilter = new GlowFilter(0x000000, .5,8,8);
var arr:Array = [filter];
img.filters = arr;
_titleBtn.addChild(img);
titleBar.addChild(_titleBtn);
}
override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
super.updateDisplayList(unscaledWidth, unscaledHeight);
var y:int = 4;
var x:int = this.width - _titleBtn.width - 32;
_titleBtn.move(x,y);
}
private function handleTitleBtnClick(e:MouseEvent):void{
var event:TitleButtonClickEvent = new TitleButtonClickEvent('titleBtnClick', e);
dispatchEvent(event);
}
}
}
