Example of FlexJS custom itemRenderer
Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/3d95631f Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/3d95631f Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/3d95631f Branch: refs/heads/develop Commit: 3d95631fa5df68846244c0f91b7dbadca1e26f1c Parents: 7056ba5 Author: Peter Ent <[email protected]> Authored: Fri Sep 13 16:53:29 2013 -0400 Committer: Peter Ent <[email protected]> Committed: Fri Sep 13 16:53:29 2013 -0400 ---------------------------------------------------------------------- examples/ListsTest/src/FirstView.mxml | 61 +++++++++++++++ examples/ListsTest/src/ListsTests.mxml | 36 +++++++++ examples/ListsTest/src/models/ProductsModel.as | 42 ++++++++++ .../src/products/ProductItemRenderer.as | 78 +++++++++++++++++++ examples/ListsTest/src/smallbluerect.jpg | Bin 0 -> 13500 bytes examples/ListsTest/src/smallgreenrect.jpg | Bin 0 -> 13542 bytes examples/ListsTest/src/smallorangerect.gif | Bin 0 -> 821 bytes examples/ListsTest/src/smallorangerect.jpg | Bin 0 -> 13571 bytes examples/ListsTest/src/smallpurplerect.jpg | Bin 0 -> 13517 bytes examples/ListsTest/src/smallredrect.jpg | Bin 0 -> 13477 bytes examples/ListsTest/src/smallyellowrect.jpg | Bin 0 -> 13598 bytes 11 files changed, 217 insertions(+) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/FirstView.mxml ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/FirstView.mxml b/examples/ListsTest/src/FirstView.mxml new file mode 100644 index 0000000..ff1943b --- /dev/null +++ b/examples/ListsTest/src/FirstView.mxml @@ -0,0 +1,61 @@ +<?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. + +--> +<basic:ViewBase xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:basic="library://ns.apache.org/flexjs/basic" + xmlns:local="*"> + <fx:Script> + <![CDATA[ + + private function handleListChange() : void + { + pickLabel.text = "Selected: "+productList.selectedItem.title; + } + ]]> + </fx:Script> + + <fx:Style> + @namespace basic "library://ns.apache.org/flexjs/basic"; + @namespace sample "products.*"; + + + .productList { + IDataProviderItemRendererMapper: ClassReference("org.apache.flex.html.staticControls.beads.DataItemRendererFactoryForArrayData"); + IItemRenderer: ClassReference("products.ProductItemRenderer"); + } + + sample|ProductItemRenderer { + height: 40; + IBeadController: ClassReference("org.apache.flex.html.staticControls.beads.controllers.ItemRendererMouseController"); + } + + </fx:Style> + + <basic:List id="productList" x="20" y="20" width="200" height="150" className="productList" change="handleListChange()"> + <basic:beads> + <basic:ConstantBinding + sourceID="applicationModel" + sourcePropertyName="products" + destinationPropertyName="dataProvider" /> + </basic:beads> + </basic:List> + + <basic:Label id="pickLabel" x="250" y="20" width="200" /> + +</basic:ViewBase> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/ListsTests.mxml ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/ListsTests.mxml b/examples/ListsTest/src/ListsTests.mxml new file mode 100644 index 0000000..f2e236a --- /dev/null +++ b/examples/ListsTest/src/ListsTests.mxml @@ -0,0 +1,36 @@ +<?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. +// +//////////////////////////////////////////////////////////////////////////////// +--> +<basic:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:local="*" + xmlns:models="models.*" + xmlns:basic="library://ns.apache.org/flexjs/basic" + > + + <basic:valuesImpl> + <basic:SimpleCSSValuesImpl /> + </basic:valuesImpl> + <basic:model> + <models:ProductsModel /> + </basic:model> + <basic:initialView> + <local:FirstView /> + </basic:initialView> +</basic:Application> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/models/ProductsModel.as ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/models/ProductsModel.as b/examples/ListsTest/src/models/ProductsModel.as new file mode 100644 index 0000000..9807ee0 --- /dev/null +++ b/examples/ListsTest/src/models/ProductsModel.as @@ -0,0 +1,42 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 models +{ + import org.apache.flex.events.EventDispatcher; + + public class ProductsModel extends EventDispatcher + { + public function ProductsModel() + { + } + + private var _products:Array = [ + {id:"ps100", title:"Widgets", detail:"44", image:"smallbluerect.jpg"}, + {id:"tx200", title:"Thingys", detail:"out of stock", image:"smallgreenrect.jpg"}, + {id:"rz300", title:"Sprockets", detail:"8,000", image:"smallyellowrect.jpg"}, + {id:"dh440", title:"DooHickies", detail:"out of stock", image:"smallredrect.jpg"}, + {id:"ps220", title:"Weejets", detail:"235", image:"smallorangerect.jpg"} + ]; + public function get products():Array + { + return _products; + } + + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/products/ProductItemRenderer.as ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/products/ProductItemRenderer.as b/examples/ListsTest/src/products/ProductItemRenderer.as new file mode 100644 index 0000000..cd7453c --- /dev/null +++ b/examples/ListsTest/src/products/ProductItemRenderer.as @@ -0,0 +1,78 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 products +{ + import org.apache.flex.createjs.staticControls.Label; + import org.apache.flex.html.staticControls.Image; + import org.apache.flex.html.staticControls.supportClasses.DataItemRenderer; + + public class ProductItemRenderer extends DataItemRenderer + { + public function ProductItemRenderer() + { + super(); + } + + private var image:Image; + private var title:Label; + private var detail:Label; + + override public function addedToParent():void + { + super.addedToParent(); + + // add an image and two labels + image = new Image(); + addElement(image); + + title = new Label(); + addElement(title); + + detail = new Label(); + addElement(detail); + } + + override public function set data(value:Object):void + { + super.data = value; + + image.source = data.image; + title.text = data.title; + detail.text = data.detail; + } + + override public function adjustSize():void + { + var cy:Number = this.height/2; + + image.x = 4; + image.y = cy - 16; + image.width = 32; + image.height = 32; + + title.x = 40; + title.y = cy - 16; + + detail.x = 40; + detail.y = cy; + + updateRenderer(); + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/smallbluerect.jpg ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/smallbluerect.jpg b/examples/ListsTest/src/smallbluerect.jpg new file mode 100755 index 0000000..80ed275 Binary files /dev/null and b/examples/ListsTest/src/smallbluerect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/smallgreenrect.jpg ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/smallgreenrect.jpg b/examples/ListsTest/src/smallgreenrect.jpg new file mode 100755 index 0000000..c5f9ce6 Binary files /dev/null and b/examples/ListsTest/src/smallgreenrect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/smallorangerect.gif ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/smallorangerect.gif b/examples/ListsTest/src/smallorangerect.gif new file mode 100644 index 0000000..603f810 Binary files /dev/null and b/examples/ListsTest/src/smallorangerect.gif differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/smallorangerect.jpg ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/smallorangerect.jpg b/examples/ListsTest/src/smallorangerect.jpg new file mode 100755 index 0000000..4982d87 Binary files /dev/null and b/examples/ListsTest/src/smallorangerect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/smallpurplerect.jpg ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/smallpurplerect.jpg b/examples/ListsTest/src/smallpurplerect.jpg new file mode 100755 index 0000000..201f625 Binary files /dev/null and b/examples/ListsTest/src/smallpurplerect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/smallredrect.jpg ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/smallredrect.jpg b/examples/ListsTest/src/smallredrect.jpg new file mode 100644 index 0000000..d2cfa31 Binary files /dev/null and b/examples/ListsTest/src/smallredrect.jpg differ http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/3d95631f/examples/ListsTest/src/smallyellowrect.jpg ---------------------------------------------------------------------- diff --git a/examples/ListsTest/src/smallyellowrect.jpg b/examples/ListsTest/src/smallyellowrect.jpg new file mode 100755 index 0000000..b17b62d Binary files /dev/null and b/examples/ListsTest/src/smallyellowrect.jpg differ
