Repository: flex-asjs Updated Branches: refs/heads/develop 82ff1840e -> 336fac64c
Added example of building a Table from a data source to the TableExample example. Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/336fac64 Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/336fac64 Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/336fac64 Branch: refs/heads/develop Commit: 336fac64c0eed8b063213a72899f658e9d490cea Parents: 82ff184 Author: Peter Ent <[email protected]> Authored: Tue May 2 16:33:57 2017 -0400 Committer: Peter Ent <[email protected]> Committed: Tue May 2 16:33:57 2017 -0400 ---------------------------------------------------------------------- .../src/main/flex/MyInitialView.mxml | 31 ++++- .../src/main/flex/TableExample.mxml | 3 + .../src/main/flex/dataTable/DataColumn.as | 33 ++++++ .../src/main/flex/dataTable/DataTable.as | 69 ++++++++++++ .../mapper/DataTableMapperForArrayListData.as | 112 +++++++++++++++++++ .../main/flex/dataTable/model/DataTableModel.as | 40 +++++++ .../src/main/flex/models/ProductsModel.as | 47 ++++++++ 7 files changed, 334 insertions(+), 1 deletion(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/336fac64/examples/flexjs/TableExample/src/main/flex/MyInitialView.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/TableExample/src/main/flex/MyInitialView.mxml b/examples/flexjs/TableExample/src/main/flex/MyInitialView.mxml index c2f81dd..11d2e29 100644 --- a/examples/flexjs/TableExample/src/main/flex/MyInitialView.mxml +++ b/examples/flexjs/TableExample/src/main/flex/MyInitialView.mxml @@ -18,7 +18,9 @@ limitations under the License. --> <js:View xmlns:fx="http://ns.adobe.com/mxml/2009" - xmlns:js="library://ns.apache.org/flexjs/basic"> + xmlns:js="library://ns.apache.org/flexjs/basic" + xmlns:dataTable="dataTable.*" + xmlns:model="dataTable.model.*"> <fx:Style> @namespace js "library://ns.apache.org/flexjs/basic"; @@ -44,6 +46,10 @@ limitations under the License. padding: 6px; } + .DataTable { + iBeadModel: ClassReference("dataTable.model.DataTableModel"); + } + </fx:Style> <js:beads> @@ -117,5 +123,28 @@ limitations under the License. </js:TableCell> </js:TableRow> </js:Table> + + <!-- Generates a Table structure from a data source --> + + <dataTable:DataTable x="600" y="0" width="400" height="400"> + <dataTable:beads> + <js:ConstantBinding + sourceID="applicationModel" + sourcePropertyName="products" + destinationPropertyName="dataProvider" /> + </dataTable:beads> + <dataTable:DataColumn + dataField="name" + label="State" + itemRenderer="org.apache.flex.html.supportClasses.StringItemRenderer" /> + <dataTable:DataColumn + dataField="capital" + label="Capital" + itemRenderer="org.apache.flex.html.supportClasses.StringItemRenderer" /> + <dataTable:DataColumn + dataField="country" + label="Country" + itemRenderer="org.apache.flex.html.supportClasses.StringItemRenderer" /> + </dataTable:DataTable> </js:View> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/336fac64/examples/flexjs/TableExample/src/main/flex/TableExample.mxml ---------------------------------------------------------------------- diff --git a/examples/flexjs/TableExample/src/main/flex/TableExample.mxml b/examples/flexjs/TableExample/src/main/flex/TableExample.mxml index 2d5c972..41989f8 100644 --- a/examples/flexjs/TableExample/src/main/flex/TableExample.mxml +++ b/examples/flexjs/TableExample/src/main/flex/TableExample.mxml @@ -27,6 +27,9 @@ <js:valuesImpl> <js:SimpleCSSValuesImpl /> </js:valuesImpl> + <js:model> + <models:ProductsModel /> + </js:model> <js:initialView> <local:MyInitialView /> </js:initialView> http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/336fac64/examples/flexjs/TableExample/src/main/flex/dataTable/DataColumn.as ---------------------------------------------------------------------- diff --git a/examples/flexjs/TableExample/src/main/flex/dataTable/DataColumn.as b/examples/flexjs/TableExample/src/main/flex/dataTable/DataColumn.as new file mode 100644 index 0000000..b8e5f2e --- /dev/null +++ b/examples/flexjs/TableExample/src/main/flex/dataTable/DataColumn.as @@ -0,0 +1,33 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 dataTable +{ + import org.apache.flex.html.supportClasses.DataGridColumn; + + /** + * DataColumn is exactly like DataGridColumn + */ + public class DataColumn extends DataGridColumn + { + public function DataColumn() + { + super(); + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/336fac64/examples/flexjs/TableExample/src/main/flex/dataTable/DataTable.as ---------------------------------------------------------------------- diff --git a/examples/flexjs/TableExample/src/main/flex/dataTable/DataTable.as b/examples/flexjs/TableExample/src/main/flex/dataTable/DataTable.as new file mode 100644 index 0000000..1b388b6 --- /dev/null +++ b/examples/flexjs/TableExample/src/main/flex/dataTable/DataTable.as @@ -0,0 +1,69 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 dataTable +{ + import dataTable.mapper.DataTableMapperForArrayListData; + import dataTable.model.DataTableModel; + + import org.apache.flex.events.Event; + import org.apache.flex.html.Table; + + [DefaultProperty("columns")] + + /** + * The DataTable uses Table along with a data mapper and item renderers to generate + * a Table from a data source. + */ + public class DataTable extends Table + { + public function DataTable() + { + super(); + + className = "DataTable"; + } + + public function get columns():Array + { + return DataTableModel(model).columns; + } + public function set columns(value:Array):void + { + DataTableModel(model).columns = value; + } + + public function get dataProvider():Object + { + return DataTableModel(model).dataProvider; + } + public function set dataProvider(value:Object):void + { + DataTableModel(model).dataProvider = value; + } + + override public function addedToParent():void + { + super.addedToParent(); + + addBead(new DataTableMapperForArrayListData()); + + dispatchEvent( new Event("initComplete") ); + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/336fac64/examples/flexjs/TableExample/src/main/flex/dataTable/mapper/DataTableMapperForArrayListData.as ---------------------------------------------------------------------- diff --git a/examples/flexjs/TableExample/src/main/flex/dataTable/mapper/DataTableMapperForArrayListData.as b/examples/flexjs/TableExample/src/main/flex/dataTable/mapper/DataTableMapperForArrayListData.as new file mode 100644 index 0000000..c80234c --- /dev/null +++ b/examples/flexjs/TableExample/src/main/flex/dataTable/mapper/DataTableMapperForArrayListData.as @@ -0,0 +1,112 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 dataTable.mapper +{ + import dataTable.DataColumn; + import dataTable.model.DataTableModel; + + import org.apache.flex.collections.ArrayList; + import org.apache.flex.core.IBead; + import org.apache.flex.core.IBeadModel; + import org.apache.flex.core.IStrand; + import org.apache.flex.events.Event; + import org.apache.flex.events.IEventDispatcher; + import org.apache.flex.html.Label; + import org.apache.flex.html.Table; + import org.apache.flex.html.TableCell; + import org.apache.flex.html.TableHeader; + import org.apache.flex.html.TableRow; + import org.apache.flex.html.supportClasses.DataItemRenderer; + + public class DataTableMapperForArrayListData implements IBead + { + public function DataTableMapperForArrayListData() + { + } + + private var _strand:IStrand; + + public function set strand(value:IStrand):void + { + _strand = value; + + IEventDispatcher(_strand).addEventListener("initComplete", handleInitComplete); + } + + private function handleInitComplete(event:Event):void + { + var model:DataTableModel = _strand.getBeadByType(IBeadModel) as DataTableModel; + if (model == null) return; + + var dp:ArrayList = model.dataProvider as ArrayList; + if (dp == null || dp.length == 0) return; + + var table:Table = _strand as Table; + + var createHeaderRow:Boolean = false; + for(var c:int=0; c < model.columns.length; c++) + { + var test:DataColumn = model.columns[c] as DataColumn; + if (test.label != null) { + createHeaderRow = true; + break; + } + } + + if (createHeaderRow) { + var headerRow:TableRow = new TableRow(); + + for(c=0; c < model.columns.length; c++) + { + test = model.columns[c] as DataColumn; + var tableHeader:TableHeader = new TableHeader(); + var label:Label = new Label(); + tableHeader.addElement(label); + label.text = test.label == null ? "" : test.label; + headerRow.addElement(tableHeader); + } + + table.addElement(headerRow); + } + + for(var i:int=0; i < dp.length; i++) + { + var tableRow:TableRow = new TableRow(); + + for(var j:int=0; j < model.columns.length; j++) + { + var column:DataColumn = model.columns[j] as DataColumn; + var tableCell:TableCell = new TableCell(); + + var ir:DataItemRenderer = column.itemRenderer.newInstance() as DataItemRenderer; + tableCell.addElement(ir); + tableRow.addElement(tableCell); + + ir.labelField = column.dataField; + ir.index = i; + ir.data = dp.getItemAt(i); + } + + table.addElement(tableRow); + } + + table.dispatchEvent(new Event("layoutNeeded")); + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/336fac64/examples/flexjs/TableExample/src/main/flex/dataTable/model/DataTableModel.as ---------------------------------------------------------------------- diff --git a/examples/flexjs/TableExample/src/main/flex/dataTable/model/DataTableModel.as b/examples/flexjs/TableExample/src/main/flex/dataTable/model/DataTableModel.as new file mode 100644 index 0000000..084b512 --- /dev/null +++ b/examples/flexjs/TableExample/src/main/flex/dataTable/model/DataTableModel.as @@ -0,0 +1,40 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 dataTable.model +{ + import org.apache.flex.html.beads.models.ArrayListSelectionModel; + + public class DataTableModel extends ArrayListSelectionModel + { + public function DataTableModel() + { + super(); + } + + private var _columns:Array; + public function get columns():Array + { + return _columns; + } + public function set columns(value:Array):void + { + _columns = value; + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/336fac64/examples/flexjs/TableExample/src/main/flex/models/ProductsModel.as ---------------------------------------------------------------------- diff --git a/examples/flexjs/TableExample/src/main/flex/models/ProductsModel.as b/examples/flexjs/TableExample/src/main/flex/models/ProductsModel.as new file mode 100644 index 0000000..06a9b9b --- /dev/null +++ b/examples/flexjs/TableExample/src/main/flex/models/ProductsModel.as @@ -0,0 +1,47 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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.collections.ArrayList; + + public class ProductsModel + { + public function ProductsModel() + { + } + + private var _products:ArrayList = new ArrayList([ + {name: "British Columbia", capital: "Vancouver", country: "Canada"}, + {name: "Coahuila", capital: "Saltilli", country: "Mexico"}, + {name: "Georgia", capital: "Atlanta", country: "USA"}, + {name: "Kyoto", capital: "Kyoto", country: "Japan"}, + {name: "Massachusetts", capital: "Boston", country: "USA"}, + {name: "New South Wales", capital: "Sydney", country: "Australia"}, + {name: "Quebec", capital: "Montreal", country: "Canada"}, + {name: "Shimane", capital: "Matsue", country: "Japan"}, + {name: "Victoria", capital: "Melbourne", country: "Australia"}, + {name: "Yucatan", capital: "Merida", country: "Mexico"} + ]); + + public function get products():ArrayList + { + return _products; + } + } +} \ No newline at end of file
