You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by ah...@apache.org on 2014/08/01 07:44:03 UTC

[42/51] [partial] this folder was called TourDeFlex_content.com and was hidden by .gitignore

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/martin.jpg.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/martin.jpg.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/martin.jpg.html
new file mode 100644
index 0000000..055b15f
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/martin.jpg.html
@@ -0,0 +1,28 @@
+<!--
+  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.
+-->
+<!-- saved from url=(0014)about:internet -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
+<title>martin.jpg</title>
+</head>
+
+<body>
+<img src="martin.jpg" border="0"/>
+</body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/martinez.jpg.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/martinez.jpg.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/martinez.jpg.html
new file mode 100644
index 0000000..6d61060
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/martinez.jpg.html
@@ -0,0 +1,28 @@
+<!--
+  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.
+-->
+<!-- saved from url=(0014)about:internet -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
+<title>martinez.jpg</title>
+</head>
+
+<body>
+<img src="martinez.jpg" border="0"/>
+</body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/palmer.jpg.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/palmer.jpg.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/palmer.jpg.html
new file mode 100644
index 0000000..165e71b
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/palmer.jpg.html
@@ -0,0 +1,28 @@
+<!--
+  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.
+-->
+<!-- saved from url=(0014)about:internet -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
+<title>palmer.jpg</title>
+</head>
+
+<body>
+<img src="palmer.jpg" border="0"/>
+</body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/schrute.jpg.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/schrute.jpg.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/schrute.jpg.html
new file mode 100644
index 0000000..3868182
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/schrute.jpg.html
@@ -0,0 +1,28 @@
+<!--
+  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.
+-->
+<!-- saved from url=(0014)about:internet -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
+<title>schrute.jpg</title>
+</head>
+
+<body>
+<img src="schrute.jpg" border="0"/>
+</body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/scott.jpg.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/scott.jpg.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/scott.jpg.html
new file mode 100644
index 0000000..ffb70ea
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/assets/scott.jpg.html
@@ -0,0 +1,28 @@
+<!--
+  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.
+-->
+<!-- saved from url=(0014)about:internet -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
+<title>scott.jpg</title>
+</head>
+
+<body>
+<img src="scott.jpg" border="0"/>
+</body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/data/list.out.xml.txt
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/data/list.out.xml.txt b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/data/list.out.xml.txt
new file mode 100644
index 0000000..2f32d30
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/data/list.out.xml.txt
@@ -0,0 +1,18 @@
+<!--
+
+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.
+
+-->

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/data/list.xml.txt
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/data/list.xml.txt b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/data/list.xml.txt
new file mode 100644
index 0000000..41c8928
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/data/list.xml.txt
@@ -0,0 +1,96 @@
+<?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.
+
+-->
+<list>
+    <employee employeeId="1">
+    	<firstName>Michael</firstName>
+    	<lastName>Scott</lastName>
+    	<image>assets/scott.jpg</image>
+    </employee>
+    <employee employeeId="2">
+    	<firstName>Pam</firstName>
+    	<lastName>Beesly</lastName>
+    	<image>assets/beesly.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Andy</firstName>
+    	<lastName>Bernard</lastName>
+    	<image>assets/bernard.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Creed</firstName>
+    	<lastName>Bratton</lastName>
+    	<image>assets/bratton.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Toby</firstName>
+    	<lastName>Flenderson</lastName>
+    	<image>assets/flenderson.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Jim</firstName>
+    	<lastName>Halpert</lastName>
+    	<image>assets/halpert.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Ryan</firstName>
+    	<lastName>Howard</lastName>
+    	<image>assets/howard.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Stanley</firstName>
+    	<lastName>Hudson</lastName>
+    	<image>assets/hudson.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Kelly</firstName>
+    	<lastName>Kapoor</lastName>
+    	<image>assets/kapoor.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Phyllis</firstName>
+    	<lastName>Lapin</lastName>
+    	<image>assets/lapin.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Kevin</firstName>
+    	<lastName>Malone</lastName>
+    	<image>assets/malone.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Angela</firstName>
+    	<lastName>Martin</lastName>
+    	<image>assets/martin.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Oscar</firstName>
+    	<lastName>Martinez</lastName>
+    	<image>assets/martinez.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Meredith</firstName>
+    	<lastName>Palmer</lastName>
+    	<image>assets/palmer.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Dwight</firstName>
+    	<lastName>Schrute</lastName>
+    	<image>assets/schrute.jpg</image>
+    </employee>
+</list>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/renderers/ImageRenderer1.mxml.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/renderers/ImageRenderer1.mxml.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/renderers/ImageRenderer1.mxml.html
new file mode 100644
index 0000000..4552e37
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/renderers/ImageRenderer1.mxml.html
@@ -0,0 +1,64 @@
+<!--
+  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.
+-->
+<!-- saved from url=(0014)about:internet -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+<title>ImageRenderer1.mxml</title>
+<link rel="stylesheet" type="text/css" href="../../SourceStyles.css"/>
+</head>
+
+<body><pre><span class="MXMLProcessing_Instruction">&lt;?xml version="1.0" encoding="utf-8"?&gt;</span>
+<span class="MXMLComponent_Tag">&lt;s:ItemRenderer</span><span class="MXMLDefault_Text"> xmlns:fx="</span><span class="MXMLString">http://ns.adobe.com/mxml/2009</span><span class="MXMLDefault_Text">"
+                xmlns:s="</span><span class="MXMLString">library://ns.adobe.com/flex/spark</span><span class="MXMLDefault_Text">"
+                xmlns:mx="</span><span class="MXMLString">library://ns.adobe.com/flex/mx</span><span class="MXMLDefault_Text">" 
+                autoDrawBackground="</span><span class="MXMLString">false</span><span class="MXMLDefault_Text">" 
+                depth="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" depth.hovered="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+    
+    <span class="MXMLComponent_Tag">&lt;s:states&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:State</span><span class="MXMLDefault_Text"> name="</span><span class="MXMLString">normal</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:State</span><span class="MXMLDefault_Text"> name="</span><span class="MXMLString">hovered</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:states&gt;</span>
+
+    <span class="MXMLComponent_Tag">&lt;s:postLayoutTransformOffsets&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;mx:TransformOffsets</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">offsets</span><span class="MXMLDefault_Text">" x.hovered="</span><span class="MXMLString">-40</span><span class="MXMLDefault_Text">" y.hovered="</span><span class="MXMLString">-40</span><span class="MXMLDefault_Text">" scaleX.hovered="</span><span class="MXMLString">2</span><span class="MXMLDefault_Text">" scaleY.hovered="</span><span class="MXMLString">2</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:postLayoutTransformOffsets&gt;</span>    
+    
+    <span class="MXMLComponent_Tag">&lt;s:transitions&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;mx:Transition</span><span class="MXMLDefault_Text"> fromState="</span><span class="MXMLString">normal</span><span class="MXMLDefault_Text">" toState="</span><span class="MXMLString">hovered</span><span class="MXMLDefault_Text">" autoReverse="</span><span class="MXMLString">true</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:Animate</span><span class="MXMLDefault_Text"> target="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">offsets</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" duration="</span><span class="MXMLString">200</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:SimpleMotionPath</span><span class="MXMLDefault_Text"> property="</span><span class="MXMLString">scaleX</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:SimpleMotionPath</span><span class="MXMLDefault_Text"> property="</span><span class="MXMLString">scaleY</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:SimpleMotionPath</span><span class="MXMLDefault_Text"> property="</span><span class="MXMLString">x</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:SimpleMotionPath</span><span class="MXMLDefault_Text"> property="</span><span class="MXMLString">y</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:Animate&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/mx:Transition&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;mx:Transition</span><span class="MXMLDefault_Text"> fromState="</span><span class="MXMLString">hovered</span><span class="MXMLDefault_Text">" toState="</span><span class="MXMLString">normal</span><span class="MXMLDefault_Text">" autoReverse="</span><span class="MXMLString">true</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:Animate</span><span class="MXMLDefault_Text"> target="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">offsets</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" duration="</span><span class="MXMLString">200</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:SimpleMotionPath</span><span class="MXMLDefault_Text"> property="</span><span class="MXMLString">scaleX</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:SimpleMotionPath</span><span class="MXMLDefault_Text"> property="</span><span class="MXMLString">scaleY</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:SimpleMotionPath</span><span class="MXMLDefault_Text"> property="</span><span class="MXMLString">x</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:SimpleMotionPath</span><span class="MXMLDefault_Text"> property="</span><span class="MXMLString">y</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:Animate&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/mx:Transition&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:transitions&gt;</span>    
+    
+    <span class="MXMLComponent_Tag">&lt;mx:Image</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">image</span><span class="MXMLDefault_Text">" source="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">data</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">image</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" width="</span><span class="MXMLString">60</span><span class="MXMLDefault_Text">" height="</span><span class="MXMLString">60</span><span class="MXMLDefault_Text">" horizontalCenter="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" verticalCenter="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+
+<span class="MXMLComponent_Tag">&lt;/s:ItemRenderer&gt;</span></pre></body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/renderers/ImageRenderer2.mxml.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/renderers/ImageRenderer2.mxml.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/renderers/ImageRenderer2.mxml.html
new file mode 100644
index 0000000..e1b721f
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/renderers/ImageRenderer2.mxml.html
@@ -0,0 +1,62 @@
+<!--
+  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.
+-->
+<!-- saved from url=(0014)about:internet -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+<title>ImageRenderer2.mxml</title>
+<link rel="stylesheet" type="text/css" href="../../SourceStyles.css"/>
+</head>
+
+<body><pre><span class="MXMLProcessing_Instruction">&lt;?xml version="1.0" encoding="utf-8"?&gt;</span>
+<span class="MXMLComponent_Tag">&lt;s:ItemRenderer</span><span class="MXMLDefault_Text"> xmlns:fx="</span><span class="MXMLString">http://ns.adobe.com/mxml/2009</span><span class="MXMLDefault_Text">"
+                xmlns:s="</span><span class="MXMLString">library://ns.adobe.com/flex/spark</span><span class="MXMLDefault_Text">"
+                xmlns:mx="</span><span class="MXMLString">library://ns.adobe.com/flex/mx</span><span class="MXMLDefault_Text">" 
+                autoDrawBackground="</span><span class="MXMLString">false</span><span class="MXMLDefault_Text">" 
+                depth="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" depth.hovered="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+    
+    <span class="MXMLComponent_Tag">&lt;s:states&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:State</span><span class="MXMLDefault_Text"> name="</span><span class="MXMLString">normal</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:State</span><span class="MXMLDefault_Text"> name="</span><span class="MXMLString">hovered</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:states&gt;</span>
+
+    <span class="MXMLComponent_Tag">&lt;s:transitions&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:Transition</span><span class="MXMLDefault_Text"> fromState="</span><span class="MXMLString">normal</span><span class="MXMLDefault_Text">" toState="</span><span class="MXMLString">hovered</span><span class="MXMLDefault_Text">" autoReverse="</span><span class="MXMLString">true</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:Parallel&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:Rotate3D</span><span class="MXMLDefault_Text"> target="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">image</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" angleYFrom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" angleYTo="</span><span class="MXMLString">360</span><span class="MXMLDefault_Text">" autoCenterProjection="</span><span class="MXMLString">true</span><span class="MXMLDefault_Text">" autoCenterTransform="</span><span class="MXMLString">true</span><span class="MXMLDefault_Text">" duration="</span><span class="MXMLString">400</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:Fade</span><span class="MXMLDefault_Text"> target="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">image</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" startDelay="</span><span class="MXMLString">400</span><span class="MXMLDefault_Text">" duration="</span><span class="MXMLString">200</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:Fade</span><span class="MXMLDefault_Text"> target="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">group</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" startDelay="</span><span class="MXMLString">400</span><span class="MXMLDefault_Text">" duration="</span><span class="MXMLString">200</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:Parallel&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:Transition&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:transitions&gt;</span>
+    
+    <span class="MXMLComponent_Tag">&lt;s:Rect</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">rect</span><span class="MXMLDefault_Text">" left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:fill&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:SolidColor</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">black</span><span class="MXMLDefault_Text">" alpha="</span><span class="MXMLString">0.7</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:fill&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:Rect&gt;</span>
+
+    <span class="MXMLComponent_Tag">&lt;s:Group</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">group</span><span class="MXMLDefault_Text">" left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" visible.normal="</span><span class="MXMLString">false</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:Label</span><span class="MXMLDefault_Text"> text="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">data</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">firstName</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" verticalCenter="</span><span class="MXMLString">-10</span><span class="MXMLDefault_Text">" horizontalCenter="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" color="</span><span class="MXMLString">white</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span> 
+        <span class="MXMLComponent_Tag">&lt;s:Label</span><span class="MXMLDefault_Text"> text="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">data</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">lastName</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" verticalCenter="</span><span class="MXMLString">10</span><span class="MXMLDefault_Text">" horizontalCenter="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" color="</span><span class="MXMLString">white</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span> 
+    <span class="MXMLComponent_Tag">&lt;/s:Group&gt;</span>
+
+    <span class="MXMLComponent_Tag">&lt;mx:Image</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">image</span><span class="MXMLDefault_Text">" source="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">data</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">image</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" width="</span><span class="MXMLString">70</span><span class="MXMLDefault_Text">" height="</span><span class="MXMLString">70</span><span class="MXMLDefault_Text">" horizontalCenter="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" verticalCenter="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" visible.hovered="</span><span class="MXMLString">false</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+    
+<span class="MXMLComponent_Tag">&lt;/s:ItemRenderer&gt;</span></pre></body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/sample1.mxml.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/sample1.mxml.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/sample1.mxml.html
new file mode 100644
index 0000000..6eb2493
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/sample1.mxml.html
@@ -0,0 +1,68 @@
+<!--
+  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.
+-->
+<!-- saved from url=(0014)about:internet -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+<title>sample1.mxml</title>
+<link rel="stylesheet" type="text/css" href="../SourceStyles.css"/>
+</head>
+
+<body><pre><span class="MXMLProcessing_Instruction">&lt;?xml version="1.0" encoding="utf-8"?&gt;</span>
+<span class="MXMLComponent_Tag">&lt;s:Application</span><span class="MXMLDefault_Text"> xmlns:fx="</span><span class="MXMLString">http://ns.adobe.com/mxml/2009</span><span class="MXMLDefault_Text">" 
+               xmlns:s="</span><span class="MXMLString">library://ns.adobe.com/flex/spark</span><span class="MXMLDefault_Text">" 
+               xmlns:mx="</span><span class="MXMLString">library://ns.adobe.com/flex/mx</span><span class="MXMLDefault_Text">" 
+               applicationComplete="</span><span class="ActionScriptDefault_Text">srv</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">send</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptBracket/Brace">)</span><span class="MXMLDefault_Text">" viewSourceURL="</span><span class="MXMLString">srcview/index.html</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+    
+    
+    <span class="MXMLSpecial_Tag">&lt;fx:Script&gt;</span>
+        &lt;![CDATA[
+            <span class="ActionScriptReserved">import</span> <span class="ActionScriptDefault_Text">mx</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">collections</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">ArrayCollection</span>;
+            <span class="ActionScriptReserved">import</span> <span class="ActionScriptDefault_Text">mx</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">rpc</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">events</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">ResultEvent</span>;
+            
+            <span class="ActionScriptReserved">import</span> <span class="ActionScriptDefault_Text">skins</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">TDFPanelSkin</span>;
+            
+            <span class="ActionScriptBracket/Brace">[</span><span class="ActionScriptMetadata">Bindable</span><span class="ActionScriptBracket/Brace">]</span><span class="ActionScriptReserved">private</span> <span class="ActionScriptvar">var</span> <span class="ActionScriptDefault_Text">employees</span>:<span class="ActionScriptDefault_Text">ArrayCollection</span>;
+            
+            <span class="ActionScriptReserved">private</span> <span class="ActionScriptfunction">function</span> <span class="ActionScriptDefault_Text">resultHandler</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptDefault_Text">event</span>:<span class="ActionScriptDefault_Text">ResultEvent</span><span class="ActionScriptBracket/Brace">)</span>:<span class="ActionScriptReserved">void</span>
+            <span class="ActionScriptBracket/Brace">{</span>
+                <span class="ActionScriptDefault_Text">employees</span> <span class="ActionScriptOperator">=</span> <span class="ActionScriptDefault_Text">event</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">result</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">list</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">employee</span> <span class="ActionScriptReserved">as</span> <span class="ActionScriptDefault_Text">ArrayCollection</span>;
+            <span class="ActionScriptBracket/Brace">}</span>
+            
+        <span class="ActionScriptBracket/Brace">]</span><span class="ActionScriptBracket/Brace">]</span><span class="ActionScriptOperator">&gt;</span>
+    <span class="MXMLSpecial_Tag">&lt;/fx:Script&gt;</span>
+    
+    <span class="MXMLSpecial_Tag">&lt;fx:Declarations&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:HTTPService</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">srv</span><span class="MXMLDefault_Text">" url="</span><span class="MXMLString">data/list.xml</span><span class="MXMLDefault_Text">" result="</span><span class="ActionScriptDefault_Text">resultHandler</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptDefault_Text">event</span><span class="ActionScriptBracket/Brace">)</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+    <span class="MXMLSpecial_Tag">&lt;/fx:Declarations&gt;</span>
+    
+    <span class="MXMLComponent_Tag">&lt;s:Panel</span><span class="MXMLDefault_Text"> width="</span><span class="MXMLString">100%</span><span class="MXMLDefault_Text">" height="</span><span class="MXMLString">100%</span><span class="MXMLDefault_Text">" title="</span><span class="MXMLString">Custom Item Renderer with Animation</span><span class="MXMLDefault_Text">" skinClass="</span><span class="MXMLString">skins.TDFPanelSkin</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:layout&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:HorizontalLayout</span><span class="MXMLDefault_Text"> paddingLeft="</span><span class="MXMLString">100</span><span class="MXMLDefault_Text">" paddingRight="</span><span class="MXMLString">10</span><span class="MXMLDefault_Text">" paddingTop="</span><span class="MXMLString">10</span><span class="MXMLDefault_Text">" paddingBottom="</span><span class="MXMLString">10</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:layout&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:DataGroup</span><span class="MXMLDefault_Text"> dataProvider="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">employees</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" width="</span><span class="MXMLString">300</span><span class="MXMLDefault_Text">" itemRenderer="</span><span class="MXMLString">renderers.ImageRenderer1</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:layout&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:TileLayout</span><span class="MXMLDefault_Text"> horizontalGap="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" verticalGap="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:layout&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:DataGroup&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:Label</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0x323232</span><span class="MXMLDefault_Text">" width="</span><span class="MXMLString">200</span><span class="MXMLDefault_Text">" text="</span><span class="MXMLString">The item renderer on this DataGroup uses the Spark Animate to scale the image
+when hovered over each item. See the ImageRenderer1.mxml source for more information.</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:Panel&gt;</span>
+    
+<span class="MXMLComponent_Tag">&lt;/s:Application&gt;</span></pre></body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/sample2.mxml.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/sample2.mxml.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/sample2.mxml.html
new file mode 100644
index 0000000..e51bf83
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/sample2.mxml.html
@@ -0,0 +1,82 @@
+<!--
+  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.
+-->
+<!-- saved from url=(0014)about:internet -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+<title>sample2.mxml</title>
+<link rel="stylesheet" type="text/css" href="../SourceStyles.css"/>
+</head>
+
+<body><pre><span class="MXMLProcessing_Instruction">&lt;?xml version="1.0" encoding="utf-8"?&gt;</span>
+<span class="MXMLComponent_Tag">&lt;s:Application</span><span class="MXMLDefault_Text"> xmlns:fx="</span><span class="MXMLString">http://ns.adobe.com/mxml/2009</span><span class="MXMLDefault_Text">" 
+               xmlns:s="</span><span class="MXMLString">library://ns.adobe.com/flex/spark</span><span class="MXMLDefault_Text">" 
+               xmlns:mx="</span><span class="MXMLString">library://ns.adobe.com/flex/mx</span><span class="MXMLDefault_Text">" 
+               applicationComplete="</span><span class="ActionScriptDefault_Text">srv</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">send</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptBracket/Brace">)</span><span class="MXMLDefault_Text">" viewSourceURL="</span><span class="MXMLString">srcview/index.html</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+    
+    <span class="MXMLSpecial_Tag">&lt;fx:Style&gt;</span>
+
+        <span class="CSS@namespace">@namespace</span> <span class="CSSSelector">s </span><span class="CSSString">"library://ns.adobe.com/flex/spark"</span>;
+        <span class="CSS@namespace">@namespace</span> <span class="CSSSelector">mx </span><span class="CSSString">"library://ns.adobe.com/flex/halo"</span>;
+        
+        <span class="CSS@font-face">@font-face</span> <span class="CSSDelimiters">{</span>
+            <span class="CSSProperty_Name">src</span><span class="CSSDelimiters">:</span> <span class="CSSProperty_Value">url(</span><span class="CSSString">"assets/MyriadPro-Semibold.otf"</span><span class="CSSProperty_Value">)</span><span class="CSSDelimiters">;</span>
+            <span class="CSSProperty_Name">fontFamily</span><span class="CSSDelimiters">:</span> <span class="CSSString">"main"</span><span class="CSSDelimiters">;</span>
+        <span class="CSSDelimiters">}</span>
+        
+        <span class="CSSSelector">s|Application </span><span class="CSSDelimiters">{</span>
+            <span class="CSSProperty_Name">font-family</span><span class="CSSDelimiters">:</span> <span class="CSSProperty_Value">main</span><span class="CSSDelimiters">;</span>
+            <span class="CSSProperty_Name">font-size</span><span class="CSSDelimiters">:</span> <span class="CSSProperty_Value">14</span><span class="CSSDelimiters">;</span>
+        <span class="CSSDelimiters">}</span>
+        
+    <span class="MXMLSpecial_Tag">&lt;/fx:Style&gt;</span>
+    
+    <span class="MXMLSpecial_Tag">&lt;fx:Script&gt;</span>
+        &lt;![CDATA[
+            <span class="ActionScriptReserved">import</span> <span class="ActionScriptDefault_Text">mx</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">collections</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">ArrayCollection</span>;
+            <span class="ActionScriptReserved">import</span> <span class="ActionScriptDefault_Text">mx</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">rpc</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">events</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">ResultEvent</span>;
+            
+            <span class="ActionScriptBracket/Brace">[</span><span class="ActionScriptMetadata">Bindable</span><span class="ActionScriptBracket/Brace">]</span><span class="ActionScriptReserved">private</span> <span class="ActionScriptvar">var</span> <span class="ActionScriptDefault_Text">employees</span>:<span class="ActionScriptDefault_Text">ArrayCollection</span>;
+            
+            <span class="ActionScriptReserved">private</span> <span class="ActionScriptfunction">function</span> <span class="ActionScriptDefault_Text">resultHandler</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptDefault_Text">event</span>:<span class="ActionScriptDefault_Text">ResultEvent</span><span class="ActionScriptBracket/Brace">)</span>:<span class="ActionScriptReserved">void</span>
+            <span class="ActionScriptBracket/Brace">{</span>
+                <span class="ActionScriptDefault_Text">employees</span> <span class="ActionScriptOperator">=</span> <span class="ActionScriptDefault_Text">event</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">result</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">list</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">employee</span> <span class="ActionScriptReserved">as</span> <span class="ActionScriptDefault_Text">ArrayCollection</span>;
+            <span class="ActionScriptBracket/Brace">}</span>
+            
+        <span class="ActionScriptBracket/Brace">]</span><span class="ActionScriptBracket/Brace">]</span><span class="ActionScriptOperator">&gt;</span>
+    <span class="MXMLSpecial_Tag">&lt;/fx:Script&gt;</span>
+    
+    <span class="MXMLSpecial_Tag">&lt;fx:Declarations&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:HTTPService</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">srv</span><span class="MXMLDefault_Text">" url="</span><span class="MXMLString">data/list.xml</span><span class="MXMLDefault_Text">" result="</span><span class="ActionScriptDefault_Text">resultHandler</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptDefault_Text">event</span><span class="ActionScriptBracket/Brace">)</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+    <span class="MXMLSpecial_Tag">&lt;/fx:Declarations&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;s:Panel</span><span class="MXMLDefault_Text"> width="</span><span class="MXMLString">100%</span><span class="MXMLDefault_Text">" height="</span><span class="MXMLString">100%</span><span class="MXMLDefault_Text">" title="</span><span class="MXMLString">Custom Item Renderer with Animation</span><span class="MXMLDefault_Text">" skinClass="</span><span class="MXMLString">skins.TDFPanelSkin</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:layout&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:HorizontalLayout</span><span class="MXMLDefault_Text"> paddingTop="</span><span class="MXMLString">2</span><span class="MXMLDefault_Text">" paddingLeft="</span><span class="MXMLString">50</span><span class="MXMLDefault_Text">" paddingRight="</span><span class="MXMLString">8</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:layout&gt;</span>
+        
+        <span class="MXMLComponent_Tag">&lt;s:DataGroup</span><span class="MXMLDefault_Text"> dataProvider="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">employees</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" width="</span><span class="MXMLString">440</span><span class="MXMLDefault_Text">" itemRenderer="</span><span class="MXMLString">renderers.ImageRenderer2</span><span class="MXMLDefault_Text">" horizontalCenter="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" verticalCenter="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:layout&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:TileLayout</span><span class="MXMLDefault_Text"> </span><span class="MXMLComponent_Tag">/&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:layout&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:DataGroup&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:Label</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0x323232</span><span class="MXMLDefault_Text">" width="</span><span class="MXMLString">200</span><span class="MXMLDefault_Text">" text="</span><span class="MXMLString">The item renderer on this DataGroup uses effects to provide a
+Spark 3D rotation effect when hovered over each item. See the ImageRenderer2.mxml source for more information. This sample also 
+shows the use of a special font for the text.</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:Panel&gt;</span>
+<span class="MXMLComponent_Tag">&lt;/s:Application&gt;</span></pre></body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/skins/TDFPanelSkin.mxml.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/skins/TDFPanelSkin.mxml.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/skins/TDFPanelSkin.mxml.html
new file mode 100644
index 0000000..bd175dc
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/source/skins/TDFPanelSkin.mxml.html
@@ -0,0 +1,177 @@
+<!--
+  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.
+-->
+<!-- saved from url=(0014)about:internet -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+<title>TDFPanelSkin.mxml</title>
+<link rel="stylesheet" type="text/css" href="../../SourceStyles.css"/>
+</head>
+
+<body><pre><span class="MXMLProcessing_Instruction">&lt;?xml version="1.0" encoding="utf-8"?&gt;</span>
+
+<span class="MXMLASDoc">&lt;!---</span><span class="MXMLASDoc"> Custom Spark Panel Skin created for Tour de Flex.  
+
+@langversion 3.0
+@playerversion Flash 10
+@playerversion AIR 1.5
+@productversion Flex 4
+</span><span class="MXMLASDoc">--&gt;</span>
+<span class="MXMLComponent_Tag">&lt;s:SparkSkin</span><span class="MXMLDefault_Text"> xmlns:fx="</span><span class="MXMLString">http://ns.adobe.com/mxml/2009</span><span class="MXMLDefault_Text">" xmlns:s="</span><span class="MXMLString">library://ns.adobe.com/flex/spark</span><span class="MXMLDefault_Text">" alpha.disabled="</span><span class="MXMLString">0.5</span><span class="MXMLDefault_Text">"
+             blendMode.disabled="</span><span class="MXMLString">layer</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+    
+    <span class="MXMLSpecial_Tag">&lt;fx:Metadata&gt;</span>
+        &lt;![CDATA[ 
+        <span class="ActionScriptASDoc">/** 
+        * @copy spark.skins.spark.ApplicationSkin#hostComponent
+        */</span>
+        <span class="ActionScriptBracket/Brace">[</span><span class="ActionScriptMetadata">HostComponent</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptString">"spark.components.Panel"</span><span class="ActionScriptBracket/Brace">)</span><span class="ActionScriptBracket/Brace">]</span>
+        <span class="ActionScriptBracket/Brace">]</span><span class="ActionScriptBracket/Brace">]</span><span class="ActionScriptOperator">&gt;</span>
+    <span class="MXMLSpecial_Tag">&lt;/fx:Metadata&gt;</span> 
+    
+    <span class="MXMLSpecial_Tag">&lt;fx:Script&gt;</span>
+        <span class="ActionScriptComment">/* Define the skin elements that should not be colorized. 
+        For panel, border and title backround are skinned, but the content area and title text are not. */</span>
+        <span class="ActionScriptReserved">static</span> <span class="ActionScriptReserved">private</span> <span class="ActionScriptReserved">const</span> <span class="ActionScriptDefault_Text">exclusions</span>:<span class="ActionScriptDefault_Text">Array</span> <span class="ActionScriptOperator">=</span> <span class="ActionScriptBracket/Brace">[</span><span class="ActionScriptString">"background"</span><span class="ActionScriptOperator">,</span> <span class="ActionScriptString">"titleDisplay"</span><span class="ActionScriptOperator">,</span> <span class="ActionScriptString">"contentGroup"</span><span class="ActionScriptOperator">,</span> <span class="ActionScriptString">"bgFill"</span><span class="ActionScriptBracket/Brace">]</span>;
+        
+        <span class="ActionScriptASDoc">/** 
+         * @copy spark.skins.SparkSkin#colorizeExclusions
+         */</span>     
+        <span class="ActionScriptReserved">override</span> <span class="ActionScriptReserved">public</span> <span class="ActionScriptfunction">function</span> <span class="ActionScriptReserved">get</span> <span class="ActionScriptDefault_Text">colorizeExclusions</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptBracket/Brace">)</span>:<span class="ActionScriptDefault_Text">Array</span> <span class="ActionScriptBracket/Brace">{</span><span class="ActionScriptReserved">return</span> <span class="ActionScriptDefault_Text">exclusions</span>;<span class="ActionScriptBracket/Brace">}</span>
+        
+        <span class="ActionScriptComment">/* Define the content fill items that should be colored by the "contentBackgroundColor" style. */</span>
+        <span class="ActionScriptReserved">static</span> <span class="ActionScriptReserved">private</span> <span class="ActionScriptReserved">const</span> <span class="ActionScriptDefault_Text">contentFill</span>:<span class="ActionScriptDefault_Text">Array</span> <span class="ActionScriptOperator">=</span> [];
+        
+        <span class="ActionScriptASDoc">/**
+         * @inheritDoc
+         */</span>
+        <span class="ActionScriptReserved">override</span> <span class="ActionScriptReserved">public</span> <span class="ActionScriptfunction">function</span> <span class="ActionScriptReserved">get</span> <span class="ActionScriptDefault_Text">contentItems</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptBracket/Brace">)</span>:<span class="ActionScriptDefault_Text">Array</span> <span class="ActionScriptBracket/Brace">{</span><span class="ActionScriptReserved">return</span> <span class="ActionScriptDefault_Text">contentFill</span><span class="ActionScriptBracket/Brace">}</span>;
+    <span class="MXMLSpecial_Tag">&lt;/fx:Script&gt;</span>
+    
+    <span class="MXMLComponent_Tag">&lt;s:states&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:State</span><span class="MXMLDefault_Text"> name="</span><span class="MXMLString">normal</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:State</span><span class="MXMLDefault_Text"> name="</span><span class="MXMLString">disabled</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:State</span><span class="MXMLDefault_Text"> name="</span><span class="MXMLString">normalWithControlBar</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:State</span><span class="MXMLDefault_Text"> name="</span><span class="MXMLString">disabledWithControlBar</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:states&gt;</span>
+    
+    <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> drop shadow </span><span class="MXMLComment">--&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;s:RectangularDropShadow</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">shadow</span><span class="MXMLDefault_Text">" blurX="</span><span class="MXMLString">20</span><span class="MXMLDefault_Text">" blurY="</span><span class="MXMLString">20</span><span class="MXMLDefault_Text">" alpha="</span><span class="MXMLString">0.32</span><span class="MXMLDefault_Text">" distance="</span><span class="MXMLString">11</span><span class="MXMLDefault_Text">" 
+                             angle="</span><span class="MXMLString">90</span><span class="MXMLDefault_Text">" color="</span><span class="MXMLString">#000000</span><span class="MXMLDefault_Text">" left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/&gt;</span>
+    
+    <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> layer 1: border </span><span class="MXMLComment">--&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;s:Rect</span><span class="MXMLDefault_Text"> left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:stroke&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:SolidColorStroke</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" alpha="</span><span class="MXMLString">0.50</span><span class="MXMLDefault_Text">" weight="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:stroke&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:Rect&gt;</span>
+    
+    
+    <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> layer 2: background fill </span><span class="MXMLComment">--&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;s:Rect</span><span class="MXMLDefault_Text"> left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" height="</span><span class="MXMLString">15</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:fill&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:LinearGradient</span><span class="MXMLDefault_Text"> rotation="</span><span class="MXMLString">90</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:GradientEntry</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0xE2E2E2</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:GradientEntry</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0x000000</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:LinearGradient&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:fill&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:Rect&gt;</span>
+    
+    <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> layer 3: contents </span><span class="MXMLComment">--&gt;</span>
+    <span class="MXMLASDoc">&lt;!---</span><span class="MXMLASDoc"> contains the vertical stack of titlebar content and controlbar </span><span class="MXMLASDoc">--&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;s:Group</span><span class="MXMLDefault_Text"> left="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:layout&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:VerticalLayout</span><span class="MXMLDefault_Text"> gap="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" horizontalAlign="</span><span class="MXMLString">justify</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:layout&gt;</span>
+        
+        <span class="MXMLComponent_Tag">&lt;s:Group</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">topGroup</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">&gt;</span>
+            <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> layer 0: title bar fill </span><span class="MXMLComment">--&gt;</span>
+            <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> Note: We have custom skinned the title bar to be solid black for Tour de Flex </span><span class="MXMLComment">--&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:Rect</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">tbFill</span><span class="MXMLDefault_Text">" left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:fill&gt;</span>
+                    <span class="MXMLComponent_Tag">&lt;s:SolidColor</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0x000000</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;/s:fill&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:Rect&gt;</span>
+            
+            <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> layer 1: title bar highlight </span><span class="MXMLComment">--&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:Rect</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">tbHilite</span><span class="MXMLDefault_Text">" left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:stroke&gt;</span>
+                    <span class="MXMLComponent_Tag">&lt;s:LinearGradientStroke</span><span class="MXMLDefault_Text"> rotation="</span><span class="MXMLString">90</span><span class="MXMLDefault_Text">" weight="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+                        <span class="MXMLComponent_Tag">&lt;s:GradientEntry</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0xEAEAEA</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                        <span class="MXMLComponent_Tag">&lt;s:GradientEntry</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0xD9D9D9</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                    <span class="MXMLComponent_Tag">&lt;/s:LinearGradientStroke&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;/s:stroke&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:Rect&gt;</span>
+            
+            <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> layer 2: title bar divider </span><span class="MXMLComment">--&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:Rect</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">tbDiv</span><span class="MXMLDefault_Text">" left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" height="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:fill&gt;</span>
+                    <span class="MXMLComponent_Tag">&lt;s:SolidColor</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0xC0C0C0</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;/s:fill&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:Rect&gt;</span>
+            
+            <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> layer 3: text </span><span class="MXMLComment">--&gt;</span>
+            <span class="MXMLASDoc">&lt;!---</span><span class="MXMLASDoc"> Defines the appearance of the PanelSkin class's title bar. </span><span class="MXMLASDoc">--&gt;</span>
+            <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> Note: The title text display has been slightly modified for Tour de Flex. </span><span class="MXMLComment">--&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:Label</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">titleDisplay</span><span class="MXMLDefault_Text">" lineBreak="</span><span class="MXMLString">explicit</span><span class="MXMLDefault_Text">"
+                          left="</span><span class="MXMLString">9</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" minHeight="</span><span class="MXMLString">30</span><span class="MXMLDefault_Text">"
+                          verticalAlign="</span><span class="MXMLString">middle</span><span class="MXMLDefault_Text">" fontWeight="</span><span class="MXMLString">bold</span><span class="MXMLDefault_Text">" color="</span><span class="MXMLString">#E2E2E2</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:Label&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:Group&gt;</span>
+        
+        <span class="MXMLComment">&lt;!--</span><span class="MXMLComment">
+        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
+        </span><span class="MXMLComment">--&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;s:Group</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">contentGroup</span><span class="MXMLDefault_Text">" width="</span><span class="MXMLString">100%</span><span class="MXMLDefault_Text">" height="</span><span class="MXMLString">100%</span><span class="MXMLDefault_Text">" minWidth="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" minHeight="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:Group&gt;</span>
+        
+        <span class="MXMLComponent_Tag">&lt;s:Group</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">bottomGroup</span><span class="MXMLDefault_Text">" minWidth="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" minHeight="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">"
+                 includeIn="</span><span class="MXMLString">normalWithControlBar, disabledWithControlBar</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">&gt;</span>
+            
+            <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> layer 0: control bar background </span><span class="MXMLComment">--&gt;</span>
+            <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> Note: We are skinning this to be the gradient in case we do specify control
+            bar content, but it will only display if there's a controlBarContent
+            property specified.</span><span class="MXMLComment">--&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:Rect</span><span class="MXMLDefault_Text"> left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" height="</span><span class="MXMLString">15</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:fill&gt;</span>
+                    <span class="MXMLComponent_Tag">&lt;s:LinearGradient</span><span class="MXMLDefault_Text"> rotation="</span><span class="MXMLString">90</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+                        <span class="MXMLComponent_Tag">&lt;s:GradientEntry</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0xE2E2E2</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                        <span class="MXMLComponent_Tag">&lt;s:GradientEntry</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0x000000</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                    <span class="MXMLComponent_Tag">&lt;/s:LinearGradient&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;/s:fill&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:Rect&gt;</span>
+            
+            <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> layer 1: control bar divider line </span><span class="MXMLComment">--&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:Rect</span><span class="MXMLDefault_Text"> left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" height="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:fill&gt;</span>
+                    <span class="MXMLComponent_Tag">&lt;s:SolidColor</span><span class="MXMLDefault_Text"> color="</span><span class="MXMLString">0xCDCDCD</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;/s:fill&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:Rect&gt;</span>
+            
+            <span class="MXMLComment">&lt;!--</span><span class="MXMLComment"> layer 2: control bar </span><span class="MXMLComment">--&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;s:Group</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">controlBarGroup</span><span class="MXMLDefault_Text">" left="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" right="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" top="</span><span class="MXMLString">1</span><span class="MXMLDefault_Text">" bottom="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" minWidth="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">" minHeight="</span><span class="MXMLString">0</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;s:layout&gt;</span>
+                    <span class="MXMLComponent_Tag">&lt;s:HorizontalLayout</span><span class="MXMLDefault_Text"> paddingLeft="</span><span class="MXMLString">10</span><span class="MXMLDefault_Text">" paddingRight="</span><span class="MXMLString">10</span><span class="MXMLDefault_Text">" paddingTop="</span><span class="MXMLString">10</span><span class="MXMLDefault_Text">" paddingBottom="</span><span class="MXMLString">10</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/&gt;</span>
+                <span class="MXMLComponent_Tag">&lt;/s:layout&gt;</span>
+            <span class="MXMLComponent_Tag">&lt;/s:Group&gt;</span>
+        <span class="MXMLComponent_Tag">&lt;/s:Group&gt;</span>
+    <span class="MXMLComponent_Tag">&lt;/s:Group&gt;</span>
+<span class="MXMLComponent_Tag">&lt;/s:SparkSkin&gt;</span></pre></body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/data/list.out.xml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/data/list.out.xml b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/data/list.out.xml
new file mode 100644
index 0000000..2f32d30
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/data/list.out.xml
@@ -0,0 +1,18 @@
+<!--
+
+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.
+
+-->

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/data/list.xml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/data/list.xml b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/data/list.xml
new file mode 100644
index 0000000..c499fdb
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/data/list.xml
@@ -0,0 +1,96 @@
+<?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.
+
+-->
+<list>
+    <employee employeeId="1">
+    	<firstName>Michael</firstName>
+    	<lastName>Scott</lastName>
+    	<image>assets/scott.jpg</image>
+    </employee>
+    <employee employeeId="2">
+    	<firstName>Pam</firstName>
+    	<lastName>Beesly</lastName>
+    	<image>assets/beesly.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Andy</firstName>
+    	<lastName>Bernard</lastName>
+    	<image>assets/bernard.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Creed</firstName>
+    	<lastName>Bratton</lastName>
+    	<image>assets/bratton.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Toby</firstName>
+    	<lastName>Flenderson</lastName>
+    	<image>assets/flenderson.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Jim</firstName>
+    	<lastName>Halpert</lastName>
+    	<image>assets/halpert.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Ryan</firstName>
+    	<lastName>Howard</lastName>
+    	<image>assets/howard.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Stanley</firstName>
+    	<lastName>Hudson</lastName>
+    	<image>assets/hudson.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Kelly</firstName>
+    	<lastName>Kapoor</lastName>
+    	<image>assets/kapoor.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Phyllis</firstName>
+    	<lastName>Lapin</lastName>
+    	<image>assets/lapin.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Kevin</firstName>
+    	<lastName>Malone</lastName>
+    	<image>assets/malone.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Angela</firstName>
+    	<lastName>Martin</lastName>
+    	<image>assets/martin.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Oscar</firstName>
+    	<lastName>Martinez</lastName>
+    	<image>assets/martinez.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Meredith</firstName>
+    	<lastName>Palmer</lastName>
+    	<image>assets/palmer.jpg</image>
+    </employee>
+    <employee employeeId="3">
+    	<firstName>Dwight</firstName>
+    	<lastName>Schrute</lastName>
+    	<image>assets/schrute.jpg</image>
+    </employee>
+</list>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/renderers/ImageRenderer1.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/renderers/ImageRenderer1.mxml b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/renderers/ImageRenderer1.mxml
new file mode 100644
index 0000000..4337b10
--- /dev/null
+++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomItemRendererWithEffects/srcview/src/renderers/ImageRenderer1.mxml
@@ -0,0 +1,56 @@
+<?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:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
+				xmlns:s="library://ns.adobe.com/flex/spark"
+				xmlns:mx="library://ns.adobe.com/flex/mx" 
+				autoDrawBackground="false" 
+				depth="0" depth.hovered="1">
+	
+	<s:states>
+		<s:State name="normal" />
+		<s:State name="hovered" />
+	</s:states>
+
+	<s:postLayoutTransformOffsets>
+		<mx:TransformOffsets id="offsets" x.hovered="-40" y.hovered="-40" scaleX.hovered="2" scaleY.hovered="2" />
+	</s:postLayoutTransformOffsets>	
+	
+	<s:transitions>
+		<mx:Transition fromState="normal" toState="hovered" autoReverse="true">
+			<s:Animate target="{offsets}" duration="200">
+				<s:SimpleMotionPath property="scaleX" />
+				<s:SimpleMotionPath property="scaleY" />
+				<s:SimpleMotionPath property="x" />
+				<s:SimpleMotionPath property="y" />
+			</s:Animate>
+		</mx:Transition>
+		<mx:Transition fromState="hovered" toState="normal" autoReverse="true">
+			<s:Animate target="{offsets}" duration="200">
+				<s:SimpleMotionPath property="scaleX" />
+				<s:SimpleMotionPath property="scaleY" />
+				<s:SimpleMotionPath property="x" />
+				<s:SimpleMotionPath property="y" />
+			</s:Animate>
+		</mx:Transition>
+	</s:transitions>	
+	
+	<mx:Image id="image" source="{data.image}" width="60" height="60" horizontalCenter="0" verticalCenter="0"/>
+
+</s:ItemRenderer>
\ No newline at end of file