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


The following commit(s) were added to refs/heads/develop by this push:
     new fbaffbf  jewel-iconbuttonbar: new ButtonBar with support for icons
fbaffbf is described below

commit fbaffbf7d8e6b15e2409668cd0e9f0120b0fffe1
Author: Carlos Rovira <[email protected]>
AuthorDate: Sun Dec 15 01:57:05 2019 +0100

    jewel-iconbuttonbar: new ButtonBar with support for icons
---
 .../projects/Jewel/src/main/resources/defaults.css |   4 +
 .../Jewel/src/main/resources/jewel-manifest.xml    |   2 +
 .../royale/org/apache/royale/jewel/IconButton.as   |   9 +-
 .../org/apache/royale/jewel/IconButtonBar.as       | 128 +++++++++++++++++++++
 .../royale/org/apache/royale/jewel/ToggleButton.as |   6 +-
 .../jewel/itemRenderers/ButtonBarItemRenderer.as   |  30 +----
 ...temRenderer.as => IconButtonBarItemRenderer.as} |  50 ++++----
 .../Jewel/src/main/sass/components/_buttonbar.sass |   7 +-
 8 files changed, 172 insertions(+), 64 deletions(-)

diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css 
b/frameworks/projects/Jewel/src/main/resources/defaults.css
index 2b8383e..8f47c3d 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -287,6 +287,10 @@ j|ButtonBar {
     IContentView: 
ClassReference("org.apache.royale.jewel.supportClasses.list.DataGroup");
   }
 }
+j|IconButtonBar {
+  IItemRenderer: 
ClassReference("org.apache.royale.jewel.itemRenderers.IconButtonBarItemRenderer");
+}
+
 .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 4b586d9..3d0c40f 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -48,6 +48,7 @@
     <component id="DataGridListArea" 
class="org.apache.royale.jewel.supportClasses.datagrid.DataGridListArea"/>
     <component id="DataGridButtonBar" 
class="org.apache.royale.jewel.supportClasses.datagrid.DataGridButtonBar"/>
     <component id="ButtonBarItemRenderer" 
class="org.apache.royale.jewel.itemRenderers.ButtonBarItemRenderer"/>
+    <component id="IconButtonBarItemRenderer" 
class="org.apache.royale.jewel.itemRenderers.IconButtonBarItemRenderer"/>
 
     <component id="SimpleButton" 
class="org.apache.royale.jewel.supportClasses.button.SimpleButton"/>
     <component id="Button" class="org.apache.royale.jewel.Button"/>
@@ -100,6 +101,7 @@
     <component id="HorizontalListScroll" 
class="org.apache.royale.jewel.beads.controls.list.HorizontalListScroll"/>
 
     <component id="ButtonBar" class="org.apache.royale.jewel.ButtonBar"/>
+    <component id="IconButtonBar" 
class="org.apache.royale.jewel.IconButtonBar"/>
     <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/org/apache/royale/jewel/IconButton.as
 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/IconButton.as
index 03b28a1..503d879 100644
--- 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/IconButton.as
+++ 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/IconButton.as
@@ -20,12 +20,15 @@ package org.apache.royale.jewel
 {
     COMPILE::JS
     {
-        import org.apache.royale.core.WrappedHTMLElement;
-        import org.apache.royale.html.util.addElementToWrapper;
+    import org.apache.royale.core.WrappedHTMLElement;
+    import org.apache.royale.html.util.addElementToWrapper;
+    }
+    COMPILE::JS
+    {
+    import org.apache.royale.events.Event;
     }
     import org.apache.royale.core.IIcon;
     import org.apache.royale.core.IIconSupport;
-    import org.apache.royale.events.Event;
     
     public class IconButton extends Button implements IIconSupport
        {
diff --git 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/IconButtonBar.as
 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/IconButtonBar.as
new file mode 100644
index 0000000..d92ddc6
--- /dev/null
+++ 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/IconButtonBar.as
@@ -0,0 +1,128 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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
+{
+       /**
+        *  The Jewel IconButtonBar class is a component that displays a set of 
IconButtons. The IconButtonBar
+        *  is actually a ButtonBar with an itemRenderer that produces Jewel 
IconButtons.
+        *  
+        *  By default buttons are equally sized, by setting `widthType` to NaN.
+        *  
+        *  The IconButtonBar 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 IconButtonBar extends ButtonBar
+       {
+               public static const PRIMARY:String = "primary";
+        public static const SECONDARY:String = "secondary";
+        public static const EMPHASIZED:String = "emphasized";
+               
+               /**
+                *  constructor.
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion Royale 0.9.7
+                */
+               public function IconButtonBar()
+               {
+                       super();
+               }
+
+               private var _rightPosition:Boolean;
+        /**
+                *  icon's position regarding the text content 
+         *  Can be false ("left") or true ("right"). defaults to false ("left")
+         *  Optional
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion Royale 0.9.7
+                */
+        public function get rightPosition():Boolean
+        {
+            return _rightPosition;
+        }
+        public function set rightPosition(value:Boolean):void
+        {
+                       if (_rightPosition != value)
+            {
+               _rightPosition = value;
+                       }
+        }
+
+               private var _iconField:String = "icon";
+
+               /**
+                *  The name of the field within the data to use as a icon.
+                *  Defaults to "icon".
+                *
+                *  @langversion 3.0
+                *  @playerversion Flash 10.2
+                *  @playerversion AIR 2.6
+                *  @productversion Royale 0.9.7
+                */
+               public function get iconField():String
+               {
+                       return _iconField;
+               }
+               public function set iconField(value:String):void
+               {
+                       if(_iconField != value)
+                       {
+                               _iconField = value;
+                       }
+               }
+
+               private var _material:Boolean;
+        /**
+         *  Use the Material Icons
+         *
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion Royale 0.9.7
+         */
+        public function get material():Boolean
+        {
+            return _material;
+        }
+        public function set material(value:Boolean):void
+        {
+            if (_material != value)
+            {
+                _material = value;
+            }
+        }
+       }
+}
diff --git 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ToggleButton.as
 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ToggleButton.as
index f6e366a..0f4dab0 100644
--- 
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ToggleButton.as
+++ 
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ToggleButton.as
@@ -20,12 +20,12 @@ package org.apache.royale.jewel
 {
     COMPILE::SWF
     {
-        import flash.events.MouseEvent;
+    import flash.events.MouseEvent;
     }
     COMPILE::JS
     {
-        import org.apache.royale.core.WrappedHTMLElement;
-        import org.apache.royale.events.MouseEvent;
+    import org.apache.royale.core.WrappedHTMLElement;
+    import org.apache.royale.events.MouseEvent;
     }
        import org.apache.royale.core.IIcon;
        import org.apache.royale.core.ISelectable;
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
index 794a89c..2e6c93e 100644
--- 
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
@@ -22,7 +22,6 @@ package org.apache.royale.jewel.itemRenderers
        {
        import org.apache.royale.core.WrappedHTMLElement;
        }
-
        import org.apache.royale.core.SimpleCSSStylesWithFlex;
        import org.apache.royale.events.ItemClickedEvent;
        import org.apache.royale.events.MouseEvent;
@@ -33,8 +32,8 @@ package org.apache.royale.jewel.itemRenderers
        import org.apache.royale.jewel.beads.views.ButtonBarView;
 
        /**
-        * The ButtonBarItemRenderer class extends Button and turns it into an 
itemRenderer
-        * suitable for use in most DataContainer/List/DataGrid applications.
+        *  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
@@ -50,7 +49,6 @@ package org.apache.royale.jewel.itemRenderers
                        style = new SimpleCSSStylesWithFlex();
 
                        addEventListener('click', handleClickEvent);
-
                }
 
                private var _data:Object;
@@ -72,26 +70,7 @@ package org.apache.royale.jewel.itemRenderers
                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;
-                       }
+                       text = getLabelFromData(this, value);
                }
 
                /**
@@ -108,7 +87,6 @@ package org.apache.royale.jewel.itemRenderers
                /*
                 * IItemRenderer, ISelectableItemRenderer
                 */
-
                private var _itemRendererParent:Object;
                /**
                 * The parent container for the itemRenderer instance.
@@ -152,7 +130,7 @@ package org.apache.royale.jewel.itemRenderers
                public function set labelField(value:String):void
                {
                        _labelField = value;
-                       updateButtonLabelFromData();
+                       text = getLabelFromData(this, value);
                }
 
                private var _listData:Object;
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/IconButtonBarItemRenderer.as
similarity index 85%
copy from 
frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/itemRenderers/ButtonBarItemRenderer.as
copy to 
frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/itemRenderers/IconButtonBarItemRenderer.as
index 794a89c..637e471 100644
--- 
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/IconButtonBarItemRenderer.as
@@ -22,35 +22,36 @@ package org.apache.royale.jewel.itemRenderers
        {
        import org.apache.royale.core.WrappedHTMLElement;
        }
-
+       import org.apache.royale.core.IIcon;
        import org.apache.royale.core.SimpleCSSStylesWithFlex;
+       import org.apache.royale.core.ValuesManager;
        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;
-       import org.apache.royale.jewel.ButtonBar;
+       import org.apache.royale.jewel.IconButton;
        import org.apache.royale.jewel.beads.views.ButtonBarView;
+       import org.apache.royale.jewel.supportClasses.IEmphasis;
+       import org.apache.royale.jewel.IconButtonBar;
 
        /**
-        * The ButtonBarItemRenderer class extends Button and turns it into an 
itemRenderer
-        * suitable for use in most DataContainer/List/DataGrid applications.
+        *  The IconButtonBarItemRenderer class extends IconButton 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 class IconButtonBarItemRenderer extends IconButton implements 
ITextItemRenderer
        {
-               public function ButtonBarItemRenderer()
+               public function IconButtonBarItemRenderer()
                {
                        super();
 
                        style = new SimpleCSSStylesWithFlex();
 
                        addEventListener('click', handleClickEvent);
-
                }
 
                private var _data:Object;
@@ -72,25 +73,15 @@ package org.apache.royale.jewel.itemRenderers
                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;
+                       text = getLabelFromData(this, value);
+                       rightPosition = ((itemRendererParent as 
ButtonBarView).buttonBar as IconButtonBar).rightPosition;
+                       if(value.icon)
+                       {
+                               var iconClass:Class = 
ValuesManager.valuesImpl.getValue((itemRendererParent as 
ButtonBarView).buttonBar, "iconClass") as Class;
+                               var fontIcon:IIcon = new iconClass(); 
+                               fontIcon.material = ((itemRendererParent as 
ButtonBarView).buttonBar as IconButtonBar).material;
+                               fontIcon.text = value[((itemRendererParent as 
ButtonBarView).buttonBar as IconButtonBar).iconField];
+                               icon = fontIcon;
                        }
                }
 
@@ -108,7 +99,6 @@ package org.apache.royale.jewel.itemRenderers
                /*
                 * IItemRenderer, ISelectableItemRenderer
                 */
-
                private var _itemRendererParent:Object;
                /**
                 * The parent container for the itemRenderer instance.
@@ -126,7 +116,7 @@ package org.apache.royale.jewel.itemRenderers
                {
                        _itemRendererParent = value;
 
-                       var buttonBar:ButtonBar = (itemRendererParent as 
ButtonBarView).buttonBar;
+                       var buttonBar:IEmphasis = (itemRendererParent as 
ButtonBarView).buttonBar;
                        if(buttonBar.emphasis != null)
                        {
                                emphasis = buttonBar.emphasis;
@@ -152,7 +142,7 @@ package org.apache.royale.jewel.itemRenderers
                public function set labelField(value:String):void
                {
                        _labelField = value;
-                       updateButtonLabelFromData();
+                       text = getLabelFromData(this, value);
                }
 
                private var _listData:Object;
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_buttonbar.sass 
b/frameworks/projects/Jewel/src/main/sass/components/_buttonbar.sass
index 64452ae..fdf227d 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_buttonbar.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_buttonbar.sass
@@ -34,7 +34,6 @@ $border-radius: .25rem
             border-top-right-radius: $border-radius
             border-bottom-right-radius: $border-radius
 
-
 j|ButtonBar
     IBeadModel: 
ClassReference("org.apache.royale.html.beads.models.ButtonBarModel")
     IBeadView:  
ClassReference("org.apache.royale.jewel.beads.views.ButtonBarView")             
       
@@ -46,4 +45,8 @@ j|ButtonBar
 
 @media -royale-swf
     j|ButtonBar
-        IContentView: 
ClassReference("org.apache.royale.jewel.supportClasses.list.DataGroup")
\ No newline at end of file
+        IContentView: 
ClassReference("org.apache.royale.jewel.supportClasses.list.DataGroup")
+
+j|IconButtonBar
+    IItemRenderer: 
ClassReference("org.apache.royale.jewel.itemRenderers.IconButtonBarItemRenderer")
+    // this requires in App to define in CSS -> iconClass: 
ClassReference("org.apache.royale.icons.FontIcon")
\ No newline at end of file

Reply via email to