You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ca...@apache.org on 2019/12/12 23:47:09 UTC
[royale-asjs] 08/42: jewel-buttonbar: Initial implementation of
Jewel ButtonBar
This is an automated email from the ASF dual-hosted git repository.
carlosrovira pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git
commit 3475c601f04703aa2609d69f5c1827de54bec813
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Wed Nov 27 18:19:17 2019 +0100
jewel-buttonbar: Initial implementation of Jewel ButtonBar
---
.../projects/Jewel/src/main/resources/defaults.css | 15 ++
.../Jewel/src/main/resources/jewel-manifest.xml | 2 +
.../projects/Jewel/src/main/royale/JewelClasses.as | 1 +
.../royale/org/apache/royale/jewel/ButtonBar.as | 115 ++++++++
.../royale/jewel/beads/views/ButtonBarView.as | 61 +++++
.../jewel/itemRenderers/ButtonBarItemRenderer.as | 291 +++++++++++++++++++++
.../Jewel/src/main/sass/components/_buttonbar.sass | 37 +++
.../projects/Jewel/src/main/sass/defaults.sass | 1 +
8 files changed, 523 insertions(+)
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css b/frameworks/projects/Jewel/src/main/resources/defaults.css
index 4fbf413..192f5ea 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -260,6 +260,21 @@ j|Alert {
IBeadView: ClassReference("org.apache.royale.jewel.beads.views.ButtonView");
}
}
+j|ButtonBar {
+ IBeadModel: ClassReference("org.apache.royale.html.beads.models.ButtonBarModel");
+ IBeadView: ClassReference("org.apache.royale.jewel.beads.views.ButtonBarView");
+ IBeadController: ClassReference("org.apache.royale.jewel.beads.controllers.ListSingleSelectionMouseController");
+ IBeadLayout: ClassReference("org.apache.royale.html.beads.layouts.ButtonBarLayout");
+ IDataProviderItemRendererMapper: ClassReference("org.apache.royale.html.beads.TextItemRendererFactoryForArrayData");
+ IItemRendererClassFactory: ClassReference("org.apache.royale.core.ItemRendererClassFactory");
+ IItemRenderer: ClassReference("org.apache.royale.jewel.itemRenderers.ButtonBarItemRenderer");
+}
+
+@media -royale-swf {
+ j|ButtonBar {
+ IContentView: ClassReference("org.apache.royale.jewel.supportClasses.list.DataGroup");
+ }
+}
.jewel.card {
min-width: 240px;
min-height: 52px;
diff --git a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
index 4ccb8df..aecc645 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -46,6 +46,7 @@
<component id="DataGrid" class="org.apache.royale.jewel.DataGrid"/>
<component id="DataGridColumn" class="org.apache.royale.jewel.supportClasses.datagrid.DataGridColumn"/>
<component id="DataGridListArea" class="org.apache.royale.jewel.supportClasses.datagrid.DataGridListArea"/>
+ <component id="ButtonBarItemRenderer" class="org.apache.royale.jewel.itemRenderers.ButtonBarItemRenderer"/>
<component id="SimpleButton" class="org.apache.royale.jewel.supportClasses.button.SimpleButton"/>
<component id="Button" class="org.apache.royale.jewel.Button"/>
@@ -97,6 +98,7 @@
<component id="HorizontalListScroll" class="org.apache.royale.jewel.beads.controls.list.HorizontalListScroll"/>
+ <component id="ButtonBar" class="org.apache.royale.jewel.ButtonBar"/>
<component id="TabBar" class="org.apache.royale.jewel.TabBar"/>
<component id="TabBarButtonItemRenderer" class="org.apache.royale.jewel.itemRenderers.TabBarButtonItemRenderer"/>
<component id="TabBarButtonInidicatorRestrictedToContentItemRenderer" class="org.apache.royale.jewel.itemRenderers.TabBarButtonInidicatorRestrictedToContentItemRenderer"/>
diff --git a/frameworks/projects/Jewel/src/main/royale/JewelClasses.as b/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
index e27ee9b..97d0a07 100644
--- a/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
+++ b/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
@@ -79,6 +79,7 @@ package
import org.apache.royale.jewel.beads.views.FormItemView; FormItemView;
import org.apache.royale.jewel.beads.views.FormHeadingView; FormHeadingView;
import org.apache.royale.jewel.beads.views.WizardView; WizardView;
+ import org.apache.royale.jewel.beads.views.ButtonBarView; ButtonBarView;
COMPILE::SWF
{
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ButtonBar.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ButtonBar.as
new file mode 100644
index 0000000..20bdbb7
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ButtonBar.as
@@ -0,0 +1,115 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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 org.apache.royale.jewel
+{
+ import org.apache.royale.html.beads.models.ButtonBarModel;
+
+ COMPILE::JS
+ {
+ import org.apache.royale.core.WrappedHTMLElement;
+ import org.apache.royale.html.util.addElementToWrapper;
+ }
+
+ /**
+ * The ButtonBar class is a component that displays a set of Buttons. The ButtonBar
+ * is actually a List with a default horizontal layout and an itemRenderer that
+ * produces Buttons. The ButtonBar uses the following beads:
+ *
+ * org.apache.royale.core.IBeadModel: the data model for the ButtonBar, including the dataProvider.
+ * org.apache.royale.core.IBeadView: constructs the parts of the component.
+ * org.apache.royale.core.IBeadController: handles input events.
+ * org.apache.royale.core.IBeadLayout: sizes and positions the component parts.
+ * org.apache.royale.core.IDataProviderItemRendererMapper: produces itemRenderers.
+ * org.apache.royale.core.IItemRenderer: the class or class factory to use.
+ *
+ * @toplevel
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public class ButtonBar extends List
+ {
+ /**
+ * constructor.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public function ButtonBar()
+ {
+ super();
+
+ typeNames = "jewel buttonbar";
+ }
+
+ /**
+ * @see org.apache.royale.html.beads.models.ButtonBarModel#buttonWidths
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9
+ * @royaleignorecoercion org.apache.royale.html.beads.models.ButtonBarModel
+ */
+ public function get buttonWidths():Array
+ {
+ return ButtonBarModel(model).buttonWidths;
+ }
+ /**
+ * @royaleignorecoercion org.apache.royale.html.beads.models.ButtonBarModel
+ */
+ public function set buttonWidths(value:Array):void
+ {
+ ButtonBarModel(model).buttonWidths = value;
+ }
+
+ /**
+ * @see org.apache.royale.html.beads.models.ButtonBarModel#widthType
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9
+ * @royaleignorecoercion org.apache.royale.html.beads.models.ButtonBarModel
+ */
+ public function get widthType():Number
+ {
+ return ButtonBarModel(model).widthType;
+ }
+ /**
+ * @royaleignorecoercion org.apache.royale.html.beads.models.ButtonBarModel
+ */
+ public function set widthType(value:Number):void
+ {
+ ButtonBarModel(model).widthType = value;
+ }
+
+ /**
+ * @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
+ */
+ COMPILE::JS
+ override protected function createElement():WrappedHTMLElement
+ {
+ return addElementToWrapper(this,'div');
+ }
+ }
+}
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/ButtonBarView.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/ButtonBarView.as
new file mode 100644
index 0000000..1414f76
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/ButtonBarView.as
@@ -0,0 +1,61 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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 org.apache.royale.jewel.beads.views
+{
+ import org.apache.royale.core.IStrand;
+
+ /**
+ * The ButtonBarView class creates the visual elements of the org.apache.royale.html.ButtonBar
+ * component. A ButtonBar is a type of List and ButtonBarView extends the ListView bead, adding a border.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public class ButtonBarView extends ListView
+ {
+ /**
+ * constructor.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public function ButtonBarView()
+ {
+ super();
+ }
+
+ /**
+ * @copy org.apache.royale.core.IBead#strand
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ override public function set strand(value:IStrand):void
+ {
+ _strand = value;
+ super.strand = value;
+ }
+ }
+}
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/itemRenderers/ButtonBarItemRenderer.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/itemRenderers/ButtonBarItemRenderer.as
new file mode 100644
index 0000000..4407527
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/itemRenderers/ButtonBarItemRenderer.as
@@ -0,0 +1,291 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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 org.apache.royale.jewel.itemRenderers
+{
+ import org.apache.royale.core.SimpleCSSStylesWithFlex;
+ import org.apache.royale.events.ItemClickedEvent;
+ import org.apache.royale.events.MouseEvent;
+ import org.apache.royale.html.beads.ITextItemRenderer;
+ import org.apache.royale.html.util.getLabelFromData;
+ import org.apache.royale.jewel.Button;
+
+ COMPILE::JS
+ {
+ import org.apache.royale.core.WrappedHTMLElement;
+ }
+
+ /**
+ * The ButtonBarItemRenderer class extends Button and turns it into an itemRenderer
+ * suitable for use in most DataContainer/List/DataGrid applications.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public class ButtonBarItemRenderer extends Button implements ITextItemRenderer
+ {
+ public function ButtonBarItemRenderer()
+ {
+ super();
+
+ style = new SimpleCSSStylesWithFlex();
+
+ addEventListener('click',handleClickEvent);
+ }
+
+ private var _data:Object;
+
+ /**
+ * The data to be displayed as the text value. Use this in conjunction with
+ * the labelField property to select an item from the dataProvider record to use
+ * as the text value of the button.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public function get data():Object
+ {
+ return _data;
+ }
+ public function set data(value:Object):void
+ {
+ _data = value;
+
+ updateButtonLabelFromData();
+ }
+
+ /**
+ * @royaleignorecoercion String
+ */
+ protected function updateButtonLabelFromData():void
+ {
+ var valueAsString:String;
+
+ if (data == null) return;
+ valueAsString = getLabelFromData(this,data);
+ if (!valueAsString && data.hasOwnProperty("title")) {
+ valueAsString = "" + data["title"];
+ }
+
+ if (valueAsString) text = valueAsString;
+ }
+
+ /**
+ * @private
+ */
+ protected function handleClickEvent(event:MouseEvent):void
+ {
+ var newEvent:ItemClickedEvent = new ItemClickedEvent("itemClicked");
+ newEvent.index = index;
+ newEvent.data = data;
+ dispatchEvent(newEvent);
+ }
+
+ /*
+ * IItemRenderer, ISelectableItemRenderer
+ */
+
+ private var _itemRendererParent:Object;
+
+ /**
+ * The parent container for the itemRenderer instance.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public function get itemRendererParent():Object
+ {
+ return _itemRendererParent;
+ }
+ public function set itemRendererParent(value:Object):void
+ {
+ _itemRendererParent = value;
+ }
+
+ private var _labelField:String = null;
+
+ /**
+ * The name of the field within the data to use as a label. Some itemRenderers use this field to
+ * identify the value they should show while other itemRenderers ignore this if they are showing
+ * complex information.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public function get labelField():String
+ {
+ return _labelField;
+ }
+ public function set labelField(value:String):void
+ {
+ _labelField = value;
+ updateButtonLabelFromData();
+ }
+
+ private var _listData:Object;
+
+ [Bindable("__NoChangeEvent__")]
+ /**
+ * Additional data about the list structure the itemRenderer may
+ * find useful.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public function get listData():Object
+ {
+ return _listData;
+ }
+ public function set listData(value:Object):void
+ {
+ _listData = value;
+ }
+
+ private var _index:int;
+
+ /**
+ * The position with the dataProvider being shown by the itemRenderer instance.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public function get index():int
+ {
+ return _index;
+ }
+ public function set index(value:int):void
+ {
+ _index = value;
+ }
+
+ private var _selectable:Boolean = true;
+ /**
+ * <code>true</code> if the item renderer is can be selected
+ * false otherwise. Use to configure a renderer to be non
+ * selectable.
+ *
+ * Defaults to true
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ public function get selectable():Boolean
+ {
+ return _selectable;
+ }
+
+ public function set selectable(value:Boolean):void
+ {
+ _selectable = value;
+ }
+
+ private var _hoverable:Boolean = true;
+ /**
+ * <code>true</code> if the item renderer is can be hovered
+ * false otherwise. Use to configure a renderer to be non
+ * hoverable.
+ *
+ * Defaults to true
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ public function get hoverable():Boolean
+ {
+ return _hoverable;
+ }
+
+ public function set hoverable(value:Boolean):void
+ {
+ _hoverable = value;
+ }
+
+ private var _hovered:Boolean;
+
+ /**
+ * Whether or not the itemRenderer is in a hovered state.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public function get hovered():Boolean
+ {
+ return _hovered;
+ }
+ public function set hovered(value:Boolean):void
+ {
+ _hovered = value;
+ }
+
+ private var _selected:Boolean;
+
+ /**
+ * Whether or not the itemRenderer is in a selected state.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public function get selected():Boolean
+ {
+ return _selected;
+ }
+ public function set selected(value:Boolean):void
+ {
+ _selected = value;
+ }
+
+ private var _down:Boolean;
+
+ /**
+ * Whether or not the itemRenderer is in a down (or pre-selected) state.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.7
+ */
+ public function get down():Boolean
+ {
+ return _down;
+ }
+ public function set down(value:Boolean):void
+ {
+ _down = value;
+ }
+ }
+}
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_buttonbar.sass b/frameworks/projects/Jewel/src/main/sass/components/_buttonbar.sass
new file mode 100644
index 0000000..9d67b50
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/sass/components/_buttonbar.sass
@@ -0,0 +1,37 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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.
+//
+////////////////////////////////////////////////////////////////////////////////
+
+// Jewel ButtonBar
+
+// ButtonVar variables
+jewel.buttonbar
+
+j|ButtonBar
+ IBeadModel: ClassReference("org.apache.royale.html.beads.models.ButtonBarModel")
+ IBeadView: ClassReference("org.apache.royale.jewel.beads.views.ButtonBarView")
+ IBeadController: ClassReference("org.apache.royale.jewel.beads.controllers.ListSingleSelectionMouseController")
+ IBeadLayout: ClassReference("org.apache.royale.html.beads.layouts.ButtonBarLayout")
+ IDataProviderItemRendererMapper: ClassReference("org.apache.royale.html.beads.TextItemRendererFactoryForArrayData")
+ IItemRendererClassFactory: ClassReference("org.apache.royale.core.ItemRendererClassFactory")
+ IItemRenderer: ClassReference("org.apache.royale.jewel.itemRenderers.ButtonBarItemRenderer")
+ // border-style: none
+
+@media -royale-swf
+ j|ButtonBar
+ IContentView: ClassReference("org.apache.royale.jewel.supportClasses.list.DataGroup")
\ No newline at end of file
diff --git a/frameworks/projects/Jewel/src/main/sass/defaults.sass b/frameworks/projects/Jewel/src/main/sass/defaults.sass
index f848b27..70022ea 100644
--- a/frameworks/projects/Jewel/src/main/sass/defaults.sass
+++ b/frameworks/projects/Jewel/src/main/sass/defaults.sass
@@ -26,6 +26,7 @@
@import "components/alert"
@import "components/badge"
@import "components/button"
+@import "components/buttonbar"
@import "components/card"
@import "components/checkbox"
@import "components/controlbar"