samples/themes/zen/src/zen/skins/ListSkin.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.

-->


<!--- The default skin class for a Spark List component.  

@see spark.components.List

@langversion 3.0
@playerversion Flash 10
@playerversion AIR 1.5
@productversion Flex 4
-->
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"
			 xmlns:fb="http://ns.adobe.com/flashbuilder/2009" minWidth="112" minHeight="112"
			 alpha.disabled="0.5" blendMode="normal"> 
	
	<fx:Metadata>
		<![CDATA[ 
		/** 
		* @copy spark.skins.spark.ApplicationSkin#hostComponent
		*/
		[HostComponent("spark.components.List")]
		]]>
	</fx:Metadata> 
	<fx:Script fb:purpose="styling">
		
		/**
		 * @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;
				scroller.minViewportInset = 1;
			}
			else
			{
				border.visible = false;
				background.left = background.top = background.right = background.bottom = 0;
				scroller.minViewportInset = 0;
			}
			
			borderStroke.color = getStyle("borderColor");
			borderStroke.alpha = getStyle("borderAlpha");
			
			super.updateDisplayList(unscaledWidth, unscaledHeight);
		}
	</fx:Script>
    
    <s:states>
    	<s:State name="normal" />
    	<s:State name="disabled" />
    </s:states>
    
	<fx:Declarations>
		<!--- Defines the appearance of the the List's drop indicator.
		To customize the drop indicator appearance, create a custom ListSkin class.
		The List's layout takes care to size and position the dropIndicator.
		The size of the <code>dropIndicator</code> is typically set to the size of the gaps between the items.
		The minimum and maximum settings are typically respected only in the direction
		along the major axis (the gap axis).  For example a VerticalLayout ignores the 
		<code>minWidth</code> and <code>maxWidth</code> settings, 
		but respect <code>minHeight</code> and <code>maxHeight</code>. -->
		<fx:Component id="dropIndicator">
			<s:Group minWidth="3" minHeight="3" maxWidth="3" maxHeight="3">
				<s:Rect left="0" right="0" top="0" bottom="0">
					<s:fill>
						<!--- Defines the color of the background. -->
						<s:SolidColor color="0xBBBBBB" />
					</s:fill>
					<s:stroke>
						<s:SolidColorStroke color="0x868686" weight="1"/>
					</s:stroke>
				</s:Rect>
			</s:Group>
		</fx:Component>
	</fx:Declarations>
	
	<!-- border -->
	<s:Rect left="0" right="0" top="0" bottom="0" id="border">
		<s:stroke>
			<s:SolidColorStroke id="borderStroke" weight="1" color="0x82826b" />
		</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="0xf3f4de" />
		</s:fill>
	</s:Rect>
	
	<!--- The Scroller component to add scroll bars to the list. -->
	<s:Scroller left="0" top="0" right="0" bottom="0" id="scroller" minViewportInset="1" hasFocusableChildren="false">
		<!--- The container for the data items. -->
		<s:DataGroup id="dataGroup" itemRenderer="zen.skins.DefaultItemRenderer">
			<s:layout>
				<s:VerticalLayout gap="0" horizontalAlign="contentJustify" />
			</s:layout>
		</s:DataGroup>
	</s:Scroller>
</s:Skin>