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/03/23 18:43:54 UTC
[royale-asjs] branch develop updated: jewel-multiline: add bead for
multiple controls like Button, DropDownList, ... to allow multi line
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 853896a jewel-multiline: add bead for multiple controls like Button, DropDownList,... to allow multi line
853896a is described below
commit 853896a01d40243565bea4a511b04c85f081e200
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Sat Mar 23 19:43:47 2019 +0100
jewel-multiline: add bead for multiple controls like Button, DropDownList,... to allow multi line
---
.../src/main/royale/ButtonPlayGround.mxml | 6 ++-
.../projects/Jewel/src/main/resources/defaults.css | 15 +++----
.../Jewel/src/main/resources/jewel-manifest.xml | 2 +-
.../{button/MultilineLabel.as => MultiLine.as} | 46 +++++++++++-----------
.../projects/Jewel/src/main/sass/_global.sass | 4 ++
.../Jewel/src/main/sass/components/_button.sass | 4 +-
.../src/main/sass/components/_dropdownlist.sass | 2 +-
.../Jewel/src/main/sass/components/_label.sass | 13 ++----
8 files changed, 46 insertions(+), 46 deletions(-)
diff --git a/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml b/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
index dd0a862..45c58ce 100644
--- a/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
@@ -53,7 +53,11 @@ limitations under the License.
<j:Disabled/>
</j:beads>
</j:Button>
- <j:Button text="Button With More Text"/>
+ <j:Button text="Button With Multi line" width="140">
+ <j:beads>
+ <j:MultiLine multiline="true"/>
+ </j:beads>
+ </j:Button>
<j:Button text="Primary" emphasis="{Button.PRIMARY}"/>
<j:Button text="Secondary" emphasis="{Button.SECONDARY}"/>
<j:Button text="Emphasized" emphasis="{Button.EMPHASIZED}"/>
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css b/frameworks/projects/Jewel/src/main/resources/defaults.css
index 02edad7..52cdd25 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -133,6 +133,11 @@ hr {
height: 1px;
}
+.jewel.multiline {
+ white-space: pre-wrap !important;
+ word-wrap: break-word;
+}
+
.responsiveSizeMonitor {
background: rgba(0, 0, 0, 0.8);
color: white;
@@ -234,9 +239,6 @@ j|Alert {
.jewel.button[disabled] {
cursor: default;
}
-.jewel.button.multiline {
- white-space: pre-wrap;
-}
.jewel.button .fonticon {
cursor: inherit;
}
@@ -717,7 +719,6 @@ j|DrawerContent {
-ms-appearance: none;
appearance: none;
width: 200px;
- height: 38px;
margin: 0;
padding: 0.68em 2.38em 0.68em 1.12em;
cursor: pointer;
@@ -876,12 +877,6 @@ j|ImageButton {
white-space: nowrap;
}
-.jewel.label.multiline {
- white-space: pre-wrap;
- word-wrap: break-word;
- width: 100%;
-}
-
j|Label {
IBeadModel: ClassReference("org.apache.royale.jewel.beads.models.TextModel");
}
diff --git a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
index 2f2b39c..50e89a0 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -124,10 +124,10 @@
<component id="ResponsiveDrawer" class="org.apache.royale.jewel.beads.controls.drawer.ResponsiveDrawer"/>
+ <component id="MultiLine" class="org.apache.royale.jewel.beads.controls.MultiLine"/>
<component id="NavigationActionNotifier" class="org.apache.royale.jewel.beads.controls.NavigationActionNotifier"/>
<component id="CleanValidationErrors" class="org.apache.royale.jewel.beads.controls.application.CleanValidationErrors"/>
- <component id="MultilineLabel" class="org.apache.royale.jewel.beads.controls.button.MultilineLabel"/>
<component id="DispatchChangeOnStartup" class="org.apache.royale.jewel.beads.controls.DispatchChangeOnStartup"/>
<component id="DropDownListTextPrompt" class="org.apache.royale.jewel.beads.controls.dropdownlist.DropDownListTextPrompt"/>
<component id="RequireSelection" class="org.apache.royale.jewel.beads.controls.dropdownlist.RequireSelection"/>
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/button/MultilineLabel.as b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/MultiLine.as
similarity index 67%
rename from frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/button/MultilineLabel.as
rename to frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/MultiLine.as
index 1bc457c..157abe6 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/button/MultilineLabel.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/MultiLine.as
@@ -16,22 +16,24 @@
// limitations under the License.
//
////////////////////////////////////////////////////////////////////////////////
-package org.apache.royale.jewel.beads.controls.button
+package org.apache.royale.jewel.beads.controls
{
import org.apache.royale.core.IBead;
import org.apache.royale.core.IStrand;
- import org.apache.royale.jewel.Button;
+ import org.apache.royale.utils.IClassSelectorListSupport;
/**
- * The MultilineLabel bead is a specialty bead that can be used with
- * any DropDownList control to force a data item always be selected in the control
+ * The MultiLine bead is a specialty bead that can be used with
+ * any IClassSelectorListSupport control to allow more than one line
+ * i.e: Button, DropDownList, ...
+ * Note that Label has multiline property baked since is very used on that component
*
* @langversion 3.0
* @playerversion Flash 10.2
* @playerversion AIR 2.6
* @productversion Royale 0.9.6
*/
- public class MultilineLabel implements IBead
+ public class MultiLine implements IBead
{
/**
* constructor.
@@ -41,35 +43,35 @@ package org.apache.royale.jewel.beads.controls.button
* @playerversion AIR 2.6
* @productversion Royale 0.9.6
*/
- public function MultilineLabel()
+ public function MultiLine()
{
}
- private var button:Button;
-
+ protected var control:IClassSelectorListSupport;
/**
* @copy org.apache.royale.core.IBead#strand
*
* @langversion 3.0
* @playerversion Flash 10.2
* @playerversion AIR 2.6
- * @productversion Royale 0.9.6
+ * @productversion Royale 0.9.4
+ * @royaleignorecoercion org.apache.royale.events.IEventDispatcher
*/
public function set strand(value:IStrand):void
{
- button = value as Button;
- updateHost();
- }
+ control = value as IClassSelectorListSupport;
+ updateControl();
+ }
- private var _multiline:Boolean;
+ private var _multiline:Boolean;
/**
* A boolean flag to activate "multiline" effect selector.
- * Allow the Button to have more than one line label if needed
+ * Allow the label to have more than one line if needed
*
* @langversion 3.0
* @playerversion Flash 10.2
* @playerversion AIR 2.6
- * @productversion Royale 0.9.6
+ * @productversion Royale 0.9.4
*/
public function get multiline():Boolean
{
@@ -81,16 +83,16 @@ package org.apache.royale.jewel.beads.controls.button
if (_multiline != value)
{
_multiline = value;
- updateHost();
+ updateControl();
}
}
- protected function updateHost():void
+ protected function updateControl():void
{
- if (button)
- {
- button.toggleClass("multiline", _multiline);
- }
- }
+ if(control)
+ {
+ control.toggleClass("multiline", _multiline);
+ }
+ }
}
}
diff --git a/frameworks/projects/Jewel/src/main/sass/_global.sass b/frameworks/projects/Jewel/src/main/sass/_global.sass
index f095e54..89fe5b1 100644
--- a/frameworks/projects/Jewel/src/main/sass/_global.sass
+++ b/frameworks/projects/Jewel/src/main/sass/_global.sass
@@ -136,6 +136,10 @@ hr
border: 0
height: 1px
+.jewel
+ &.multiline
+ white-space: pre-wrap !important
+ word-wrap: break-word
.responsiveSizeMonitor
background: rgba(0,0,0,0.8)
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_button.sass b/frameworks/projects/Jewel/src/main/sass/components/_button.sass
index bdd0d87..c21ee34 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_button.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_button.sass
@@ -52,8 +52,8 @@ $button-padding: 0.68em 1.12em !default
&[disabled]
cursor: default
- &.multiline
- white-space: pre-wrap
+ //&.multiline
+ // white-space: pre-wrap
.fonticon
cursor: inherit
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass b/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
index 1349890..09c3194 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_dropdownlist.sass
@@ -32,7 +32,7 @@ $dropdownlist-button-yoffset: calc(50% - #{$combobox-button-size/2})
+appear(none)
width: 200px
- height: 38px
+ // height: 38px
margin: $dropdownlist-margin
padding: $dropdownlist-padding-vertical $dropdownlist-padding-horizontal + 1.26em $dropdownlist-padding-vertical $dropdownlist-padding-horizontal
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_label.sass b/frameworks/projects/Jewel/src/main/sass/components/_label.sass
index d26c0ea..1d0e9fb 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_label.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_label.sass
@@ -17,15 +17,10 @@
//
////////////////////////////////////////////////////////////////////////////////
-.jewel.label
- cursor: default
- white-space: nowrap
-
-.jewel.label.multiline
- white-space: pre-wrap
- word-wrap: break-word
- width: 100%
-
+.jewel
+ &.label
+ cursor: default
+ white-space: nowrap
j|Label
IBeadModel: ClassReference("org.apache.royale.jewel.beads.models.TextModel")