jsgkj/gkaq/yjpt-flex/trunk/src/skins/AlertNormalButtonSkin.mxml

<?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin name="CustomDefaultButtonSkin"
			 xmlns:fx="http://ns.adobe.com/mxml/2009"
			 xmlns:s="library://ns.adobe.com/flex/spark"
			 minWidth="24" minHeight="20"
			 alpha.disabled="0.5">
	<!-- states -->
	<s:states>
		<s:State name="up" />
		<s:State name="over" stateGroups="overStates" />
		<s:State name="down" stateGroups="downStates" />
		<s:State name="disabled" stateGroups="disabledStates" />
		<s:State name="selectedUp" stateGroups="selectedStates, selectedUpStates" />
		<s:State name="selectedOver" stateGroups="overStates, selectedStates" />
		<s:State name="selectedDown" stateGroups="downStates, selectedStates" />
		<s:State name="selectedDisabled" stateGroups="selectedUpStates, disabledStates, selectedStates" />
	</s:states>
	
	<fx:Script>
		<![CDATA[
			[Bindable]
			public var cornerRadius:Number = 8;
			
			override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
				var cr:Number = getStyle("cornerRadius");
				
				if (cornerRadius != cr) {
					cornerRadius = cr;
				}
				super.updateDisplayList(unscaledWidth, unscaledHeight);
			}
		]]>
	</fx:Script>
	
	<!-- layer 1: shadow -->
	<s:Rect left="-1" right="-1" top="-1" bottom="-1" radiusX="{cornerRadius}">
		<s:fill>
			<s:LinearGradient rotation="90">
				<s:GradientEntry color="0x4fa119"
								 color.downStates="0x4fa119"
								 alpha="0.01"
								 alpha.downStates="0" />
				<s:GradientEntry color="0xffffff"
								 color.downStates="0xffffff"
								 alpha="0.07"
								 alpha.downStates="0.5" />
			</s:LinearGradient>
		</s:fill>
	</s:Rect>
	
	<!-- layer 2: fill -->
	<s:Rect left="1" right="1" top="1" bottom="1" radiusX="{cornerRadius}">
		<s:fill>
			<s:LinearGradient rotation="90">
				<s:GradientEntry color="#4fa119"
								 color.selectedUpStates="#3a7811"
								 color.overStates="#3a7811"
								 color.downStates="#3a7811"
								 alpha.selectedOver="1" />
				<s:GradientEntry color="0x337b03"
								 color.selectedUpStates="#337b03"
								 color.over="#337b03"
								 color.selectedOver="#337b03"
								 color.downStates="#337b03"
								 alpha.selectedOver="1" />
			</s:LinearGradient>
		</s:fill>
	</s:Rect>
	
	<!-- layer 3: fill lowlight -->
	<s:Rect left="1" right="1" bottom="1" height="9" radiusX="{cornerRadius}">
		<s:fill>
			<s:LinearGradient rotation="90">
				<s:GradientEntry color="0x4fa119" alpha="0.0099" />
				<s:GradientEntry color="0x3a7811" alpha="0.0627" />
			</s:LinearGradient>
		</s:fill>
	</s:Rect>
	
	<!-- layer 4: fill highlight -->
	<s:Rect left="1" right="1" top="1" height="9" radiusX="{cornerRadius}">
		<s:fill>
			<s:SolidColor color="0x3a7811"
						  alpha="0.32"
						  alpha.selectedUpStates="0.22"
						  alpha.overStates="0.22"
						  alpha.downStates="0.12" />
		</s:fill>
	</s:Rect>
	
	<!-- layer 5: highlight stroke (all states except down) -->
	<s:Rect left="1" right="1" top="1" bottom="1" radiusX="{cornerRadius}" excludeFrom="downStates">
		<s:stroke>
			<s:LinearGradientStroke rotation="90" weight="1">
				<s:GradientEntry color="#3a7811" alpha.overStates="0.22" alpha.selectedUpStates="0.33" />
				<s:GradientEntry color="#3a7811" alpha.overStates="0.22" alpha.selectedUpStates="0.33" />
			</s:LinearGradientStroke>
		</s:stroke>
	</s:Rect>
	
	<!-- layer 6: highlight stroke (down state only) -->
	<s:Rect left="1" top="1" bottom="1" width="1"
			includeIn="downStates, selectedUpStates, selectedOver">
		<s:fill>
			<s:SolidColor color="0x000000" alpha="0.07" />
		</s:fill>
	</s:Rect>
	<s:Rect right="1" top="1" bottom="1" width="1"
			includeIn="downStates, selectedUpStates, selectedOver">
		<s:fill>
			<s:SolidColor color="0x000000" alpha="0.07" />
		</s:fill>
	</s:Rect>
	<s:Rect left="2" top="1" right="2" height="1"
			includeIn="downStates, selectedUpStates, selectedOver">
		<s:fill>
			<s:SolidColor color="0x000000" alpha="0.25" />
		</s:fill>
	</s:Rect>
	<s:Rect left="1" top="2" right="1" height="1"
			includeIn="downStates, selectedUpStates, selectedOver">
		<s:fill>
			<s:SolidColor color="0x000000" alpha="0.09" />
		</s:fill>
	</s:Rect>
	
	<!-- layer 7: border - put on top of the fill so it doesn't disappear when scale is less than 1 -->
	<s:Rect left="0" right="0" top="0" bottom="0" width="69" height="20" radiusX="{cornerRadius}">
		<s:stroke>
			<s:LinearGradientStroke rotation="90" weight="1">
				<s:GradientEntry color="0x2f5e0f"
								 alpha="0.5625"
								 alpha.down="0.6375"
								 alpha.selectedStates="0.6375" />
				<s:GradientEntry color="0x2f5e0f"
								 alpha="0.75"
								 alpha.down="0.85"
								 alpha.selectedStates="0.85" />
			</s:LinearGradientStroke>
		</s:stroke>
	</s:Rect>
	
</s:SparkSkin>