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 629960e dropdownlist first cut
629960e is described below
commit 629960e3b6058a3ebd18e56a36b032cda733667b
Author: Carlos Rovira <[email protected]>
AuthorDate: Wed Apr 18 18:05:11 2018 +0200
dropdownlist first cut
---
.../src/main/royale/AlertPlayGround.mxml | 2 +-
.../src/main/royale/ButtonPlayGround.mxml | 10 +-
...PlayGround.mxml => DropDownListPlayGround.mxml} | 38 ++-
.../src/main/royale/ListPlayGround.mxml | 16 +-
.../JewelExample/src/main/royale/MainContent.mxml | 1 +
.../projects/Jewel/src/main/resources/defaults.css | 8 +
.../Jewel/src/main/resources/jewel-manifest.xml | 1 +
.../projects/Jewel/src/main/royale/JewelClasses.as | 3 +-
.../royale/org/apache/royale/jewel/DropDownList.as | 244 +++++++++++++++++
.../royale/jewel/beads/views/DropDownListView.as | 305 +++++++++++++++++++++
.../src/main/sass/components/_dropdownlist.sass | 31 +++
.../projects/Jewel/src/main/sass/defaults.sass | 1 +
.../JewelTheme/src/main/resources/defaults.css | 42 +++
.../sass/components-emphasized/_dropdownlist.sass | 22 ++
.../sass/components-primary/_dropdownlist.sass | 79 ++++++
.../sass/components-secondary/_dropdownlist.sass | 22 ++
.../themes/JewelTheme/src/main/sass/defaults.sass | 3 +
17 files changed, 809 insertions(+), 19 deletions(-)
diff --git a/examples/royale/JewelExample/src/main/royale/AlertPlayGround.mxml
b/examples/royale/JewelExample/src/main/royale/AlertPlayGround.mxml
index c9a81b9..e57bb47 100644
--- a/examples/royale/JewelExample/src/main/royale/AlertPlayGround.mxml
+++ b/examples/royale/JewelExample/src/main/royale/AlertPlayGround.mxml
@@ -34,7 +34,7 @@ limitations under the License.
private function clickHandler(event:MouseEvent):void {
var alert:Alert = Alert.show("Do you want to save your
changes?", "Save Changes", 3);
alert.addEventListener(CloseEvent.CLOSE,
alertClickHandler);
- alert.height = 300;
+ // alert.height = 300;
}
// Event handler function for displaying the selected Alert button.
diff --git a/examples/royale/JewelExample/src/main/royale/ButtonPlayGround.mxml
b/examples/royale/JewelExample/src/main/royale/ButtonPlayGround.mxml
index aa44652..06e2411 100644
--- a/examples/royale/JewelExample/src/main/royale/ButtonPlayGround.mxml
+++ b/examples/royale/JewelExample/src/main/royale/ButtonPlayGround.mxml
@@ -23,13 +23,21 @@ limitations under the License.
xmlns:j="library://ns.apache.org/royale/jewel"
className="container">
+ <fx:Script>
+ <![CDATA[
+ private function clickHandler(event:MouseEvent):void {
+ button.primary = !button.primary;
+ }
+ ]]>
+ </fx:Script>
+
<js:beads>
<j:HorizontalLayoutWithPaddingAndGap gap="10"/>
</js:beads>
<html:H3 text="Jewel Button"/>
- <j:Button/>
+ <j:Button id="button" click="clickHandler(event)"/>
<j:Button primary="true"/>
<j:Button secondary="true"/>
<j:Button emphasized="true"/>
diff --git a/examples/royale/JewelExample/src/main/royale/ButtonPlayGround.mxml
b/examples/royale/JewelExample/src/main/royale/DropDownListPlayGround.mxml
similarity index 60%
copy from examples/royale/JewelExample/src/main/royale/ButtonPlayGround.mxml
copy to examples/royale/JewelExample/src/main/royale/DropDownListPlayGround.mxml
index aa44652..4fd6856 100644
--- a/examples/royale/JewelExample/src/main/royale/ButtonPlayGround.mxml
+++ b/examples/royale/JewelExample/src/main/royale/DropDownListPlayGround.mxml
@@ -23,21 +23,37 @@ limitations under the License.
xmlns:j="library://ns.apache.org/royale/jewel"
className="container">
+ <fx:Script>
+ <![CDATA[
+ import org.apache.royale.collections.ArrayList;
+
+ private function changeHandler(event:Event):void {
+ trace("ddl change");
+ }
+
+ private var _strings:Array = ["AAPL", "ADBE", "GOOG",
"MSFT", "YHOO"];
+ [Bindable("__NoChangeEvent__")]
+ public function get strings():Array
+ {
+ return _strings;
+ }
+ ]]>
+ </fx:Script>
+
<js:beads>
<j:HorizontalLayoutWithPaddingAndGap gap="10"/>
+ <js:ViewDataBinding />
</js:beads>
- <html:H3 text="Jewel Button"/>
+ <html:H3 text="Jewel DropDownList"/>
- <j:Button/>
- <j:Button primary="true"/>
- <j:Button secondary="true"/>
- <j:Button emphasized="true"/>
-
- <j:Button>
- <j:beads>
- <j:Disabled/>
- </j:beads>
- </j:Button>
+ <j:DropDownList dataProvider="{strings}"/>
+
+
+ <!-- <j:DropDownList change="changeHandler(event)">
+ <j:dataProvider>
+ <js:ArrayList id="avengersCharacters" source="[Iron
Man, Hulk, Thor, Captain America, Black Widow]" />
+ </j:dataProvider>
+ </j:DropDownList> -->
</js:Group>
diff --git a/examples/royale/JewelExample/src/main/royale/ListPlayGround.mxml
b/examples/royale/JewelExample/src/main/royale/ListPlayGround.mxml
index 821fa3e..1fbd517 100644
--- a/examples/royale/JewelExample/src/main/royale/ListPlayGround.mxml
+++ b/examples/royale/JewelExample/src/main/royale/ListPlayGround.mxml
@@ -26,15 +26,19 @@ limitations under the License.
<fx:Script>
<![CDATA[
+ import org.apache.royale.collections.ArrayList;
+
private function onChange(event:Event):void {
- trace("change");
+ selected.text = "Selected: " + list.selectedItem;
}
+
+ public var simple:ArrayList = new ArrayList(["Blueberries",
"Bananas", "Lemons", "Oranges", "Watermelons"]);
]]>
</fx:Script>
- <mdl:model>
+ <js:model>
<models:ListsModel/>
- </mdl:model>
+ </js:model>
<js:beads>
<j:VerticalLayoutWithPaddingAndGap gap="10"/>
@@ -45,10 +49,12 @@ limitations under the License.
<j:List id="list" width="200" height="300" change="onChange(event)">
<js:beads>
<js:ConstantBinding
- sourceID="model"
- sourcePropertyName="watchmen"
+
+ sourcePropertyName="simple"
destinationPropertyName="dataProvider" />
</js:beads>
</j:List>
+
+ <j:Label id="selected"/>
</js:Group>
diff --git a/examples/royale/JewelExample/src/main/royale/MainContent.mxml
b/examples/royale/JewelExample/src/main/royale/MainContent.mxml
index 79ca3d4..0830fa3 100644
--- a/examples/royale/JewelExample/src/main/royale/MainContent.mxml
+++ b/examples/royale/JewelExample/src/main/royale/MainContent.mxml
@@ -33,6 +33,7 @@ limitations under the License.
<local:LabelPlayGround/>
<local:ButtonPlayGround/>
<local:TextButtonPlayGround/>
+ <local:DropDownListPlayGround/>
</js:Group>
<js:Group>
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css
b/frameworks/projects/Jewel/src/main/resources/defaults.css
index 9208d6a..74e327a 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -122,6 +122,14 @@ j|ControlBar {
IBorderBead:
ClassReference("org.apache.royale.html.beads.SingleLineBorderBead");
}
}
+@media -royale-swf {
+ j|DropDownList {
+ IBeadModel:
ClassReference("org.apache.royale.html.beads.models.ArraySelectionModel");
+ IBeadView:
ClassReference("org.apache.royale.jewel.beads.views.DropDownListView");
+ IBeadController:
ClassReference("org.apache.royale.html.beads.controllers.DropDownListController");
+ IPopUp:
ClassReference("org.apache.royale.html.supportClasses.DropDownListList");
+ }
+}
j|ListItemRenderer {
IBeadController:
ClassReference("org.apache.royale.html.beads.controllers.ItemRendererMouseController");
}
diff --git a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
index 2ab9c16..02b7007 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -33,6 +33,7 @@
<component id="ControlBar" class="org.apache.royale.jewel.ControlBar"/>
<component id="TitleBar" class="org.apache.royale.jewel.TitleBar"/>
<component id="List" class="org.apache.royale.jewel.List"/>
+ <component id="DropDownList" class="org.apache.royale.jewel.DropDownList"/>
<component id="Disabled"
class="org.apache.royale.jewel.beads.controls.Disabled"/>
diff --git a/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
b/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
index 90f6538..a7dc5d2 100644
--- a/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
+++ b/frameworks/projects/Jewel/src/main/royale/JewelClasses.as
@@ -46,7 +46,8 @@ package
import org.apache.royale.jewel.beads.views.RadioButtonView;
RadioButtonView;
import org.apache.royale.jewel.beads.views.CheckBoxView;
CheckBoxView;
-
+
+ import org.apache.royale.jewel.beads.views.DropDownListView;
DropDownListView;
}
import org.apache.royale.jewel.beads.layouts.HorizontalLayout;
HorizontalLayout;
diff --git
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/DropDownList.as
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/DropDownList.as
new file mode 100644
index 0000000..9c7fd76
--- /dev/null
+++
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/DropDownList.as
@@ -0,0 +1,244 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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.core.ISelectionModel;
+
+ COMPILE::JS
+ {
+ import goog.events;
+ import org.apache.royale.core.WrappedHTMLElement;
+ import org.apache.royale.html.beads.models.ArraySelectionModel;
+ import org.apache.royale.html.util.addElementToWrapper;
+ }
+
+ //--------------------------------------
+ // Events
+ //--------------------------------------
+
+ /**
+ * Dispatched when the user selects an item.
+ *
+ * @toplevel
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ [Event(name="change", type="org.apache.royale.events.Event")]
+
+ /**
+ * The DropDownList class implements the basic equivalent of
+ * the <code><select></code> tag in HTML.
+ * The default implementation only lets the user see and
+ * choose from an array of strings. More complex controls
+ * would display icons as well as strings, or colors instead
+ * of strings or just about anything.
+ *
+ * The default behavior only lets the user choose one and
+ * only one item. More complex controls would allow
+ * mutiple selection by not dismissing the dropdown as soon
+ * as a selection is made.
+ *
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ public class DropDownList extends Button
+ {
+ /**
+ * Constructor.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ public function DropDownList()
+ {
+ typeNames = "jewel dropdownlist";
+
+ COMPILE::JS
+ {
+ model = new ArraySelectionModel();
+ }
+ }
+
+ /**
+ * The data set to be displayed. Usually a simple
+ * array of strings. A more complex component
+ * would allow more complex data and data sets.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9
+ * @royaleignorecoercion org.apache.royale.core.ISelectionModel
+ */
+ public function get dataProvider():Object
+ {
+ return ISelectionModel(model).dataProvider;
+ }
+
+ /**
+ * @private
+ * @royaleignorecoercion HTMLOptionElement
+ * @royaleignorecoercion HTMLSelectElement
+ * @royaleignorecoercion org.apache.royale.core.ISelectionModel
+ */
+ public function set dataProvider(value:Object):void
+ {
+ ISelectionModel(model).dataProvider = value;
+ COMPILE::JS
+ {
+ var dp:HTMLOptionsCollection;
+ var i:int;
+ var n:int;
+ var opt:HTMLOptionElement;
+ var dd:HTMLSelectElement = element as HTMLSelectElement;
+
+ dp = dd.options;
+ n = dp.length;
+ for (i = 0; i < n; i++) {
+ dd.remove(0);
+ }
+ // The value could be undefined if data binding is used and
the variable is not initialized.
+ if(!value)return;
+
+ var lf:String = labelField;
+ n = value.length;
+ for (i = 0; i < n; i++) {
+ opt = document.createElement('option') as
HTMLOptionElement;
+ if (lf)
+ opt.text = value[i][lf];
+ else
+ opt.text = value[i];
+ dd.add(opt, null);
+ }
+
+ }
+ }
+
+ [Bindable("change")]
+ /**
+ * @copy org.apache.royale.core.ISelectionModel#selectedIndex
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9
+ * @royaleignorecoercion org.apache.royale.core.ISelectionModel
+ */
+ public function get selectedIndex():int
+ {
+ return ISelectionModel(model).selectedIndex;
+ }
+
+ /**
+ * @private
+ * @royaleignorecoercion HTMLSelectElement
+ * @royaleignorecoercion org.apache.royale.core.ISelectionModel
+ */
+ public function set selectedIndex(value:int):void
+ {
+ ISelectionModel(model).selectedIndex = value;
+ COMPILE::JS
+ {
+ (element as HTMLSelectElement).selectedIndex =
ISelectionModel(model).selectedIndex;
+ }
+ }
+
+
+ [Bindable("change")]
+ /**
+ * @copy org.apache.royale.core.ISelectionModel#selectedItem
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9
+ * @royaleignorecoercion org.apache.royale.core.ISelectionModel
+ */
+ public function get selectedItem():Object
+ {
+ return ISelectionModel(model).selectedItem;
+ }
+
+ /**
+ * @private
+ * @royaleignorecoercion HTMLSelectElement
+ * @royaleignorecoercion org.apache.royale.core.ISelectionModel
+ */
+ public function set selectedItem(value:Object):void
+ {
+ ISelectionModel(model).selectedItem = value;
+ COMPILE::JS
+ {
+ (element as HTMLSelectElement).selectedIndex =
ISelectionModel(model).selectedIndex;
+ }
+ }
+
+ /**
+ * The name of field within the data used for display. Each item of
the
+ * data should have a property with this name.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9
+ * @royaleignorecoercion org.apache.royale.core.ISelectionModel
+ */
+ public function get labelField():String
+ {
+ return ISelectionModel(model).labelField;
+ }
+ /**
+ * @royaleignorecoercion org.apache.royale.core.ISelectionModel
+ */
+ public function set labelField(value:String):void
+ {
+ ISelectionModel(model).labelField = value;
+ }
+
+ /**
+ * @royaleignorecoercion org.apache.royale.core.WrappedHTMLElement
+ * @royaleignorecoercion HTMLSelectElement
+ */
+ COMPILE::JS
+ override protected function createElement():WrappedHTMLElement
+ {
+ addElementToWrapper(this,'select');
+ (element as HTMLSelectElement).size = 1;
+ goog.events.listen(element, 'change',
+ changeHandler);
+ return element;
+ }
+
+ /**
+ * @royaleignorecoercion HTMLSelectElement
+ */
+ COMPILE::JS
+ protected function changeHandler(event:Event):void
+ {
+ model.selectedIndex = (element as HTMLSelectElement).selectedIndex;
+ }
+ }
+}
diff --git
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DropDownListView.as
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DropDownListView.as
new file mode 100644
index 0000000..d576a68
--- /dev/null
+++
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/DropDownListView.as
@@ -0,0 +1,305 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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 flash.display.DisplayObjectContainer;
+ import flash.display.Graphics;
+ import flash.display.Shape;
+ import flash.display.SimpleButton;
+ import flash.display.Sprite;
+ import flash.text.TextFieldType;
+
+ import org.apache.royale.core.BeadViewBase;
+ import org.apache.royale.core.CSSTextField;
+ import org.apache.royale.core.IBeadView;
+ import org.apache.royale.core.IChild;
+ import org.apache.royale.core.IPopUpHost;
+ import org.apache.royale.core.ISelectionModel;
+ import org.apache.royale.core.IStrand;
+ import org.apache.royale.core.IUIBase;
+ import org.apache.royale.core.ValuesManager;
+ import org.apache.royale.events.Event;
+ import org.apache.royale.events.IEventDispatcher;
+ import org.apache.royale.utils.SolidBorderUtil;
+ import org.apache.royale.utils.UIUtils;
+ import org.apache.royale.html.beads.IDropDownListView;
+
+ /**
+ * The DropDownListView class is the default view for
+ * the org.apache.royale.html.DropDownList class.
+ * It displays a simple text label with what appears to be a
+ * down arrow button on the right, but really, the entire
+ * view is the button that will display or dismiss the dropdown.
+ *
+ * @viewbead
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ public class DropDownListView extends BeadViewBase implements
IDropDownListView, IBeadView
+ {
+ /**
+ * Constructor.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ public function DropDownListView()
+ {
+ upSprite = new Sprite();
+ downSprite = new Sprite();
+ overSprite = new Sprite();
+ upTextField = new CSSTextField();
+ downTextField = new CSSTextField();
+ overTextField = new CSSTextField();
+ upSprite.addChild(upTextField);
+ overSprite.addChild(overTextField);
+ downSprite.addChild(downTextField);
+ upTextField.parentDrawsBackground = true;
+ downTextField.parentDrawsBackground = true;
+ overTextField.parentDrawsBackground = true;
+ upTextField.selectable = false;
+ upTextField.type = TextFieldType.DYNAMIC;
+ downTextField.selectable = false;
+ downTextField.type = TextFieldType.DYNAMIC;
+ overTextField.selectable = false;
+ overTextField.type = TextFieldType.DYNAMIC;
+ // auto-size collapses if no text
+ //upTextField.autoSize = "left";
+ //downTextField.autoSize = "left";
+ //overTextField.autoSize = "left";
+
+ upArrows = new Shape();
+ overArrows = new Shape();
+ downArrows = new Shape();
+ upSprite.addChild(upArrows);
+ overSprite.addChild(overArrows);
+ downSprite.addChild(downArrows);
+ drawArrows(upArrows);
+ drawArrows(overArrows);
+ drawArrows(downArrows);
+
+ }
+
+
+ private var selectionModel:ISelectionModel;
+
+ private var shape:Shape;
+
+ /**
+ * @copy org.apache.royale.core.IBead#strand
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ override public function set strand(value:IStrand):void
+ {
+ super.strand = value;
+ selectionModel = value.getBeadByType(ISelectionModel) as
ISelectionModel;
+ selectionModel.addEventListener("selectedIndexChanged",
selectionChangeHandler);
+ selectionModel.addEventListener("dataProviderChanged",
selectionChangeHandler);
+ shape = new Shape();
+ shape.graphics.beginFill(0xCCCCCC);
+ shape.graphics.drawRect(0, 0, 10, 10);
+ shape.graphics.endFill();
+ upTextField.styleParent = _strand;
+ downTextField.styleParent = _strand;
+ overTextField.styleParent = _strand;
+ var button:SimpleButton = value as SimpleButton;
+ button.upState = upSprite;
+ button.downState = downSprite;
+ button.overState = overSprite;
+ button.hitTestState = shape;
+ if (selectionModel.selectedIndex !== -1)
+ text = selectionModel.selectedItem.toString();
+ else
+ text = "^W_";
+ upTextField.height = upTextField.textHeight + 4;
+ downTextField.height = downTextField.textHeight + 4;
+ overTextField.height = overTextField.textHeight + 4;
+ if (selectionModel.selectedIndex == -1)
+ text = "";
+
+ IEventDispatcher(value).addEventListener("heightChanged",
changeHandler);
+ IEventDispatcher(value).addEventListener("widthChanged",
changeHandler);
+ changeHandler(null);
+ }
+
+ private function selectionChangeHandler(event:Event):void
+ {
+ if (selectionModel.selectedItem == null)
+ text = "";
+ else if (selectionModel.labelField != null)
+ text =
selectionModel.selectedItem[selectionModel.labelField].toString();
+ else
+ text = selectionModel.selectedItem.toString();
+ }
+
+ private function changeHandler(event:Event):void
+ {
+ var ww:Number = IUIBase(_strand).width;
+ var hh:Number = IUIBase(_strand).height;
+
+ upArrows.x = ww - upArrows.width - 6;
+ overArrows.x = ww - overArrows.width - 6;
+ downArrows.x = ww - downArrows.width - 6;
+ upArrows.y = (hh - upArrows.height) / 2;
+ overArrows.y = (hh - overArrows.height) / 2;
+ downArrows.y = (hh - downArrows.height) / 2;
+
+ upTextField.width = upArrows.x;
+ downTextField.width = downArrows.x;
+ overTextField.width = overArrows.x;
+ upTextField.height = hh;
+ downTextField.height = hh;
+ overTextField.height = hh;
+
+ drawBorder(upSprite, 0xf8f8f8, ww, hh);
+ drawBorder(overSprite, 0xe8e8e8, ww, hh);
+ drawBorder(downSprite, 0xd8d8d8, ww, hh);
+
+ shape.graphics.clear();
+ shape.graphics.beginFill(0xCCCCCC);
+ shape.graphics.drawRect(0, 0, ww, hh);
+ shape.graphics.endFill();
+ }
+
+ private var upTextField:CSSTextField;
+ private var downTextField:CSSTextField;
+ private var overTextField:CSSTextField;
+ private var upSprite:Sprite;
+ private var downSprite:Sprite;
+ private var overSprite:Sprite;
+ private var upArrows:Shape;
+ private var downArrows:Shape;
+ private var overArrows:Shape;
+
+ private function drawBorder(sprite:Sprite, color:uint, ww:Number,
hh:Number):void
+ {
+ sprite.graphics.clear();
+ SolidBorderUtil.drawBorder(sprite.graphics, 0, 0,
+ ww, hh,
+ 0x808080, color, 1, 1, 4);
+ }
+
+ private function drawArrows(shape:Shape):void
+ {
+ var g:Graphics = shape.graphics;
+ g.beginFill(0);
+ g.moveTo(8, 0);
+ g.lineTo(12, 4);
+ g.lineTo(4, 4);
+ g.lineTo(8, 0);
+ g.endFill();
+ g.beginFill(0);
+ g.moveTo(8, 10);
+ g.lineTo(12, 6);
+ g.lineTo(4, 6);
+ g.lineTo(8, 10);
+ g.endFill();
+ }
+
+ /**
+ * The text that is displayed in the view.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ public function get text():String
+ {
+ return upTextField.text;
+ }
+
+ /**
+ * @private
+ */
+ public function set text(value:String):void
+ {
+ upTextField.text = value;
+ downTextField.text = value;
+ overTextField.text = value;
+ }
+
+ private var _popUp:IStrand;
+
+ /**
+ * The dropdown/popup that displays the set of choices.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ public function get popUp():IStrand
+ {
+ if (!_popUp)
+ {
+ var popUpClass:Class =
ValuesManager.valuesImpl.getValue(_strand, "iPopUp") as Class;
+ _popUp = new popUpClass() as IStrand;
+ }
+ return _popUp;
+ }
+
+ private var _popUpVisible:Boolean;
+
+ /**
+ * A flag that indicates whether the dropdown/popup is
+ * visible.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.3
+ */
+ public function get popUpVisible():Boolean
+ {
+ return _popUpVisible;
+ }
+
+ /**
+ * @private
+ */
+ public function set popUpVisible(value:Boolean):void
+ {
+ var host:IPopUpHost;
+ if (value != _popUpVisible)
+ {
+ _popUpVisible = value;
+ if (value)
+ {
+ host = UIUtils.findPopUpHost(_strand as
IUIBase);
+ IPopUpHost(host).addElement(popUp as IChild);
+ }
+ else
+ {
+ host = UIUtils.findPopUpHost(_strand as IUIBase);
+ IPopUpHost(host).removeElement(popUp as IChild);
+ }
+ }
+ }
+
+ }
+}
diff --git
a/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
b/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
new file mode 100644
index 0000000..5b13361
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
@@ -0,0 +1,31 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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 DropDownList
+
+// DropDownList variables
+
+@media -royale-swf
+ j|DropDownList
+ IBeadModel:
ClassReference("org.apache.royale.html.beads.models.ArraySelectionModel")
+ IBeadView:
ClassReference("org.apache.royale.jewel.beads.views.DropDownListView")
+ IBeadController:
ClassReference("org.apache.royale.html.beads.controllers.DropDownListController")
+ IPopUp:
ClassReference("org.apache.royale.html.supportClasses.DropDownListList")
+ // font-size: 11px
+ // font-family: Arial
\ 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 67d553c..239c77b 100644
--- a/frameworks/projects/Jewel/src/main/sass/defaults.sass
+++ b/frameworks/projects/Jewel/src/main/sass/defaults.sass
@@ -25,6 +25,7 @@
@import "components/button"
@import "components/checkbox"
@import "components/controlbar"
+@import "components/dropdownlist"
@import "components/itemRenderer"
@import "components/label"
@import "components/list"
diff --git a/frameworks/themes/JewelTheme/src/main/resources/defaults.css
b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
index 01e82db..bce4706 100644
--- a/frameworks/themes/JewelTheme/src/main/resources/defaults.css
+++ b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
@@ -271,6 +271,48 @@ j|Alert {
font-size: 16px;
}
+.jewel.dropdownlist {
+ cursor: pointer;
+ display: inline-block;
+ margin: 0;
+ padding: 10px 16px;
+ min-width: 74px;
+ min-height: 34px;
+ background: linear-gradient(#e6e6e6, #cccccc);
+ border: 1px solid #b3b3b3;
+ box-shadow: inset 0 1px 0 white;
+ border-radius: 3px;
+ font-family: "Lato", sans-serif;
+ font-size: 14px;
+ font-weight: bold;
+ color: #808080;
+ text-transform: uppercase;
+ text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+ background: linear-gradient(#d9d9d9, silver);
+ border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+ background: linear-gradient(silver, #a6a6a6);
+ border: 1px solid #8d8d8d;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+ outline: none;
+ border: 1px solid #b3b3b3;
+ box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0
rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+ cursor: unset;
+ background: #f3f3f3;
+ border: 1px solid #d9d9d9;
+ box-shadow: none;
+ color: silver;
+ font-weight: normal;
+ text-shadow: unset;
+}
+
.jewel.item {
cursor: pointer;
padding: 8px;
diff --git
a/frameworks/themes/JewelTheme/src/main/sass/components-emphasized/_dropdownlist.sass
b/frameworks/themes/JewelTheme/src/main/sass/components-emphasized/_dropdownlist.sass
new file mode 100644
index 0000000..4c713e9
--- /dev/null
+++
b/frameworks/themes/JewelTheme/src/main/sass/components-emphasized/_dropdownlist.sass
@@ -0,0 +1,22 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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 DropDownList
+
+// DropDownList variables
\ No newline at end of file
diff --git
a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_dropdownlist.sass
b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_dropdownlist.sass
new file mode 100644
index 0000000..87ecfb3
--- /dev/null
+++
b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_dropdownlist.sass
@@ -0,0 +1,79 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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 DropDownList
+
+// DropDownList variables
+$textbutton-margin: 0 !default
+$textbutton-padding: 10px 16px !default
+$textbutton-min-height: 34px !default
+$textbutton-min-width: 74px !default
+
+$textbutton-border-radius: 3px
+
+=textbutton-theme($textbutton-color, $text-color)
+ cursor: pointer
+ display: inline-block
+
+ margin: $textbutton-margin //1rem
+ padding: $textbutton-padding //.938em 1.875em
+
+ min-width: $textbutton-min-width
+ min-height: $textbutton-min-height
+
+ +jewel-bg-border("normal", $textbutton-color, $textbutton-border-radius)
+
+ @if $transitions-enable
+ transition:
+ duration: $transition-duration
+ timing-function: $transition-timing
+
+ font:
+ family: $font-stack
+ size: $font-size
+ weight: bold
+ color: $text-color
+ text:
+ transform: uppercase
+ decoration: none
+ @if not $flat and $text-color == $font-theme-color
+ text:
+ shadow: 0 -1px 0 rgba(darken($textbutton-color, 30%), .7) //0
.063em
+
+ &:hover, &:hover:focus
+ +jewel-bg-border("hover", $textbutton-color)
+
+ &:active, &:active:focus
+ +jewel-bg-border("active", $textbutton-color)
+
+ &:focus
+ outline: none
+ +jewel-bg-border("focus", $textbutton-color)
+
+ &[disabled]
+ cursor: unset
+ +jewel-bg-border("disabled", $textbutton-color)
+ color: $disabled-font-color
+ font:
+ weight: normal
+ text:
+ shadow: unset
+
+.jewel.dropdownlist
+ +textbutton-theme($default-color, $default-font-color)
\ No newline at end of file
diff --git
a/frameworks/themes/JewelTheme/src/main/sass/components-secondary/_dropdownlist.sass
b/frameworks/themes/JewelTheme/src/main/sass/components-secondary/_dropdownlist.sass
new file mode 100644
index 0000000..4c713e9
--- /dev/null
+++
b/frameworks/themes/JewelTheme/src/main/sass/components-secondary/_dropdownlist.sass
@@ -0,0 +1,22 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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 DropDownList
+
+// DropDownList variables
\ No newline at end of file
diff --git a/frameworks/themes/JewelTheme/src/main/sass/defaults.sass
b/frameworks/themes/JewelTheme/src/main/sass/defaults.sass
index 01226fb..74c5d22 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/defaults.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/defaults.sass
@@ -30,6 +30,7 @@
@import "components-primary/button"
@import "components-primary/checkbox"
@import "components-primary/controlbar"
+@import "components-primary/dropdownlist"
@import "components-primary/itemRenderer"
@import "components-primary/label"
@import "components-primary/list"
@@ -43,6 +44,7 @@
@import "components-secondary/button"
@import "components-secondary/checkbox"
@import "components-secondary/controlbar"
+@import "components-secondary/dropdownlist"
@import "components-secondary/itemRenderer"
@import "components-secondary/label"
@import "components-secondary/list"
@@ -56,6 +58,7 @@
@import "components-emphasized/button"
@import "components-emphasized/checkbox"
@import "components-emphasized/controlbar"
+@import "components-emphasized/dropdownlist"
@import "components-emphasized/itemRenderer"
@import "components-emphasized/label"
@import "components-emphasized/list"
--
To stop receiving notification emails like this one, please contact
[email protected].
