frameworks/projects/experimental/src/spark/skins/AlertSkin.mxml

<?xml version="1.0" encoding="utf-8"?>
<!--
////////////////////////////////////////////////////////////////////////////////
//
//  Licensed to the Apache Software Foundation (ASF) under one or more
//  contributor license agreements.  See the NOTICE file distributed with
//  this work for additional information regarding copyright ownership.
//  The ASF licenses this file to You under the Apache License, Version 2.0
//  (the "License"); you may not use this file except in compliance with
//  the License.  You may obtain a copy of the License at
//
//      http://www.apache.org/licenses/LICENSE-2.0
//
//  Unless required by applicable law or agreed to in writing, software
//  distributed under the License is distributed on an "AS IS" BASIS,
//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
//  See the License for the specific language governing permissions and
//  limitations under the License.
//
////////////////////////////////////////////////////////////////////////////////
-->
<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
			 xmlns:fb="http://ns.adobe.com/flashbuilder/2009" blendMode="normal" mouseEnabled="false"
			 minWidth="131" minHeight="30" alpha.disabled="0.5" alpha.disabledWithControlBar="0.5">
	<fx:Metadata>
		<![CDATA[
        [HostComponent("spark.components.Alert")]
        ]]>
	</fx:Metadata>

	<fx:Script fb:purpose="styling">
		/* Define the skin elements that should not be colorized.
		For panel, border and title background are skinned, but the content area and title text are not. */
		static private const exclusions:Array = ["background", "titleDisplay", "contentGroup", "controlBarGroup"];

		/**
		 * @private
		 */
		override public function get colorizeExclusions():Array {return exclusions;}

		/**
		 * @private
		 */
		override protected function initializationComplete():void
		{
			useChromeColor = true;
			super.initializationComplete();
		}

		/**
		 * @private
		 */
		override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
		{
			if (getStyle("borderVisible") == true)
			{
				border.visible = true;
				background.left = background.top = background.right = background.bottom = 1;
				contents.left = contents.top = contents.right = contents.bottom = 1;
			}
			else
			{
				border.visible = false;
				background.left = background.top = background.right = background.bottom = 0;
				contents.left = contents.top = contents.right = contents.bottom = 0;
			}

			dropShadow.visible = getStyle("dropShadowVisible");

			var cr:Number = getStyle("cornerRadius");
			var withControls:Boolean =
				(currentState == "disabledWithControlBar" ||
					currentState == "normalWithControlBar");

			if (cornerRadius != cr)
			{
				cornerRadius = cr;

				dropShadow.tlRadius = cornerRadius;
				dropShadow.trRadius = cornerRadius;
				dropShadow.blRadius = withControls ? cornerRadius : 0;
				dropShadow.brRadius = withControls ? cornerRadius : 0;

				setPartCornerRadii(topMaskRect, withControls);
				setPartCornerRadii(border, withControls);
				setPartCornerRadii(background, withControls);
			}

			if (bottomMaskRect) setPartCornerRadii(bottomMaskRect, withControls);

			borderStroke.color = getStyle("borderColor");
			borderStroke.alpha = getStyle("borderAlpha");
			backgroundFill.color = getStyle("backgroundColor");
			backgroundFill.alpha = getStyle("backgroundAlpha");

			super.updateDisplayList(unscaledWidth, unscaledHeight);
		}

		/**
		 * @private
		 */
		private function setPartCornerRadii(target:Rect, includeBottom:Boolean):void
		{
			target.topLeftRadiusX = cornerRadius;
			target.topRightRadiusX = cornerRadius;
			target.bottomLeftRadiusX = includeBottom ? cornerRadius : 0;
			target.bottomRightRadiusX = includeBottom ? cornerRadius : 0;
		}

		private var cornerRadius:Number;
	</fx:Script>

	<fx:Declarations>
		<s:Group id="contentGroup" />
	</fx:Declarations>

	<s:states>
		<s:State name="normal" />
		<s:State name="disabled" />
		<s:State name="normalWithControlBar" stateGroups="withControls" />
		<s:State name="disabledWithControlBar" stateGroups="withControls" />
	</s:states>

	<!-- drop shadow can't be hittable so it stays sibling of other graphics -->
	<!--- @private -->
	<s:RectangularDropShadow id="dropShadow" blurX="20" blurY="20" alpha="0.32" distance="11"
							 angle="90" color="#000000" left="0" top="0" right="0" bottom="0"/>

	<!-- drop shadow can't be hittable so all other graphics go in this group -->
	<s:Group left="0" right="0" top="0" bottom="0">

		<!-- top group mask -->
		<!--- @private -->
		<s:Group left="1" top="1" right="1" bottom="1" id="topGroupMask" >
			<!--- @private -->
			<s:Rect id="topMaskRect" left="0" top="0" right="0" bottom="0">
				<s:fill>
					<s:SolidColor alpha="0"/>
				</s:fill>
			</s:Rect>
		</s:Group>

		<!-- bottom group mask -->
		<!--- @private -->
		<s:Group left="1" top="1" right="1" bottom="1" id="bottomGroupMask"
				 includeIn="normalWithControlBar, disabledWithControlBar">
			<!--- @private -->
			<s:Rect id="bottomMaskRect" left="0" top="0" right="0" bottom="0">
				<s:fill>
					<s:SolidColor alpha="0"/>
				</s:fill>
			</s:Rect>
		</s:Group>

		<!-- layer 1: border -->
		<!--- @private -->
		<s:Rect id="border" left="0" right="0" top="0" bottom="0" >
			<s:stroke>
				<!--- @private -->
				<s:SolidColorStroke id="borderStroke" weight="1" />
			</s:stroke>
		</s:Rect>

		<!-- layer 2: background fill -->
		<!--- Defines the appearance of the PanelSkin class's background. -->
		<s:Rect id="background" left="1" top="1" right="1" bottom="1">
			<s:fill>
				<!--- @private
				Defines the  PanelSkin class's background fill. The default color is 0xFFFFFF. -->
				<s:SolidColor id="backgroundFill" color="#FFFFFF"/>
			</s:fill>
		</s:Rect>

		<!-- layer 3: contents -->
		<!--- Contains the vertical stack of titlebar content and controlbar. -->
		<s:Group left="1" right="1" top="1" bottom="1" id="contents">
			<s:layout>
				<s:VerticalLayout gap="0" horizontalAlign="justify" />
			</s:layout>

			<!--- @private -->
			<s:Group id="topGroup" mask="{topGroupMask}">

				<!-- layer 0: title bar fill -->
				<!--- @private -->
				<s:Rect id="tbFill" left="0" right="0" top="0" bottom="1">
					<s:fill>
						<s:LinearGradient rotation="90">
							<s:GradientEntry color="0xE2E2E2" />
							<s:GradientEntry color="0xD9D9D9" />
						</s:LinearGradient>
					</s:fill>
				</s:Rect>

				<!-- layer 1: title bar highlight -->
				<!--- @private -->
				<s:Rect id="tbHilite" left="0" right="0" top="0" bottom="0">
					<s:stroke>
						<s:LinearGradientStroke rotation="90" weight="1">
							<s:GradientEntry color="0xEAEAEA" />
							<s:GradientEntry color="0xD9D9D9" />
						</s:LinearGradientStroke>
					</s:stroke>
				</s:Rect>

				<!-- layer 2: title bar divider -->
				<!--- @private -->
				<s:Rect id="tbDiv" left="0" right="0" height="1" bottom="0">
					<s:fill>
						<s:SolidColor color="0xC0C0C0" />
					</s:fill>
				</s:Rect>

				<!-- layer 3: text -->
				<!--- @copy spark.components.Panel#titleDisplay -->
				<s:Label id="titleDisplay" maxDisplayedLines="1"
						 left="9" right="3" top="1" bottom="0" minHeight="30"
						 verticalAlign="middle" fontWeight="bold">
				</s:Label>
			</s:Group>

			<!--
			Note: setting the minimum size to 0 here so that changes to the host component's
			size will not be thwarted by this skin part's minimum size.   This is a compromise,
			more about it here: http://bugs.adobe.com/jira/browse/SDK-21143
			-->
			<!--- @copy spark.components.SkinnableContainer#contentGroup -->
			<!--<s:Group id="contentGroup" width="100%" height="100%" minWidth="0" minHeight="0">
			</s:Group>-->
			<s:HGroup width="100%" height="100%" verticalAlign="middle" horizontalAlign="center">
				<s:Group id="iconGroup" height="100%">

				</s:Group>
				<s:VGroup width="100%" height="100%" paddingLeft="5" paddingRight="5" paddingBottom="5"
						  paddingTop="5"
						  verticalAlign="middle" horizontalAlign="center">
					<s:RichText id="messageDisplay"
							 left="9" right="3" top="1" bottom="0" minHeight="30" maxWidth="400"
							 verticalAlign="middle"/>
					<s:HGroup id="buttonGroup" width="100%" minWidth="0" minHeight="0"
							   horizontalAlign="center"/>
				</s:VGroup>
			</s:HGroup>


			<!--- @private -->
			<s:Group id="bottomGroup" minWidth="0" minHeight="0"
					 includeIn="normalWithControlBar, disabledWithControlBar" >

				<s:Group left="0" right="0" top="0" bottom="0" mask="{bottomGroupMask}">

					<!-- layer 0: control bar divider line -->
					<s:Rect left="0" right="0" top="0" height="1" alpha="0.22">
						<s:fill>
							<s:SolidColor color="0x000000" />
						</s:fill>
					</s:Rect>

					<!-- layer 1: control bar highlight -->
					<s:Rect left="0" right="0" top="1" bottom="0">
						<s:stroke>
							<s:LinearGradientStroke rotation="90" weight="1">
								<s:GradientEntry color="0xE5E5E5" />
								<s:GradientEntry color="0xD8D8D8" />
							</s:LinearGradientStroke>
						</s:stroke>
					</s:Rect>

					<!-- layer 2: control bar fill -->
					<s:Rect left="1" right="1" top="2" bottom="1">
						<s:fill>
							<s:LinearGradient rotation="90">
								<s:GradientEntry color="0xDADADA" />
								<s:GradientEntry color="0xC5C5C5" />
							</s:LinearGradient>
						</s:fill>
					</s:Rect>
				</s:Group>
				<!-- layer 3: control bar -->
				<!--- @copy spark.components.Panel#controlBarGroup -->
				<s:Group id="controlBarGroup" left="0" right="0" top="1" bottom="1" minWidth="0" minHeight="0">
					<s:layout>
						<s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="7" paddingBottom="7" gap="10" />
					</s:layout>
				</s:Group>
			</s:Group>
		</s:Group>
	</s:Group>
</s:SparkSkin>