http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/source/sample.mxml.html ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/source/sample.mxml.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/source/sample.mxml.html new file mode 100644 index 0000000..0bffa33 --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/source/sample.mxml.html @@ -0,0 +1,90 @@ +<!-- + 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>sample.mxml</title> +<link rel="stylesheet" type="text/css" href="../SourceStyles.css"/> +</head> + +<body><pre><span class="MXMLProcessing_Instruction"><?xml version="1.0" encoding="utf-8"?></span> +<span class="MXMLComponent_Tag"><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">" + xmlns:my="</span><span class="MXMLString">*</span><span class="MXMLDefault_Text">" minWidth="</span><span class="MXMLString">600</span><span class="MXMLDefault_Text">" minHeight="</span><span class="MXMLString">350</span><span class="MXMLDefault_Text">" + applicationComplete="</span><span class="ActionScriptDefault_Text">requestPhotos</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptBracket/Brace">)</span><span class="MXMLDefault_Text">" backgroundColor="</span><span class="MXMLString">0x323232</span><span class="MXMLDefault_Text">" viewSourceURL="</span><span class="MXMLString">srcview/index.html</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">></span> + + <span class="MXMLSpecial_Tag"><fx:Script></span> + <![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">spark</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">components</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">Group</span>; + <span class="ActionScriptReserved">import</span> <span class="ActionScriptDefault_Text">spark</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">components</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">supportClasses</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">GroupBase</span>; + <span class="ActionScriptReserved">import</span> <span class="ActionScriptDefault_Text">spark</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">effects</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">animation</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">MotionPath</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">photoFeed</span>:<span class="ActionScriptDefault_Text">ArrayCollection</span>; + + <span class="ActionScriptReserved">private</span> <span class="ActionScriptfunction">function</span> <span class="ActionScriptDefault_Text">requestPhotos</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptBracket/Brace">)</span>:<span class="ActionScriptReserved">void</span> <span class="ActionScriptBracket/Brace">{</span> + <span class="ActionScriptvar">var</span> <span class="ActionScriptDefault_Text">params</span>:<span class="ActionScriptDefault_Text">Object</span> <span class="ActionScriptOperator">=</span> <span class="ActionScriptReserved">new</span> <span class="ActionScriptDefault_Text">Object</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptBracket/Brace">)</span>; + <span class="ActionScriptDefault_Text">params</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">format</span> <span class="ActionScriptOperator">=</span> <span class="ActionScriptString">'rss_200_enc'</span>; + <span class="ActionScriptDefault_Text">params</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">tags</span> <span class="ActionScriptOperator">=</span> <span class="ActionScriptDefault_Text">searchTerms</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">text</span>; + <span class="ActionScriptDefault_Text">photoService</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">send</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptDefault_Text">params</span><span class="ActionScriptBracket/Brace">)</span>; + <span class="ActionScriptBracket/Brace">}</span> + + <span class="ActionScriptReserved">private</span> <span class="ActionScriptfunction">function</span> <span class="ActionScriptDefault_Text">photoHandler</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">photoFeed</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">rss</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">channel</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">item</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">></span> + <span class="MXMLSpecial_Tag"></fx:Script></span> + + <span class="MXMLSpecial_Tag"><fx:Declarations></span> + <span class="MXMLComponent_Tag"><s:HTTPService</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">photoService</span><span class="MXMLDefault_Text">" + url="</span><span class="MXMLString">http://api.flickr.com/services/feeds/photos_public.gne</span><span class="MXMLDefault_Text">" + result="</span><span class="ActionScriptDefault_Text">photoHandler</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">/></span> + <span class="MXMLSpecial_Tag"></fx:Declarations></span> + + <span class="MXMLComponent_Tag"><s:layout></span> + <span class="MXMLComponent_Tag"><s:VerticalLayout</span><span class="MXMLDefault_Text"> paddingTop="</span><span class="MXMLString">10</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">" paddingBottom="</span><span class="MXMLString">10</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/></span> + <span class="MXMLComponent_Tag"></s:layout></span> + + <span class="MXMLComponent_Tag"><s:HGroup</span><span class="MXMLDefault_Text"> verticalAlign="</span><span class="MXMLString">middle</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">></span> + <span class="MXMLComponent_Tag"><s:Label</span><span class="MXMLDefault_Text"> text="</span><span class="MXMLString">Flickr tags or search terms:</span><span class="MXMLDefault_Text">" color="</span><span class="MXMLString">0xFFFFFF</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/></span> + <span class="MXMLComponent_Tag"><s:TextInput</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">searchTerms</span><span class="MXMLDefault_Text">" + enter="</span><span class="ActionScriptDefault_Text">requestPhotos</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptBracket/Brace">)</span><span class="MXMLDefault_Text">" text="</span><span class="MXMLString">bugs</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/></span> + <span class="MXMLComponent_Tag"><s:Button</span><span class="MXMLDefault_Text"> label="</span><span class="MXMLString">Search</span><span class="MXMLDefault_Text">" + click="</span><span class="ActionScriptDefault_Text">requestPhotos</span><span class="ActionScriptBracket/Brace">(</span><span class="ActionScriptBracket/Brace">)</span><span class="MXMLDefault_Text">" </span><span class="MXMLComponent_Tag">/></span> + <span class="MXMLComment"><!--</span><span class="MXMLComment"> The slider to control the axis angle </span><span class="MXMLComment">--></span> + <span class="MXMLComponent_Tag"><s:HSlider</span><span class="MXMLDefault_Text"> id="</span><span class="MXMLString">axisSlider</span><span class="MXMLDefault_Text">" minimum="</span><span class="MXMLString">-90</span><span class="MXMLDefault_Text">" maximum="</span><span class="MXMLString">90</span><span class="MXMLDefault_Text">" + value="</span><span class="MXMLString">10</span><span class="MXMLDefault_Text">" liveDragging="</span><span class="MXMLString">true</span><span class="MXMLDefault_Text">" width="</span><span class="MXMLString">300</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/></span> + <span class="MXMLComponent_Tag"></s:HGroup></span> + + <span class="MXMLComponent_Tag"><s:List</span><span class="MXMLDefault_Text"> width="</span><span class="MXMLString">700</span><span class="MXMLDefault_Text">" height="</span><span class="MXMLString">225</span><span class="MXMLDefault_Text">" + dataProvider="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">photoFeed</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">" + itemRenderer="</span><span class="MXMLString">FlickrThumbnail</span><span class="MXMLDefault_Text">" + id="</span><span class="MXMLString">theList</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">></span> + + <span class="MXMLComponent_Tag"><s:layout></span> + <span class="MXMLComponent_Tag"><my:WheelLayout</span><span class="MXMLDefault_Text"> gap="</span><span class="MXMLString">20</span><span class="MXMLDefault_Text">" axisAngle="</span><span class="MXMLString">{</span><span class="ActionScriptDefault_Text">axisSlider</span><span class="ActionScriptOperator">.</span><span class="ActionScriptDefault_Text">value</span><span class="MXMLString">}</span><span class="MXMLDefault_Text">"</span><span class="MXMLComponent_Tag">/></span> + <span class="MXMLComponent_Tag"></s:layout></span> + <span class="MXMLComponent_Tag"></s:List></span> + + +<span class="MXMLComponent_Tag"></s:Application></span></pre></body> +</html>
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/FlickrThumbnail.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/FlickrThumbnail.mxml b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/FlickrThumbnail.mxml new file mode 100644 index 0000000..7a7ff88 --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/FlickrThumbnail.mxml @@ -0,0 +1,80 @@ +<?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" click="itemrenderer1_clickHandler(event)"> + + <fx:Script> + <![CDATA[ + import spark.components.supportClasses.GroupBase; + import spark.effects.Animate; + import spark.effects.animation.MotionPath; + import spark.effects.animation.SimpleMotionPath; + protected function itemrenderer1_clickHandler(event:MouseEvent):void + { + var g:GroupBase = parent as GroupBase; + var p:Point = g.layout.getScrollPositionDeltaToElement(this.itemIndex); + if (p) + { + var startX:Number = g.horizontalScrollPosition; + var startY:Number = g.verticalScrollPosition; + var anim:Animate = new Animate(); + anim.motionPaths = new <MotionPath>[ + new SimpleMotionPath("horizontalScrollPosition", startX, startX + p.x, 500), + new SimpleMotionPath("verticalScrollPosition", startY, startY + p.y, 500) + ]; + + var interpolator:NumberInterpolatorWrapping = new NumberInterpolatorWrapping(0, g.contentWidth - g.width); + var scrollLength:Number = interpolator.getLength(startX, startX + p.x); + anim.interpolator = interpolator; + anim.duration = Math.max(550, Math.min(2500, scrollLength * 2)); + + anim.play([g]); + } + } + ]]> + </fx:Script> + + + <s:states> + <s:State name="normal"/> + <s:State name="hovered"/> + <s:State name="selected"/> + </s:states> + + <s:Rect id="border" left="0" right="0" top="0" bottom="0"> + <s:fill> + <s:SolidColor color="0xDFDFDF" color.hovered="0xFF0000" color.selected="0x00FF00"/> + </s:fill> + </s:Rect> + + <s:Group left="1" right="1" top="1" bottom="1"> + <s:layout> + <s:VerticalLayout horizontalAlign="center"/> + </s:layout> + + <mx:Image + width="75" height="75" + source="{data.thumbnail.url}" /> + <s:Label text="{data.credit}" maxWidth="100" textAlign="center"/> + </s:Group> + +</s:ItemRenderer> + http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/NumberInterpolatorWrapping.as ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/NumberInterpolatorWrapping.as b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/NumberInterpolatorWrapping.as new file mode 100644 index 0000000..175bb5a --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/NumberInterpolatorWrapping.as @@ -0,0 +1,110 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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. +// +//////////////////////////////////////////////////////////////////////////////// +package +{ +import spark.effects.interpolation.IInterpolator; + +public class NumberInterpolatorWrapping implements IInterpolator +{ + private var _rangeBegin:Number; + private var _rangeEnd:Number; + public function NumberInterpolatorWrapping(rangeBegin:Number, rangeEnd:Number) + { + _rangeBegin = rangeBegin; + _rangeEnd = rangeEnd; + } + + /** + * Returns the type that an implementor can handle + */ + public function get interpolatedType():Class + { + return Number; + } + + /** + * Given an elapsed fraction of an animation between 0 and 1, + * and start and end values, this function returns some value + * based on whatever interpolation the implementor chooses to + * provide. + */ + public function interpolate(fraction:Number, startValue:Object, endValue:Object):Object + { + if (fraction == 0) + return startValue; + else if (fraction == 1) + return endValue; + var start:Number = Number(startValue); + var end:Number = Number(endValue); + + if (Math.abs(end - start) < Math.abs(_rangeEnd - _rangeBegin) - Math.abs(end - start)) + { + return start + fraction * (end - start); + } + else + { + var result:Number; + if (start < end) + { + result = start - fraction * (_rangeEnd - _rangeBegin - Math.abs(start - end)); + if (result < _rangeBegin) + result += _rangeEnd - _rangeBegin; + return result; + } + else + { + result = start + fraction * (_rangeEnd - _rangeBegin - Math.abs(start - end)); + if (result > _rangeEnd) + result -= _rangeEnd - _rangeBegin; + return result; + } + } + } + + public function increment(baseValue:Object, incrementValue:Object):Object + { + var result:Number = Number(baseValue) + Number(incrementValue); + // This won't handle situations where we're adding more than + // the range itself, but since this will only be called when + // the user submits a 'byValue' that large, it seems unlikely + // at the very least + if (result > _rangeEnd) + result = _rangeBegin + (result - _rangeEnd); + return result; + } + + public function decrement(baseValue:Object, decrementValue:Object):Object + { + var result:Number = Number(baseValue) - Number(decrementValue); + // This won't handle situations where we're subtracting more than + // the range itself, but since this will only be called when + // the user submits a 'byValue' that large, it seems unlikely + // at the very least + if (result < _rangeBegin) + result = _rangeEnd + (_rangeBegin - result); + return result; + } + + public function getLength(startValue:Number, endValue:Number):Number + { + return Math.min( Math.abs(startValue - endValue), Math.abs(_rangeEnd - _rangeBegin - Math.abs(startValue - endValue))); + } + +} +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/WheelLayout.as ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/WheelLayout.as b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/WheelLayout.as new file mode 100644 index 0000000..7340a09 --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/WheelLayout.as @@ -0,0 +1,516 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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. +// +//////////////////////////////////////////////////////////////////////////////// +package +{ + +import flash.geom.Matrix; +import flash.geom.Matrix3D; +import flash.geom.Point; +import flash.geom.Rectangle; +import flash.geom.Vector3D; + +import mx.core.ILayoutElement; +import mx.core.IVisualElement; + +import spark.components.supportClasses.GroupBase; +import spark.core.NavigationUnit; +import spark.layouts.supportClasses.LayoutBase; + +public class WheelLayout extends LayoutBase +{ + //-------------------------------------------------------------------------- + // + // Constructor + // + //-------------------------------------------------------------------------- + + public function WheelLayout() + { + super(); + } + + //-------------------------------------------------------------------------- + // + // Properties + // + //-------------------------------------------------------------------------- + + //---------------------------------- + // gap + //---------------------------------- + + private var _gap:Number = 0; + + /** + * The gap between the items + */ + public function get gap():Number + { + return _gap; + } + + public function set gap(value:Number):void + { + _gap = value; + var layoutTarget:GroupBase = target; + if (layoutTarget) + { + layoutTarget.invalidateSize(); + layoutTarget.invalidateDisplayList(); + } + } + + //---------------------------------- + // axisAngle + //---------------------------------- + + /** + * @private + * The total width of all items, including gap space. + */ + private var _totalWidth:Number; + + /** + * @private + * Cache which item is currently in view, to facilitate scrollposition delta calculations + */ + private var _centeredItemIndex:int = 0; + private var _centeredItemCircumferenceBegin:Number = 0; + private var _centeredItemCircumferenceEnd:Number = 0; + private var _centeredItemDegrees:Number = 0; + + /** + * The axis to tilt the 3D wheel + */ + private var _axis:Vector3D = new Vector3D(0, 1, 0.1); + + /** + * The angle to tilt the axis of the wheel + */ + public function set axisAngle(value:Number):void + { + _axis = new Vector3D(0, Math.cos(Math.PI * value /180), Math.sin(Math.PI * value /180)); + var layoutTarget:GroupBase = target; + if (layoutTarget) + { + layoutTarget.invalidateSize(); + layoutTarget.invalidateDisplayList(); + } + } + + /** + * @private + * Given the radius of the sphere, return the radius of the + * projected sphere. Uses the projection matrix of the + * layout target to calculate. + */ + private function projectSphere(radius:Number, radius1:Number):Number + { + var fl:Number = target.transform.perspectiveProjection.focalLength; + var alpha:Number = Math.asin( radius1 / (radius + fl) ); + return fl * Math.tan(alpha) * 2; + } + + /** + * @private + * Given the totalWidth, maxHeight and maxHalfWidthDiagonal, calculate the bounds of the items + * on screen. Uses the projection matrix of the layout target to calculate. + */ + private function projectBounds(totalWidth:Number, maxWidth:Number, maxHeight:Number, maxHalfWidthDiagonal:Number):Point + { + // Use the the total width as a circumference of an imaginary circle which we will use to + // align the items in 3D: + var radius:Number = _totalWidth * 0.5 / Math.PI; + + // Now since we are going to arrange all the items along circle, middle of the item being the tangent point, + // we need to calculate the minimum bounding circle. It is easily calculated from the maximum width item: + var boundingRadius:Number = Math.sqrt(radius * radius + 0.25 * maxWidth * maxWidth); + + var projectedBoundsW:Number = _axis.z * _axis.z * (maxHalfWidthDiagonal + 2 * radius) + + projectSphere(radius, boundingRadius ) * _axis.y * _axis.y; + + var projectedBoundsH:Number = Math.abs(_axis.z) * (maxHalfWidthDiagonal + 2 * radius) + + maxHeight * _axis.y * _axis.y; + + return new Point(projectedBoundsW + 10, projectedBoundsH + 10); + } + + /** + * @private + * Iterates through all the items, calculates the projected bounds on screen, updates _totalWidth member variable. + */ + private function calculateBounds():Point + { + // Calculate total width: + _totalWidth = 0; + + var maxHeight:Number = 0; + var maxWidth:Number = 0; + var maxD:Number = 0; + + // Add up all the widths + var iter:LayoutIterator = new LayoutIterator(target); + var el:ILayoutElement; + while (el = iter.nextElement()) + { + var preferredWidth:Number = el.getPreferredBoundsWidth(false /*postTransform*/); + var preferredHeight:Number = el.getPreferredBoundsHeight(false /*postTransform*/); + + // Add up item width + _totalWidth += preferredWidth; + + // Max up item size + maxWidth = Math.max(maxWidth, preferredWidth); + maxHeight = Math.max(maxHeight, preferredHeight); + + maxD = Math.max(maxD, Math.sqrt(preferredWidth * preferredWidth / 4 + + preferredHeight * preferredHeight)); + } + + // Add up the gap + _totalWidth += gap * iter.numVisited; + + // Project + return projectBounds(_totalWidth, maxWidth, maxHeight, maxD); + } + + //-------------------------------------------------------------------------- + // + // Overridden methods: LayoutBase + // + //-------------------------------------------------------------------------- + + /** + * @private + */ + override public function set target(value:GroupBase):void + { + // Make sure that if layout is swapped out, we clean up + if (!value && target) + { + target.maintainProjectionCenter = false; + + var iter:LayoutIterator = new LayoutIterator(target); + var el:ILayoutElement; + while (el = iter.nextElement()) + { + el.setLayoutMatrix(new Matrix(), false /*triggerLayout*/); + } + } + + super.target = value; + + // Make sure we turn on projection the first time the layout + // gets assigned to the group + if (target) + target.maintainProjectionCenter = true; + } + + override public function measure():void + { + var bounds:Point = calculateBounds(); + + target.measuredWidth = bounds.x; + target.measuredHeight = bounds.y; + } + + override public function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void + { + // Get the bounds, this will also update _totalWidth + var bounds:Point = calculateBounds(); + + // Update the content size + target.setContentSize(_totalWidth + unscaledWidth, bounds.y); + var radius:Number = _totalWidth * 0.5 / Math.PI; + var gap:Number = this.gap; + _centeredItemDegrees = Number.MAX_VALUE; + + var scrollPosition:Number = target.horizontalScrollPosition; + var totalWidthSoFar:Number = 0; + // Subtract the half width of the first element from totalWidthSoFar: + var iter:LayoutIterator = new LayoutIterator(target); + var el:ILayoutElement = iter.nextElement(); + if (!el) + return; + totalWidthSoFar -= el.getPreferredBoundsWidth(false /*postTransform*/) / 2; + + // Set the 3D Matrix for all the elements: + iter.reset(); + while (el = iter.nextElement()) + { + // Size the item, no need to position it, since we'd set the computed matrix + // which defines the position. + el.setLayoutBoundsSize(NaN, NaN, false /*postTransform*/); + var elementWidth:Number = el.getLayoutBoundsWidth(false /*postTransform*/); + var elementHeight:Number = el.getLayoutBoundsHeight(false /*postTransform*/); + var degrees:Number = 360 * (totalWidthSoFar + elementWidth/2 - scrollPosition) / _totalWidth; + + // Remember which item is centered, this is used during scrolling + var curDegrees:Number = degrees % 360; + if (Math.abs(curDegrees) < Math.abs(_centeredItemDegrees)) + { + _centeredItemDegrees = curDegrees; + _centeredItemIndex = iter.curIndex; + _centeredItemCircumferenceBegin = totalWidthSoFar - gap; + _centeredItemCircumferenceEnd = totalWidthSoFar + elementWidth + gap; + } + + // Calculate and set the 3D Matrix + var m:Matrix3D = new Matrix3D(); + m.appendTranslation(-elementWidth/2, -elementHeight/2 + radius * _axis.z, -radius * _axis.y ); + m.appendRotation(-degrees, _axis); + m.appendTranslation(unscaledWidth/2, unscaledHeight/2, radius * _axis.y); + el.setLayoutMatrix3D(m, false /*triggerLayout*/); + + // Update the layer for a correct z-order + if (el is IVisualElement) + IVisualElement(el).depth = Math.abs( Math.floor(180 - Math.abs(degrees % 360)) ); + + // Move on to next item + totalWidthSoFar += elementWidth + gap; + } + } + + private function scrollPositionFromCenterToNext(next:Boolean):Number + { + var iter:LayoutIterator = new LayoutIterator(target, _centeredItemIndex); + var el:ILayoutElement = next ? iter.nextElementWrapped() : iter.prevElementWrapped(); + if (!el) + return 0; + + var elementWidth:Number = el.getLayoutBoundsWidth(false /*postTransform*/); + + var value:Number; + if (next) + { + if (_centeredItemDegrees > 0.1) + return (_centeredItemCircumferenceEnd + _centeredItemCircumferenceBegin) / 2; + + value = _centeredItemCircumferenceEnd + elementWidth/2; + if (value > _totalWidth) + value -= _totalWidth; + } + else + { + if (_centeredItemDegrees < -0.1) + return (_centeredItemCircumferenceEnd + _centeredItemCircumferenceBegin) / 2; + + value = _centeredItemCircumferenceBegin - elementWidth/2; + if (value < 0) + value += _totalWidth; + } + return value; + } + + override protected function scrollPositionChanged():void + { + if (target) + target.invalidateDisplayList(); + } + + override public function getHorizontalScrollPositionDelta(navigationUnit:uint):Number + { + var g:GroupBase = target; + if (!g || g.numElements == 0) + return 0; + + var value:Number; + + switch (navigationUnit) + { + case NavigationUnit.LEFT: + { + value = target.horizontalScrollPosition - 30; + if (value < 0) + value += _totalWidth; + return value - target.horizontalScrollPosition; + } + + case NavigationUnit.RIGHT: + { + value = target.horizontalScrollPosition + 30; + if (value > _totalWidth) + value -= _totalWidth; + return value - target.horizontalScrollPosition; + } + + case NavigationUnit.PAGE_LEFT: + return scrollPositionFromCenterToNext(false) - target.horizontalScrollPosition; + + case NavigationUnit.PAGE_RIGHT: + return scrollPositionFromCenterToNext(true) - target.horizontalScrollPosition; + + case NavigationUnit.HOME: + return 0; + + case NavigationUnit.END: + return _totalWidth; + + default: + return 0; + } + } + + /** + * @private + */ + override public function getScrollPositionDeltaToElement(index:int):Point + { + var layoutTarget:GroupBase = target; + if (!layoutTarget) + return null; + + var gap:Number = this.gap; + var totalWidthSoFar:Number = 0; + var iter:LayoutIterator = new LayoutIterator(layoutTarget); + + var el:ILayoutElement = iter.nextElement(); + if (!el) + return null; + totalWidthSoFar -= el.getLayoutBoundsWidth(false /*postTransform*/) / 2; + + iter.reset(); + while (null != (el = iter.nextElement()) && iter.curIndex <= index) + { + var elementWidth:Number = el.getLayoutBoundsWidth(false /*postTransform*/); + totalWidthSoFar += gap + elementWidth; + } + return new Point(totalWidthSoFar - elementWidth / 2 -gap - layoutTarget.horizontalScrollPosition, 0); + } + + /** + * @private + */ + override public function updateScrollRect(w:Number, h:Number):void + { + var g:GroupBase = target; + if (!g) + return; + + if (clipAndEnableScrolling) + { + // Since scroll position is reflected in our 3D calculations, + // always set the top-left of the srcollRect to (0,0). + g.scrollRect = new Rectangle(0, verticalScrollPosition, w, h); + } + else + g.scrollRect = null; + } +} +} + +import mx.core.ILayoutElement; + +import spark.components.supportClasses.GroupBase; + +class LayoutIterator +{ + private var _curIndex:int; + private var _numVisited:int = 0; + private var totalElements:int; + private var _target:GroupBase; + private var _loopIndex:int = -1; + private var _useVirtual:Boolean; + + public function get curIndex():int + { + return _curIndex; + } + + public function LayoutIterator(target:GroupBase, index:int=-1):void + { + totalElements = target.numElements; + _target = target; + _curIndex = index; + _useVirtual = _target.layout.useVirtualLayout; + } + + public function nextElement():ILayoutElement + { + while (_curIndex < totalElements - 1) + { + var el:ILayoutElement = _useVirtual ? _target.getVirtualElementAt(++_curIndex) : + _target.getElementAt(++_curIndex); + if (el && el.includeInLayout) + { + ++_numVisited; + return el; + } + } + return null; + } + + public function prevElement():ILayoutElement + { + while (_curIndex > 0) + { + var el:ILayoutElement = _useVirtual ? _target.getVirtualElementAt(--_curIndex) : + _target.getElementAt(--_curIndex); + if (el && el.includeInLayout) + { + ++_numVisited; + return el; + } + } + return null; + } + + public function nextElementWrapped():ILayoutElement + { + if (_loopIndex == -1) + _loopIndex = _curIndex; + else if (_loopIndex == _curIndex) + return null; + + var el:ILayoutElement = nextElement(); + if (el) + return el; + else if (_curIndex == totalElements - 1) + _curIndex = -1; + return nextElement(); + } + + public function prevElementWrapped():ILayoutElement + { + if (_loopIndex == -1) + _loopIndex = _curIndex; + else if (_loopIndex == _curIndex) + return null; + + var el:ILayoutElement = prevElement(); + if (el) + return el; + else if (_curIndex == 0) + _curIndex = totalElements; + return prevElement(); + } + + public function reset():void + { + _curIndex = -1; + _numVisited = 0; + _loopIndex = -1; + } + + public function get numVisited():int + { + return _numVisited; + } +} + http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/sample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/sample.mxml b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/sample.mxml new file mode 100644 index 0000000..11cc4df --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlickrWheel/srcview/src/sample.mxml @@ -0,0 +1,83 @@ +<?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:Application 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:my="*" minWidth="600" minHeight="350" + applicationComplete="requestPhotos()" backgroundColor="0x323232" viewSourceURL="srcview/index.html"> + + <fx:Script> + <![CDATA[ + import mx.collections.ArrayCollection; + import mx.rpc.events.ResultEvent; + + import spark.components.Group; + import spark.components.supportClasses.GroupBase; + import spark.effects.animation.MotionPath; + + [Bindable] + private var photoFeed:ArrayCollection; + + private function requestPhotos():void { + var params:Object = new Object(); + params.format = 'rss_200_enc'; + params.tags = searchTerms.text; + photoService.send(params); + } + + private function photoHandler(event:ResultEvent):void { + photoFeed = event.result.rss.channel.item as ArrayCollection; + } + ]]> + </fx:Script> + + <fx:Declarations> + <s:HTTPService id="photoService" + url="http://api.flickr.com/services/feeds/photos_public.gne" + result="photoHandler(event)" /> + </fx:Declarations> + + <s:layout> + <s:VerticalLayout paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10"/> + </s:layout> + + <s:HGroup verticalAlign="middle"> + <s:Label text="Flickr tags or search terms:" color="0xFFFFFF"/> + <s:TextInput id="searchTerms" + enter="requestPhotos()" text="bugs" /> + <s:Button label="Search" + click="requestPhotos()" /> + <!-- The slider to control the axis angle --> + <s:HSlider id="axisSlider" minimum="-90" maximum="90" + value="10" liveDragging="true" width="300"/> + </s:HGroup> + + <s:List width="700" height="225" + dataProvider="{photoFeed}" + itemRenderer="FlickrThumbnail" + id="theList"> + + <s:layout> + <my:WheelLayout gap="20" axisAngle="{axisSlider.value}"/> + </s:layout> + </s:List> + + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/readme.txt ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/readme.txt b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/readme.txt new file mode 100644 index 0000000..d4c9f08 --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/readme.txt @@ -0,0 +1,4 @@ +This layout sample was written by Evtim Georgiev. More information regarding the layout can be found at these URLs: + +http://evtimmy.com/2009/06/flowlayout-part-2-gap-verticalalign-and-scrolling/ +http://www.adobe.com/devnet/flex/articles/spark_layouts.html \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/sample.html ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/sample.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/sample.html new file mode 100644 index 0000000..8d05dc2 --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/sample.html @@ -0,0 +1,121 @@ +<!-- + 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. +--> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> +<!-- saved from url=(0014)about:internet --> +<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> + <!-- + Smart developers always View Source. + + This application was built using Adobe Flex, an open source framework + for building rich Internet applications that get delivered via the + Flash Player or to desktops via Adobe AIR. + + Learn more about Flex at http://flex.org + // --> + <head> + <title></title> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> + <!-- Include CSS to eliminate any default margins/padding and set the height of the html element and + the body element to 100%, because Firefox, or any Gecko based browser, interprets percentage as + the percentage of the height of its parent container, which has to be set explicitly. Initially, + don't display flashContent div so it won't show if JavaScript disabled. + --> + <style type="text/css" media="screen"> + html, body { height:100%; } + body { margin:0; padding:0; overflow:auto; text-align:center; + background-color: #ffffff; } + #flashContent { display:none; } + </style> + + <!-- Enable Browser History by replacing useBrowserHistory tokens with two hyphens --> + <!-- BEGIN Browser History required section --> + <link rel="stylesheet" type="text/css" href="history/history.css" /> + <script type="text/javascript" src="history/history.js"></script> + <!-- END Browser History required section --> + + <script type="text/javascript" src="swfobject.js"></script> + <script type="text/javascript"> + <!-- For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection. --> + var swfVersionStr = "10.0.0"; + <!-- To use express install, set to playerProductInstall.swf, otherwise the empty string. --> + var xiSwfUrlStr = "playerProductInstall.swf"; + var flashvars = {}; + var params = {}; + params.quality = "high"; + params.bgcolor = "#ffffff"; + params.allowscriptaccess = "sameDomain"; + params.allowfullscreen = "true"; + var attributes = {}; + attributes.id = "sample"; + attributes.name = "sample"; + attributes.align = "middle"; + swfobject.embedSWF( + "sample.swf", "flashContent", + "100%", "100%", + swfVersionStr, xiSwfUrlStr, + flashvars, params, attributes); + <!-- JavaScript enabled so display the flashContent div in case it is not replaced with a swf object. --> + swfobject.createCSS("#flashContent", "display:block;text-align:left;"); + </script> + </head> + <body> + <!-- SWFObject's dynamic embed method replaces this alternative HTML content with Flash content when enough + JavaScript and Flash plug-in support is available. The div is initially hidden so that it doesn't show + when JavaScript is disabled. + --> + <div id="flashContent"> + <p> + To view this page ensure that Adobe Flash Player version + 10.0.0 or greater is installed. + </p> + <script type="text/javascript"> + var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://"); + document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='" + + pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>" ); + </script> + </div> + + <noscript> + <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="sample"> + <param name="movie" value="sample.swf" /> + <param name="quality" value="high" /> + <param name="bgcolor" value="#ffffff" /> + <param name="allowScriptAccess" value="sameDomain" /> + <param name="allowFullScreen" value="true" /> + <!--[if !IE]>--> + <object type="application/x-shockwave-flash" data="sample.swf" width="100%" height="100%"> + <param name="quality" value="high" /> + <param name="bgcolor" value="#ffffff" /> + <param name="allowScriptAccess" value="sameDomain" /> + <param name="allowFullScreen" value="true" /> + <!--<![endif]--> + <!--[if gte IE 6]>--> + <p> + Either scripts and active content are not permitted to run or Adobe Flash Player version + 10.0.0 or greater is not installed. + </p> + <!--<![endif]--> + <a href="http://www.adobe.com/go/getflashplayer"> + <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" /> + </a> + <!--[if !IE]>--> + </object> + <!--<![endif]--> + </object> + </noscript> + </body> +</html> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceIndex.xml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceIndex.xml b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceIndex.xml new file mode 100644 index 0000000..594c5af --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceIndex.xml @@ -0,0 +1,48 @@ +<?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. + +--> +<index> + <title>Source of Sample-Flex4-CustomLayout-FlowLayout</title> + <nodes> + <node label="html-template"> + <node label="history"> + <node icon="cssIcon" label="history.css" url="source/html-template/history/history.css.html"/> + <node label="history.js" url="source/html-template/history/history.js.txt"/> + <node icon="htmlIcon" label="historyFrame.html" url="source/html-template/history/historyFrame.html"/> + </node> + <node icon="htmlIcon" label="index.template.html" url="source/html-template/index.template.html"/> + <node icon="swfIcon" label="playerProductInstall.swf" url="source/html-template/playerProductInstall.swf"/> + <node label="swfobject.js" url="source/html-template/swfobject.js.txt"/> + </node> + <node label="libs"> + </node> + <node label="src"> + <node icon="packageIcon" label="skins" expanded="true"> + <node icon="mxmlIcon" label="TDFPanelSkin.mxml" url="source/skins/TDFPanelSkin.mxml.html"/> + </node> + <node icon="actionScriptIcon" label="FlowLayout1.as" url="source/FlowLayout1.as.html"/> + <node label="readme.txt" url="source/readme.txt"/> + <node icon="mxmlAppIcon" selected="true" label="sample.mxml" url="source/sample.mxml.html"/> + </node> + </nodes> + <zipfile label="Download source (ZIP, 24K)" url="Sample-Flex4-CustomLayout-FlowLayout.zip"> + </zipfile> + <sdklink label="Download Flex SDK" url="http://www.adobe.com/go/flex4_sdk_download"> + </sdklink> +</index> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceStyles.css ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceStyles.css b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceStyles.css new file mode 100644 index 0000000..9d5210f --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceStyles.css @@ -0,0 +1,155 @@ +/* + * 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. + */ +body { + font-family: Courier New, Courier, monospace; + font-size: medium; +} + +.ActionScriptASDoc { + color: #3f5fbf; +} + +.ActionScriptBracket/Brace { +} + +.ActionScriptComment { + color: #009900; + font-style: italic; +} + +.ActionScriptDefault_Text { +} + +.ActionScriptMetadata { + color: #0033ff; + font-weight: bold; +} + +.ActionScriptOperator { +} + +.ActionScriptReserved { + color: #0033ff; + font-weight: bold; +} + +.ActionScriptString { + color: #990000; + font-weight: bold; +} + +.ActionScriptclass { + color: #9900cc; + font-weight: bold; +} + +.ActionScriptfunction { + color: #339966; + font-weight: bold; +} + +.ActionScriptinterface { + color: #9900cc; + font-weight: bold; +} + +.ActionScriptpackage { + color: #9900cc; + font-weight: bold; +} + +.ActionScripttrace { + color: #cc6666; + font-weight: bold; +} + +.ActionScriptvar { + color: #6699cc; + font-weight: bold; +} + +.MXMLASDoc { + color: #3f5fbf; +} + +.MXMLComment { + color: #800000; +} + +.MXMLComponent_Tag { + color: #0000ff; +} + +.MXMLDefault_Text { +} + +.MXMLProcessing_Instruction { +} + +.MXMLSpecial_Tag { + color: #006633; +} + +.MXMLString { + color: #990000; +} + +.CSS@font-face { + color: #990000; + font-weight: bold; +} + +.CSS@import { + color: #006666; + font-weight: bold; +} + +.CSS@media { + color: #663333; + font-weight: bold; +} + +.CSS@namespace { + color: #923196; +} + +.CSSComment { + color: #999999; +} + +.CSSDefault_Text { +} + +.CSSDelimiters { +} + +.CSSProperty_Name { + color: #330099; +} + +.CSSProperty_Value { + color: #3333cc; +} + +.CSSSelector { + color: #ff00ff; +} + +.CSSString { + color: #990000; +} + http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceTree.html ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceTree.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceTree.html new file mode 100644 index 0000000..80281a9 --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/SourceTree.html @@ -0,0 +1,129 @@ +<!-- + 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. +--> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> +<!-- saved from url=(0014)about:internet --> +<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> + <!-- + Smart developers always View Source. + + This application was built using Adobe Flex, an open source framework + for building rich Internet applications that get delivered via the + Flash Player or to desktops via Adobe AIR. + + Learn more about Flex at http://flex.org + // --> + <head> + <title></title> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> + <!-- Include CSS to eliminate any default margins/padding and set the height of the html element and + the body element to 100%, because Firefox, or any Gecko based browser, interprets percentage as + the percentage of the height of its parent container, which has to be set explicitly. Initially, + don't display flashContent div so it won't show if JavaScript disabled. + --> + <style type="text/css" media="screen"> + html, body { height:100%; } + body { margin:0; padding:0; overflow:auto; text-align:center; + background-color: #ffffff; } + #flashContent { display:none; } + </style> + + <!-- Enable Browser History by replacing useBrowserHistory tokens with two hyphens --> + <!-- BEGIN Browser History required section > + <link rel="stylesheet" type="text/css" href="history/history.css" /> + <script type="text/javascript" src="history/history.js"></script> + <! END Browser History required section --> + + <script type="text/javascript" src="swfobject.js"></script> + <script type="text/javascript"> + function loadIntoMain(url) { + parent.mainFrame.location.href = url; + } + + function openUrlWindow(url) { + window.top.location = url; + } + + <!-- For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection. --> + var swfVersionStr = "10.0.0"; + <!-- To use express install, set to playerProductInstall.swf, otherwise the empty string. --> + var xiSwfUrlStr = "playerProductInstall.swf"; + var flashvars = {}; + var params = {}; + params.quality = "high"; + params.bgcolor = "#ffffff"; + params.allowscriptaccess = "sameDomain"; + params.allowfullscreen = "true"; + var attributes = {}; + attributes.id = "SourceTree"; + attributes.name = "SourceTree"; + attributes.align = "middle"; + swfobject.embedSWF( + "SourceTree.swf", "flashContent", + "100%", "100%", + swfVersionStr, xiSwfUrlStr, + flashvars, params, attributes); + <!-- JavaScript enabled so display the flashContent div in case it is not replaced with a swf object. --> + swfobject.createCSS("#flashContent", "display:block;text-align:left;"); + </script> + </head> + <body> + <!-- SWFObject's dynamic embed method replaces this alternative HTML content with Flash content when enough + JavaScript and Flash plug-in support is available. The div is initially hidden so that it doesn't show + when JavaScript is disabled. + --> + <div id="flashContent"> + <p> + To view this page ensure that Adobe Flash Player version + 10.0.0 or greater is installed. + </p> + <script type="text/javascript"> + var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://"); + document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='" + + pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>" ); + </script> + </div> + + <noscript> + <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="SourceTree"> + <param name="movie" value="SourceTree.swf" /> + <param name="quality" value="high" /> + <param name="bgcolor" value="#ffffff" /> + <param name="allowScriptAccess" value="sameDomain" /> + <param name="allowFullScreen" value="true" /> + <!--[if !IE]>--> + <object type="application/x-shockwave-flash" data="SourceTree.swf" width="100%" height="100%"> + <param name="quality" value="high" /> + <param name="bgcolor" value="#ffffff" /> + <param name="allowScriptAccess" value="sameDomain" /> + <param name="allowFullScreen" value="true" /> + <!--<![endif]--> + <!--[if gte IE 6]>--> + <p> + Either scripts and active content are not permitted to run or Adobe Flash Player version + 10.0.0 or greater is not installed. + </p> + <!--<![endif]--> + <a href="http://www.adobe.com/go/getflashplayer"> + <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" /> + </a> + <!--[if !IE]>--> + </object> + <!--<![endif]--> + </object> + </noscript> + </body> +</html> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d43c133c/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/index.html ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/index.html b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/index.html new file mode 100644 index 0000000..3b05da4 --- /dev/null +++ b/TourDeFlex/TourDeFlex_content/flex4.0/CustomLayout-FlowLayout/srcview/index.html @@ -0,0 +1,32 @@ +<!-- + 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 HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> +<html> +<head> +<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> +<title>Source of Sample-Flex4-CustomLayout-FlowLayout</title> +</head> +<frameset cols="235,*" border="2" framespacing="1"> + <frame src="SourceTree.html" name="leftFrame" scrolling="NO"> + <frame src="source/sample.mxml.html" name="mainFrame"> +</frameset> +<noframes> + <body> + </body> +</noframes> +</html>