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 4c9e2cf tour-de-jewel: add paddings and title to some pages
4c9e2cf is described below
commit 4c9e2cfd620264bfe3e36666dcf3d99a4f48a343
Author: Carlos Rovira <[email protected]>
AuthorDate: Sat Feb 22 01:04:29 2020 +0100
tour-de-jewel: add paddings and title to some pages
---
.../src/main/royale/AlertPlayGround.mxml | 56 +++++++++++----
.../src/main/royale/ButtonPlayGround.mxml | 14 ++++
.../src/main/royale/CheckBoxPlayGround.mxml | 14 ++++
.../src/main/royale/ComboBoxPlayGround.mxml | 12 ++++
.../src/main/royale/DataGridPlayGround.mxml | 14 ++++
.../src/main/royale/DateComponentsPlayGround.mxml | 14 ++++
.../src/main/royale/DropDownListPlayGround.mxml | 13 ++++
.../src/main/royale/FormsValidationPlayGround.mxml | 14 ++++
.../src/main/royale/GridPlayGround.mxml | 17 ++++-
.../src/main/royale/HeadingsAndText.mxml | 81 +++++++++++++++++++---
.../src/main/royale/LayoutsPlayGround.mxml | 72 +++++++++++--------
.../src/main/royale/RadioButtonPlayGround.mxml | 14 ++++
.../src/main/royale/WizardPlayGround.mxml | 17 ++++-
13 files changed, 297 insertions(+), 55 deletions(-)
diff --git a/examples/royale/TourDeJewel/src/main/royale/AlertPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/AlertPlayGround.mxml
index f36e016..366b3f8 100644
--- a/examples/royale/TourDeJewel/src/main/royale/AlertPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/AlertPlayGround.mxml
@@ -85,22 +85,54 @@ limitations under the License.
</fx:Script>
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
<j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
- <j:Card width="350">
- <html:H3 text="Jewel Alert"/>
+ <j:VGroup>
+ <html:H1 text="Jewel Alert"
className="emphasized-dark"/>
- <!-- Alert 1-->
- <j:Label text="Click the button below to display a simple
Alert window" multiline="true"/>
- <j:Button text="Click Me" click="Alert.show('This is an Alert
component example that shows a label text and the default OK button.', 'Alert
Example')"/>
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel Alert
examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
- <!-- Alert 2-->
- <j:Label text="Click the button below to display an Alert
window and capture the button pressed by the user." multiline="true"/>
- <j:Button text="Click Me" click="clickHandler(event)"/>
- <j:Label id="status"/>
+ <j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
+ <!-- Alert 1-->
+ <j:Card>
+ <j:CardPrimaryContent>
+ <j:Label text="Click the button below to display a simple
Alert window" multiline="true"/>
+ </j:CardPrimaryContent>
+ <j:CardActions>
+ <j:Button text="Click Me" click="Alert.show('This is an
Alert component example that shows a label text and the default OK button.',
'Alert Example')"/>
+ </j:CardActions>
+ </j:Card>
+ </j:GridCell>
- <!-- Alert 3 (Complex Example)-->
- <j:Label text="This is a complex example that add and retrieve
beads at runtime. Click the button below to display an Alert window that add
content and make changes in some layout parts." multiline="true"/>
- <j:Button text="Click Me" click="clickHandler2(event)"/>
+ <j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
+ <!-- Alert 2-->
+ <j:Card>
+ <j:CardPrimaryContent>
+ <j:Label text="Click the button below to display an Alert
window and capture the button pressed by the user." multiline="true"/>
+ <j:Label id="status"/>
+ </j:CardPrimaryContent>
+ <j:CardActions>
+ <j:Button text="Click Me" click="clickHandler(event)"/>
+ </j:CardActions>
+ </j:Card>
+ </j:GridCell>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
+ <!-- Alert 3 (Complex Example)-->
+ <j:Card>
+ <j:CardPrimaryContent>
+ <j:Label text="This is a complex example that add and
retrieve beads at runtime. Click the button below to display an Alert window
that add content and make changes in some layout parts." multiline="true"/>
+ </j:CardPrimaryContent>
+ <j:CardActions>
+ <j:Button text="Click Me" click="clickHandler2(event)"/>
+ </j:CardActions>
</j:Card>
</j:GridCell>
</j:Grid>
diff --git a/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
index dcfcd0e..afc6b25 100644
--- a/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/ButtonPlayGround.mxml
@@ -47,6 +47,20 @@ limitations under the License.
</c:beads>
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel Button"
className="emphasized-dark"/>
+
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel Button
examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
+
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
<html:H3 text="Jewel Button"/>
diff --git
a/examples/royale/TourDeJewel/src/main/royale/CheckBoxPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/CheckBoxPlayGround.mxml
index 41b9045..30ebff7 100644
--- a/examples/royale/TourDeJewel/src/main/royale/CheckBoxPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/CheckBoxPlayGround.mxml
@@ -24,6 +24,20 @@ limitations under the License.
xmlns:c="components.*" sourceCodeUrl="CheckBoxPlayGround.mxml">
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel CheckBox"
className="emphasized-dark"/>
+
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel Checkbox
examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
+
<j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
<html:H3 text="Jewel CheckBox"/>
diff --git
a/examples/royale/TourDeJewel/src/main/royale/ComboBoxPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/ComboBoxPlayGround.mxml
index db60805..1412185 100644
--- a/examples/royale/TourDeJewel/src/main/royale/ComboBoxPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/ComboBoxPlayGround.mxml
@@ -74,9 +74,21 @@ limitations under the License.
</c:model>
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
<j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel ComboBox"
className="emphasized-dark"/>
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel ComboBox
examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
<html:H3 text="Jewel ComboBox (String
Collection)"/>
diff --git
a/examples/royale/TourDeJewel/src/main/royale/DataGridPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/DataGridPlayGround.mxml
index 14fb9a3..888451e 100644
--- a/examples/royale/TourDeJewel/src/main/royale/DataGridPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/DataGridPlayGround.mxml
@@ -112,6 +112,20 @@ limitations under the License.
</c:beads>
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel DataGrid"
className="emphasized-dark"/>
+
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel DataGrid
examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
+
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
<html:H3 text="Jewel DataGrid"/>
diff --git
a/examples/royale/TourDeJewel/src/main/royale/DateComponentsPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/DateComponentsPlayGround.mxml
index 91ea665..6dddf5c 100644
--- a/examples/royale/TourDeJewel/src/main/royale/DateComponentsPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/DateComponentsPlayGround.mxml
@@ -91,6 +91,20 @@ limitations under the License.
</c:beads>
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel DateField &
DateChooser" className="emphasized-dark"/>
+
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel DateField
& DateChooser examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
+
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
<html:H3 text="Jewel DateChooser (Default)"/>
diff --git
a/examples/royale/TourDeJewel/src/main/royale/DropDownListPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/DropDownListPlayGround.mxml
index 83cb969..5ec4967 100644
--- a/examples/royale/TourDeJewel/src/main/royale/DropDownListPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/DropDownListPlayGround.mxml
@@ -60,6 +60,19 @@ limitations under the License.
</c:model>
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel DropDownList"
className="emphasized-dark"/>
+
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel DropDownList
examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
diff --git
a/examples/royale/TourDeJewel/src/main/royale/FormsValidationPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/FormsValidationPlayGround.mxml
index 62758d9..1ef9b9b 100644
--- a/examples/royale/TourDeJewel/src/main/royale/FormsValidationPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/FormsValidationPlayGround.mxml
@@ -24,6 +24,20 @@ limitations under the License.
xmlns:c="components.*" sourceCodeUrl="FormsValidationPlayGround.mxml">
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel Forms & Validation"
className="emphasized-dark"/>
+
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel Forms &
Validation examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
+
<j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
<html:H3 text="Jewel Form And Validators"/>
diff --git a/examples/royale/TourDeJewel/src/main/royale/GridPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/GridPlayGround.mxml
index fe699c7..44e3cb6 100644
--- a/examples/royale/TourDeJewel/src/main/royale/GridPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/GridPlayGround.mxml
@@ -35,8 +35,21 @@ limitations under the License.
</c:beads>
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
- <html:H3 text="Grids"/>
- <j:CheckBox text="Turn Gap on/off" change="useGap = !useGap;"
selected="true"/>
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel Grid"
className="emphasized-dark"/>
+
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel Grids
examples.</p>]]></j:html>
+ </j:Label>
+ <j:CheckBox text="Turn Gap on/off"
change="useGap = !useGap;" selected="true"/>
+ </j:VGroup>
+ </j:GridCell>
+
<j:Grid gap="{useGap}">
<j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
diff --git a/examples/royale/TourDeJewel/src/main/royale/HeadingsAndText.mxml
b/examples/royale/TourDeJewel/src/main/royale/HeadingsAndText.mxml
index 9e1287e..fef0099 100644
--- a/examples/royale/TourDeJewel/src/main/royale/HeadingsAndText.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/HeadingsAndText.mxml
@@ -24,22 +24,81 @@ limitations under the License.
xmlns:c="components.*" sourceCodeUrl="HeadingsAndText.mxml">
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
<j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
- <j:Card>
- <html:H3 text="Headings and text"/>
+ <j:VGroup>
+ <html:H1 text="Jewel Headings & Text"
className="emphasized-dark"/>
- <html:H1 text="Heading H1"/>
- <html:H2 text="Heading H2"/>
- <html:H3 text="Heading H3"/>
- <html:H4 text="Heading H4"/>
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel Headings
& Text examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
- <html:Hr width="100%"/>
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:Card>
+ <j:CardHeader>
+ <html:H3 text="Headings and text"/>
+ </j:CardHeader>
+ <j:CardPrimaryContent>
+ <html:H1 text="Heading H1"/>
+ <html:H2 text="Heading H2"/>
+ <html:H3 text="Heading H3"/>
+ <html:H4 text="Heading H4"/>
+ <html:Hr width="100%"/>
+ <html:Span text="Some span text."/>
+ <html:Hr width="100%"/>
+
+ <j:Label text="Normal text used in a
div, texts and fields with single line or multiple lines." multiline="true"/>
+ </j:CardPrimaryContent>
+ </j:Card>
+ </j:GridCell>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
+ <j:Card>
+ <j:CardHeader>
+ <html:H3 text="Primary Text Colors"/>
+ </j:CardHeader>
+ <j:CardPrimaryContent>
+ <j:Label text="Primary Color lightest"
className="primary-lightest"/>
+ <j:Label text="Primary Color light"
className="primary-light"/>
+ <j:Label text="Primary Color normal"
className="primary-normal"/>
+ <j:Label text="Primary Color dark"
className="primary-dark"/>
+ <j:Label text="Primary Color darkest"
className="primary-darkest"/>
+ </j:CardPrimaryContent>
+ </j:Card>
+ </j:GridCell>
- <html:Span text="Some span text."/>
-
- <html:Hr width="100%"/>
+ <j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
+ <j:Card>
+ <j:CardHeader>
+ <html:H3 text="Secondary Text Colors"/>
+ </j:CardHeader>
+ <j:CardPrimaryContent>
+ <j:Label text="Secondary Color
lightest" className="secondary-lightest"/>
+ <j:Label text="Secondary Color light"
className="secondary-light"/>
+ <j:Label text="Secondary Color normal"
className="secondary-normal"/>
+ <j:Label text="Secondary Color dark"
className="secondary-dark"/>
+ <j:Label text="Secondary Color darkest"
className="secondary-darkest"/>
+ </j:CardPrimaryContent>
+ </j:Card>
+ </j:GridCell>
- <j:Label text="Normal text used in a div, texts
and fields with single line or multiple lines." multiline="true"/>
+ <j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
+ <j:Card>
+ <j:CardHeader>
+ <html:H3 text="Emphasized Text Colors"/>
+ </j:CardHeader>
+ <j:CardPrimaryContent>
+ <j:Label text="Emphasized Color
lightest" className="emphasized-lightest"/>
+ <j:Label text="Emphasized Color light"
className="emphasized-light"/>
+ <j:Label text="Emphasized Color normal"
className="emphasized-normal"/>
+ <j:Label text="Emphasized Color dark"
className="emphasized-dark"/>
+ <j:Label text="Emphasized Color
darkest" className="emphasized-darkest"/>
+ </j:CardPrimaryContent>
</j:Card>
</j:GridCell>
</j:Grid>
diff --git a/examples/royale/TourDeJewel/src/main/royale/LayoutsPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/LayoutsPlayGround.mxml
index 0d8b6dc..f595be0 100644
--- a/examples/royale/TourDeJewel/src/main/royale/LayoutsPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/LayoutsPlayGround.mxml
@@ -23,36 +23,53 @@ limitations under the License.
xmlns:js="library://ns.apache.org/royale/basic"
xmlns:c="components.*" sourceCodeUrl="LayoutsPlayGround.mxml">
- <!-- <j:beads>
- <js:ContainerDataBinding/>
- </j:beads> -->
-
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
- <j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
- <j:Card>
- <html:H3 text="Jewel BasicLayout (width200,
height:200px)"/>
-
- <j:Group width="200" height="200"
className="wrapper">
- <j:Button text="Origin"
emphasis="primary"/>
- <j:Button text="x:30,y:30"
emphasis="secondary" x="30" y="30"/>
- <j:Button text="x:60,y:60"
emphasis="emphasized" x="60" y="60"/>
- <j:Button text="bottom/right"
style="bottom:0;right:0"/>
- </j:Group>
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel Layouts"
className="emphasized-dark"/>
+
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel Layouts
examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
+ <j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
+ <j:Card>
+ <j:CardHeader>
+ <html:H3 text="Jewel BasicLayout"/>
+ </j:CardHeader>
+ <j:CardPrimaryContent>
+ <j:Label multiline="true" text="Jewel
BasicLayout (width200, height:200px)"/>
+ <j:Group width="200" height="200"
className="wrapper">
+ <j:Button text="Origin"
emphasis="primary"/>
+ <j:Button text="x:30,y:30"
emphasis="secondary" x="30" y="30"/>
+ <j:Button text="x:60,y:60"
emphasis="emphasized" x="60" y="60"/>
+ <j:Button text="bottom/right"
style="bottom:0;right:0"/>
+ </j:Group>
+ </j:CardPrimaryContent>
</j:Card>
</j:GridCell>
- <j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
+ <j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
- <html:H4 text="Jewel HorizontalLayout"/>
-
- <j:HGroup id="hg" gap="3" className="wrapper">
- <j:Button text="X" emphasis="primary"/>
- <j:Button text="Y"
emphasis="secondary"/>
- <j:Button text="Z"
emphasis="emphasized"/>
- <j:Button text="0" />
- </j:HGroup>
-
- <j:HSlider width="200" value="3" minimum="0"
maximum="10" valueChange="hg.gap = event.target.value"/>
+ <j:CardHeader>
+ <html:H3 text="Jewel HorizontalLayout"/>
+ </j:CardHeader>
+ <j:CardPrimaryContent>
+ <j:HGroup id="hg" gap="3"
className="wrapper">
+ <j:Button text="X"
emphasis="primary"/>
+ <j:Button text="Y"
emphasis="secondary"/>
+ <j:Button text="Z"
emphasis="emphasized"/>
+ <j:Button text="0" />
+ </j:HGroup>
+ </j:CardPrimaryContent>
+ <j:CardActions itemsHorizontalAlign =
"itemsCenter">
+ <j:HSlider width="200" value="3"
minimum="0" maximum="10" valueChange="hg.gap = event.target.value"/>
+ </j:CardActions>
</j:Card>
</j:GridCell>
<j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
@@ -69,8 +86,7 @@ limitations under the License.
<j:HSlider width="200" value="3" minimum="0"
maximum="10" valueChange="vg.gap = event.target.value"/>
</j:Card>
</j:GridCell>
- </j:Grid>
- <j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+
<j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
<html:H3 text="Jewel HorizontalCenteredLayout
(width200, height:200px)"/>
@@ -108,9 +124,7 @@ limitations under the License.
</j:Card>
</j:GridCell>
- </j:Grid>
- <j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
<j:GridCell desktopNumerator="1" desktopDenominator="3"
tabletNumerator="1" tabletDenominator="3" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
<html:H3 text="Jewel HorizontalFlowLayout"/>
diff --git
a/examples/royale/TourDeJewel/src/main/royale/RadioButtonPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/RadioButtonPlayGround.mxml
index 26f5c42..617fb93 100644
--- a/examples/royale/TourDeJewel/src/main/royale/RadioButtonPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/RadioButtonPlayGround.mxml
@@ -24,6 +24,20 @@ limitations under the License.
xmlns:c="components.*" sourceCodeUrl="RadioButtonPlayGround.mxml">
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel RadioButton"
className="emphasized-dark"/>
+
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel RadioButton
examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
+
<j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
<html:H3 text="Jewel RadioButton"/>
diff --git a/examples/royale/TourDeJewel/src/main/royale/WizardPlayGround.mxml
b/examples/royale/TourDeJewel/src/main/royale/WizardPlayGround.mxml
index f758057..25b6501 100644
--- a/examples/royale/TourDeJewel/src/main/royale/WizardPlayGround.mxml
+++ b/examples/royale/TourDeJewel/src/main/royale/WizardPlayGround.mxml
@@ -54,8 +54,23 @@ limitations under the License.
</c:beads>
<j:Grid gap="true" itemsVerticalAlign="itemsSameHeight">
+ <j:beads>
+ <j:Paddings paddingTop="0" paddingLeft="50"
paddingRight="50" paddingBottom="50"/>
+ </j:beads>
+
+ <j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
+ <j:VGroup>
+ <html:H1 text="Jewel Wizard"
className="emphasized-dark"/>
+
+ <j:Label multiline="true">
+ <j:html><![CDATA[<p>Jewel Wizard
examples.</p>]]></j:html>
+ </j:Label>
+ </j:VGroup>
+ </j:GridCell>
+
<j:GridCell desktopNumerator="1" desktopDenominator="1"
tabletNumerator="1" tabletDenominator="1" phoneNumerator="1"
phoneDenominator="1">
- <j:Card width="600">
+ <j:Card>
+
<j:Wizard id="wizard" width="100%" height="500">
<j:previousButton>
<j:Group>