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 d0df793 jewel-list: add HorizontalListScroll bead
d0df793 is described below
commit d0df793760d49bc18e5b980b05983c7c073c3913
Author: Carlos Rovira <[email protected]>
AuthorDate: Wed May 8 13:13:48 2019 +0200
jewel-list: add HorizontalListScroll bead
---
.../src/main/resources/jewel-example-styles.css | 5 ++
.../src/main/royale/ListPlayGround.mxml | 14 ++++-
.../itemRenderers/TableStyleListItemRenderer.mxml | 62 ++++++++++++++++++++
.../projects/Jewel/src/main/resources/defaults.css | 6 ++
.../Jewel/src/main/resources/jewel-manifest.xml | 2 +
.../beads/controls/list/HorizontalListScroll.as | 66 ++++++++++++++++++++++
.../Jewel/src/main/sass/components/_list.sass | 6 ++
7 files changed, 160 insertions(+), 1 deletion(-)
diff --git
a/examples/royale/TourDeJewel/src/main/resources/jewel-example-styles.css
b/examples/royale/TourDeJewel/src/main/resources/jewel-example-styles.css
index 7305a00..fcc7018 100644
--- a/examples/royale/TourDeJewel/src/main/resources/jewel-example-styles.css
+++ b/examples/royale/TourDeJewel/src/main/resources/jewel-example-styles.css
@@ -22,6 +22,11 @@
@namespace "http://www.w3.org/1999/xhtml";;
@namespace j "library://ns.apache.org/royale/jewel";
+.tableStyle
+{
+ IItemRenderer: ClassReference("itemRenderers.TableStyleListItemRenderer");
+}
+
.iconListItemRenderer
{
IItemRenderer: ClassReference("itemRenderers.IconListItemRenderer");
diff --git a/examples/royale/TourDeJewel/src/main/royale/ListPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/ListPlayGround.mxml
index 837d41b..88a5ced 100644
--- a/examples/royale/TourDeJewel/src/main/royale/ListPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/ListPlayGround.mxml
@@ -229,6 +229,19 @@ limitations under the License.
<j:Grid gap="true">
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
+ <html:H3 text="Jewel List with Horizontal
Scroll"/>
+ <j:List width="450" height="300"
className="tableStyle"
+ labelField="label"
selectedIndex="1"
+
dataProvider="{listModel.iconListData}">
+ <j:beads>
+ <j:HorizontalListScroll/>
+ </j:beads>
+ </j:List>
+ </j:Card>
+ </j:GridCell>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
+ <j:Card>
<html:H3 text="Jewel List Disabled"/>
<j:List width="200" height="300"
className="iconListItemRenderer" labelField="label" selectedIndex="1">
<j:beads>
@@ -238,7 +251,6 @@ limitations under the License.
</j:List>
</j:Card>
</j:GridCell>
-
</j:Grid>
</c:ExampleAndSourceCodeTabbedSectionContent>
diff --git
a/examples/royale/TourDeJewel/src/main/royale/itemRenderers/TableStyleListItemRenderer.mxml
b/examples/royale/TourDeJewel/src/main/royale/itemRenderers/TableStyleListItemRenderer.mxml
new file mode 100644
index 0000000..b5d3ee8
--- /dev/null
+++
b/examples/royale/TourDeJewel/src/main/royale/itemRenderers/TableStyleListItemRenderer.mxml
@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+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.
+
+-->
+<j:ListItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:j="library://ns.apache.org/royale/jewel"
+ xmlns:js="library://ns.apache.org/royale/basic"
+ xmlns="http://www.w3.org/1999/xhtml";>
+
+ <fx:Script>
+ <![CDATA[
+ import vos.IconListVO;
+ import org.apache.royale.jewel.List;
+ import org.apache.royale.collections.ArrayList;
+ import org.apache.royale.jewel.beads.views.ListView;
+
+ [Bindable("dataChange")]
+ public function get iconList():IconListVO
+ {
+ return data as IconListVO;
+ }
+
+ private function clickCloseButton():void
+ {
+ var view:ListView = this.itemRendererParent as ListView;
+ if (view) {
+ var host:List = view.host as List;
+ if (host) {
+ (host.dataProvider as ArrayList).removeItemAt(index);
+ }
+ }
+ }
+ ]]>
+ </fx:Script>
+
+ <j:beads>
+ <js:ItemRendererDataBinding />
+ <j:HorizontalLayout/>
+ </j:beads>
+
+ <js:FontIcon text="{iconList ? iconList.icon : ''}" material="true"
visible="{iconList ? iconList.icon != null : false}" click="clickCloseButton()"
width="100"/>
+ <j:Label html="{text}" multiline="true" width="300"/>
+ <j:Label html="Third field" multiline="true" width="100"/>
+ <j:Label html="Fourth field" multiline="true" width="200"/>
+
+</j:ListItemRenderer>
+
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css
b/frameworks/projects/Jewel/src/main/resources/defaults.css
index 9327c1f..bc02538 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -3078,6 +3078,12 @@ j|Label {
background: transparent;
border: none;
}
+.jewel.list.horizontalScroll, .jewel.navigation.horizontalScroll {
+ align-items: baseline !important;
+}
+.jewel.list.horizontalScroll .jewel.item, .jewel.navigation.horizontalScroll
.jewel.item {
+ overflow: initial;
+}
j|List {
IBeadView: ClassReference("org.apache.royale.jewel.beads.views.ListView");
diff --git a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
index f0c2e51..e3d8df8 100644
--- a/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
+++ b/frameworks/projects/Jewel/src/main/resources/jewel-manifest.xml
@@ -85,6 +85,8 @@
<component id="EmailValidator"
class="org.apache.royale.jewel.beads.validators.EmailValidator"/>
<component id="AssignTabContent"
class="org.apache.royale.jewel.beads.controls.tabbar.AssignTabContent"/>
+
+ <component id="HorizontalListScroll"
class="org.apache.royale.jewel.beads.controls.list.HorizontalListScroll"/>
<component id="TabBar" class="org.apache.royale.jewel.TabBar"/>
<component id="TabBarButtonItemRenderer"
class="org.apache.royale.jewel.itemRenderers.TabBarButtonItemRenderer"/>
diff --git
a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/list/HorizontalListScroll.as
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/list/HorizontalListScroll.as
new file mode 100644
index 0000000..d9da370
--- /dev/null
+++
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/controls/list/HorizontalListScroll.as
@@ -0,0 +1,66 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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.controls.list
+{
+ import org.apache.royale.core.IBead;
+ import org.apache.royale.core.IStrand;
+ import org.apache.royale.events.Event;
+ import org.apache.royale.jewel.DropDownList;
+ import org.apache.royale.jewel.beads.models.IDropDownListModel;
+ import org.apache.royale.jewel.List;
+
+ /**
+ * The HorizontalListScroll bead is a specialty bead that can be used
with
+ * Jewel List control and gives horizontal scroll to the list
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.6
+ */
+ public class HorizontalListScroll implements IBead
+ {
+ /**
+ * constructor.
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.6
+ */
+ public function HorizontalListScroll()
+ {
+ }
+
+ /**
+ * @copy org.apache.royale.core.IBead#strand
+ *
+ * @langversion 3.0
+ * @playerversion Flash 10.2
+ * @playerversion AIR 2.6
+ * @productversion Royale 0.9.4
+ * @royaleignorecoercion
org.apache.royale.events.IEventDispatcher
+ */
+ public function set strand(value:IStrand):void
+ {
+ var l:List = value as List;
+ l.addClass("horizontalScroll");
+ }
+ }
+}
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_list.sass
b/frameworks/projects/Jewel/src/main/sass/components/_list.sass
index eb383ae..1c2be5f 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_list.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_list.sass
@@ -28,6 +28,12 @@
&.no-chrome
background: transparent
border: none
+
+ &.horizontalScroll
+ align-items: baseline !important
+
+ .jewel.item
+ overflow: initial
j|List
IBeadView: ClassReference("org.apache.royale.jewel.beads.views.ListView")
