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 2018/08/31 10:17:23 UTC
[royale-asjs] branch develop updated: Handle Combobox popup removal
when clicking outside the popup without selection
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 62265d5 Handle Combobox popup removal when clicking outside the popup without selection
62265d5 is described below
commit 62265d52abdf34f797dc7582841ed029d8fb0cff
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Fri Aug 31 12:17:19 2018 +0200
Handle Combobox popup removal when clicking outside the popup without selection
---
.../src/main/royale/TablePlayGround.mxml | 4 +-
.../projects/Jewel/src/main/resources/defaults.css | 4 +-
.../jewel/beads/controllers/ComboBoxController.as | 47 +++++++++++++++++++---
.../royale/jewel/supportClasses/util/callLater.as | 42 +++++++++++++++++++
.../Jewel/src/main/sass/components/_combobox.sass | 4 +-
5 files changed, 89 insertions(+), 12 deletions(-)
diff --git a/examples/royale/JewelExample/src/main/royale/TablePlayGround.mxml b/examples/royale/JewelExample/src/main/royale/TablePlayGround.mxml
index 60a3d4b..0115a17 100644
--- a/examples/royale/JewelExample/src/main/royale/TablePlayGround.mxml
+++ b/examples/royale/JewelExample/src/main/royale/TablePlayGround.mxml
@@ -254,8 +254,8 @@ limitations under the License.
public function updateFirstItem():void
{
var item:GuitarristVO = (table.dataProvider as ArrayList).getItemAt(0) as GuitarristVO;
- item.guitarrist = "Mango";
- item.year = 2001;
+ item.guitarrist = "Robert Frip";
+ item.year = 1980;
(table.dataProvider as ArrayList).itemUpdated(item);
// tablesModel.guitarrists.itemUpdated(item);
}
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css b/frameworks/projects/Jewel/src/main/resources/defaults.css
index 2c75ee8..a3a6078 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -259,7 +259,7 @@ j|ControlBar {
display: inline-flex;
}
.jewel.combobox .jewel.textinput {
- width: 190px;
+ width: 13.7em;
}
.jewel.combobox .jewel.button {
width: 2.8em;
@@ -287,7 +287,7 @@ j|ComboBox {
.jewel.list.combobox {
position: absolute;
- width: 190px;
+ width: 16.5em;
height: 200px;
}
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controllers/ComboBoxController.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controllers/ComboBoxController.as
index 60a685c..b3e3468 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controllers/ComboBoxController.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controllers/ComboBoxController.as
@@ -20,12 +20,15 @@ package org.apache.royale.jewel.beads.controllers
{
import org.apache.royale.core.IBeadController;
import org.apache.royale.core.IStrand;
+ import org.apache.royale.core.IUIBase;
import org.apache.royale.events.Event;
import org.apache.royale.events.IEventDispatcher;
import org.apache.royale.events.MouseEvent;
import org.apache.royale.jewel.TextInput;
import org.apache.royale.jewel.List;
import org.apache.royale.jewel.beads.controls.combobox.IComboBoxView;
+ import org.apache.royale.jewel.supportClasses.util.callLater;
+ import org.apache.royale.utils.loadBeadFromValuesManager;
/**
* The ComboBoxController class is responsible for listening to
@@ -64,7 +67,6 @@ package org.apache.royale.jewel.beads.controllers
public function set strand(value:IStrand):void
{
_strand = value;
-
viewBead = _strand.getBeadByType(IComboBoxView) as IComboBoxView;
if (viewBead) {
finishSetup();
@@ -77,13 +79,37 @@ package org.apache.royale.jewel.beads.controllers
protected function finishSetup(event:Event = null):void
{
- if (viewBead == null) {
- viewBead = _strand.getBeadByType(IComboBoxView) as IComboBoxView;
- }
-
IEventDispatcher(viewBead.button).addEventListener("click", handleButtonClick);
IEventDispatcher(viewBead.textinput).addEventListener("click", handleButtonClick);
}
+
+ protected function handleControlMouseDown(event:MouseEvent):void
+ {
+ event.stopImmediatePropagation();
+ }
+
+ protected function prepareVisiblePopUp():void
+ {
+ IEventDispatcher(viewBead.popup).addEventListener(MouseEvent.MOUSE_DOWN, handleControlMouseDown);
+ IEventDispatcher(_strand).addEventListener(MouseEvent.MOUSE_DOWN, handleControlMouseDown);
+ callLater(callLaterCallBack);
+ }
+
+ private function callLaterCallBack():void {
+ IUIBase(viewBead.popup).topMostEventDispatcher.addEventListener(MouseEvent.MOUSE_DOWN, handleTopMostEventDispatcherMouseDown);
+ }
+
+ protected function handleTopMostEventDispatcherMouseDown(event:MouseEvent):void
+ {
+ viewBead.popUpVisible = false;
+ }
+
+ protected function prepareHiddenPopUp():void
+ {
+ IEventDispatcher(viewBead.popup).removeEventListener(MouseEvent.MOUSE_DOWN, handleControlMouseDown);
+ IEventDispatcher(_strand).removeEventListener(MouseEvent.MOUSE_DOWN, handleControlMouseDown);
+ IUIBase(viewBead.popup).topMostEventDispatcher.removeEventListener(MouseEvent.MOUSE_DOWN, handleTopMostEventDispatcherMouseDown);
+ }
protected function handleButtonClick(event:MouseEvent):void
{
@@ -93,6 +119,14 @@ package org.apache.royale.jewel.beads.controllers
}
viewBead.popUpVisible = !viewBead.popUpVisible;
+ if(viewBead.popUpVisible)
+ {
+ prepareVisiblePopUp();
+ } else
+ {
+ prepareHiddenPopUp();
+ }
+
if(viewBead.popup != null)
{
IEventDispatcher(viewBead.popup).addEventListener("change", handleListChange);
@@ -101,7 +135,8 @@ package org.apache.royale.jewel.beads.controllers
private function handleListChange(event:Event):void
{
- viewBead.popUpVisible = false;
+ if(viewBead.popUpVisible)
+ viewBead.popUpVisible = false;
IEventDispatcher(_strand).dispatchEvent(new Event("change"));
}
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/supportClasses/util/callLater.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/supportClasses/util/callLater.as
new file mode 100644
index 0000000..0afb1a8
--- /dev/null
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/supportClasses/util/callLater.as
@@ -0,0 +1,42 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// Licensed to the Apache Software Foundation (ASF) under one or more
+// contributor license agreements. See the NOTICE file distributed with
+// this work for additional information regarding copyright ownership.
+// The ASF licenses this file to You under the Apache License, Version 2.0
+// (the "License"); you may not use this file except in compliance with
+// the License. You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package org.apache.royale.jewel.supportClasses.util
+{
+ COMPILE::SWF
+ {
+ import flash.utils.setTimeout;
+ }
+
+ public function callLater(fn:Function, args:Array = null, thisArg:Object = null):void
+ {
+ var calls:Array = [ {thisArg: thisArg, fn: fn, args: args } ];
+ setTimeout(makeCalls, 0);
+ function makeCalls():void
+ {
+ var list:Array = calls;
+ var n:int = list.length;
+ for (var i:int = 0; i < n; i++)
+ {
+ var call:Object = list.shift();
+ var fn:Function = call.fn;
+ fn.apply(call.thisArg, call.args);
+ }
+ }
+ }
+}
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_combobox.sass b/frameworks/projects/Jewel/src/main/sass/components/_combobox.sass
index 9fcca79..a6331ec 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_combobox.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_combobox.sass
@@ -22,7 +22,7 @@
// ComboBox variables
$combobox-button-width: 2.8em
$combobox-button-size: 22px
-$combobox-input-width: 190px
+$combobox-input-width: 13.7em
$combobox-button-xoffset: calc(50% - #{$combobox-button-size/2})
$combobox-button-yoffset: calc(50% - #{$combobox-button-size/2})
@@ -59,7 +59,7 @@ j|ComboBox
.jewel.list.combobox
position: absolute
- width: $combobox-input-width
+ width: $combobox-input-width + $combobox-button-width
height: 200px