frameworks/projects/experimental/src/spark/skins/MenuSkin.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"
			 minWidth="112" minHeight="30"
             alpha.disabled="0.5" blendMode="normal">
    <fx:Metadata>
        <![CDATA[
        /**
        * @copy spark.skins.spark.ApplicationSkin#hostComponent
        */
        [HostComponent("spark.components.List")]
        ]]>
    </fx:Metadata>

    <s:states>
        <s:State name="normal" />
        <s:State name="disabled" />
    </s:states>

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

    <!-- fill -->
    <!--- Defines the background appearance of the list-based component. -->
    <s:Rect id="background" left="1" right="1" top="1" bottom="1" >
        <s:fill>
            <!--- Defines the color of the background. The default color is 0xFFFFFF. -->
            <s:SolidColor id="bgFill" color="0xFFFFFF" />
        </s:fill>
    </s:Rect>

    <s:DataGroup id="dataGroup" left="0" top="0" right="0" bottom="0"
				 itemRenderer="spark.components.itemRenderers.MenuItemRenderer">
        <s:layout>
            <!--- The default layout is vertical and measures at least for 5 rows.
            When switching to a different layout, HorizontalLayout for example,
            make sure to adjust the minWidth, minHeihgt sizes of the skin -->
            <s:VerticalLayout gap="0" horizontalAlign="contentJustify" requestedMinRowCount="1" />
        </s:layout>
    </s:DataGroup>

	<fx:Script fb:purpose="styling">
		/* Define the skin elements that should not be colorized.
		For list, the skin itself is colorized but the individual parts are not. */
		static private const exclusions:Array = ["background"];

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

		/* Define the content fill items that should be colored by the "contentBackgroundColor" style. */
		static private const contentFill:Array = ["bgFill"];

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

		/**
		 * @private
		 */
		override protected function initializationComplete():void
		{
			useChromeColor = true;
			super.initializationComplete();
		}
		/**
		 *  @langversion 3.0
		 *  @playerversion Flash 10.1
		 *  @playerversion AIR 2.5
		 *  @productversion Flex 4.5
		 */
		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;
				dataGroup.left = dataGroup.top = dataGroup.right = dataGroup.bottom = 1;
			}
			else
			{
				border.visible = false;
				background.left = background.top = background.right = background.bottom = 0;
				dataGroup.left = dataGroup.top = dataGroup.right = dataGroup.bottom = 0;
			}

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

			super.updateDisplayList(unscaledWidth, unscaledHeight);
		}
	</fx:Script>
</s:SparkSkin>