<mx:VBox xmlns="*" xmlns:mx="http://www.adobe.com/2006/mxml" horizontalAlign="left" width="100%" height="100%">
	<mx:Script>
		<![CDATA[
		
			[Embed(source="../../../../Assets/Images/PanelImages/PanelBackgroundSkin.gif")]
			public var panelSkinGif:Class;
			
			[Bindable]
			[Embed(source="../../../../Assets/Images/smallredrect.jpg")]
			public var ticon:Class;
		]]>
	</mx:Script>
	<mx:Style> 
		.myPanel
		{   
			borderSkin: ClassReference("component_Panel_Gif_BorderSkin_panelSkinGif");
		} 
	</mx:Style>
	<mx:Panel id="myPanelBSgif" titleIcon="{ticon}" width="550" height="400" title="Title" status="{String(myBtngif.width)}" styleName="myPanel" paddingBottom="40" paddingLeft="25" paddingTop="60" paddingRight="25" color="white" headerHeight="60" >
	<mx:Canvas width="100%" height="100%" borderStyle="solid" borderColor="red">
	<mx:Button id="myBtngif" width="{myhsbs.value}" label="My Button" />
	<mx:Button label="Center Button" horizontalCenter="0" verticalCenter="0"  />
	</mx:Canvas>
	<mx:ControlBar>
		<mx:HSlider id="myhsbs" minimum="0" maximum="800" value="100" width="100%" snapInterval="2"/>
	</mx:ControlBar>
	</mx:Panel>
	<mx:Button id="BtnGif" label="Change Panel Height and Width" click="myPanelBSgif.width=500 ;myPanelBSgif.height=400;" />
</mx:VBox>