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 10822e5  blog-examples: fix and update all blog examples with latest 
Jewel changes and improvements
10822e5 is described below

commit 10822e5fb9d4234a0e15fc0378c03ba58c8145f5
Author: Carlos Rovira <[email protected]>
AuthorDate: Tue Mar 31 00:18:50 2020 +0200

    blog-examples: fix and update all blog examples with latest Jewel changes 
and improvements
---
 .../royale/BE0002_Using_Jewel_Alert_Control.mxml   |  3 ++
 .../royale/BE0003_Using_Jewel_Slider_Control.mxml  |  1 +
 .../BE0004_Adding_an_item_to_a_Jewel_List.mxml     |  4 +--
 ...005_Creating_a_group_of_Jewel_RadioButtons.mxml |  1 +
 ...f_a_Jewel_Textinput_to_update_a_text_label.mxml |  1 +
 ...ns_from_a_group_of_jewel_checkbox_controls.mxml |  1 +
 ..._Using_View_States_to_show_or_hide_content.mxml | 33 +++++++++++++-------
 .../BE0009_Using_an_Item_Renderer_with_a_List.mxml | 27 ++++++++++-------
 ...E0010_Customization_through_the_Royale_API.mxml | 23 ++++++++++----
 ..._Loading_external_data_through_HTTPService.mxml | 35 ++++++++++++----------
 ...rnal_javascript_libraries_in_Apache_Royale.mxml | 30 +++++++++++--------
 .../MainJewelApp/src/main/royale/MainJewelApp.mxml | 20 ++++++++-----
 .../BE0014_Working_with_vector_graphics.mxml       |  2 +-
 13 files changed, 115 insertions(+), 66 deletions(-)

diff --git 
a/examples/blog/BE0002_Using_Jewel_Alert_Control/src/main/royale/BE0002_Using_Jewel_Alert_Control.mxml
 
b/examples/blog/BE0002_Using_Jewel_Alert_Control/src/main/royale/BE0002_Using_Jewel_Alert_Control.mxml
index a5094a5..6b357af 100644
--- 
a/examples/blog/BE0002_Using_Jewel_Alert_Control/src/main/royale/BE0002_Using_Jewel_Alert_Control.mxml
+++ 
b/examples/blog/BE0002_Using_Jewel_Alert_Control/src/main/royale/BE0002_Using_Jewel_Alert_Control.mxml
@@ -46,6 +46,9 @@
 
     <j:initialView>
         <j:View>
+            <j:beads>
+                <j:VerticalCenteredLayout/>
+            </j:beads>
             <j:Button id="button" text="Click Me" emphasis="primary" 
click="clickHandler(event)"/>
         </j:View>
     </j:initialView>
diff --git 
a/examples/blog/BE0003_Using_Jewel_Slider_Control/src/main/royale/BE0003_Using_Jewel_Slider_Control.mxml
 
b/examples/blog/BE0003_Using_Jewel_Slider_Control/src/main/royale/BE0003_Using_Jewel_Slider_Control.mxml
index f5f27bf..af08e77 100644
--- 
a/examples/blog/BE0003_Using_Jewel_Slider_Control/src/main/royale/BE0003_Using_Jewel_Slider_Control.mxml
+++ 
b/examples/blog/BE0003_Using_Jewel_Slider_Control/src/main/royale/BE0003_Using_Jewel_Slider_Control.mxml
@@ -41,6 +41,7 @@
     <j:initialView>
         <j:View>
             <j:beads>
+                <j:Paddings padding="30"/>
                 <j:VerticalLayout gap="3"/>
             </j:beads>
 
diff --git 
a/examples/blog/BE0004_Adding_an_item_to_a_Jewel_List/src/main/royale/BE0004_Adding_an_item_to_a_Jewel_List.mxml
 
b/examples/blog/BE0004_Adding_an_item_to_a_Jewel_List/src/main/royale/BE0004_Adding_an_item_to_a_Jewel_List.mxml
index 901d83f..8c03701 100644
--- 
a/examples/blog/BE0004_Adding_an_item_to_a_Jewel_List/src/main/royale/BE0004_Adding_an_item_to_a_Jewel_List.mxml
+++ 
b/examples/blog/BE0004_Adding_an_item_to_a_Jewel_List/src/main/royale/BE0004_Adding_an_item_to_a_Jewel_List.mxml
@@ -39,15 +39,13 @@
     <j:initialView>
         <j:View>
             <j:beads>
+                <j:Paddings padding="30"/>
                 <j:VerticalLayout gap="3"/>
             </j:beads>
             
             <html:H3 text="Avengers Character List"/>
        
             <j:List id="list" width="200" height="300" 
change="changeHandler(event)">
-                <j:beads>
-                    <j:AddListItemRendererForArrayListData/>
-                </j:beads>
                 <j:dataProvider>
                     <js:ArrayList id="avengersCharacters" source="[Iron Man, 
Hulk, Thor, Captain America, Black Widow]" />
                 </j:dataProvider>
diff --git 
a/examples/blog/BE0005_Creating_a_group_of_Jewel_RadioButtons/src/main/royale/BE0005_Creating_a_group_of_Jewel_RadioButtons.mxml
 
b/examples/blog/BE0005_Creating_a_group_of_Jewel_RadioButtons/src/main/royale/BE0005_Creating_a_group_of_Jewel_RadioButtons.mxml
index 94d6fdb..6c87c2c 100644
--- 
a/examples/blog/BE0005_Creating_a_group_of_Jewel_RadioButtons/src/main/royale/BE0005_Creating_a_group_of_Jewel_RadioButtons.mxml
+++ 
b/examples/blog/BE0005_Creating_a_group_of_Jewel_RadioButtons/src/main/royale/BE0005_Creating_a_group_of_Jewel_RadioButtons.mxml
@@ -33,6 +33,7 @@
     <j:initialView>
         <j:View>
             <j:beads>
+                <j:Paddings padding="30"/>
                 <j:VerticalLayout gap="3"/>
             </j:beads>
 
diff --git 
a/examples/blog/BE0006_Binding_the_text_property_of_a_Jewel_Textinput_to_update_a_text_label/src/main/royale/BE0006_Binding_the_text_property_of_a_Jewel_Textinput_to_update_a_text_label.mxml
 
b/examples/blog/BE0006_Binding_the_text_property_of_a_Jewel_Textinput_to_update_a_text_label/src/main/royale/BE0006_Binding_the_text_property_of_a_Jewel_Textinput_to_update_a_text_label.mxml
index 09c7b9e..118d817 100644
--- 
a/examples/blog/BE0006_Binding_the_text_property_of_a_Jewel_Textinput_to_update_a_text_label/src/main/royale/BE0006_Binding_the_text_property_of_a_Jewel_Textinput_to_update_a_text_label.mxml
+++ 
b/examples/blog/BE0006_Binding_the_text_property_of_a_Jewel_Textinput_to_update_a_text_label/src/main/royale/BE0006_Binding_the_text_property_of_a_Jewel_Textinput_to_update_a_text_label.mxml
@@ -39,6 +39,7 @@
     <j:initialView>
         <j:View>
             <j:beads>
+                <j:Paddings padding="30"/>
                 <j:VerticalLayout gap="3"/>
             </j:beads>
 
diff --git 
a/examples/blog/BE0007_Selecting_options_from_a_group_of_jewel_checkbox_controls/src/main/royale/BE0007_Selecting_options_from_a_group_of_jewel_checkbox_controls.mxml
 
b/examples/blog/BE0007_Selecting_options_from_a_group_of_jewel_checkbox_controls/src/main/royale/BE0007_Selecting_options_from_a_group_of_jewel_checkbox_controls.mxml
index d42a9a2..b119999 100644
--- 
a/examples/blog/BE0007_Selecting_options_from_a_group_of_jewel_checkbox_controls/src/main/royale/BE0007_Selecting_options_from_a_group_of_jewel_checkbox_controls.mxml
+++ 
b/examples/blog/BE0007_Selecting_options_from_a_group_of_jewel_checkbox_controls/src/main/royale/BE0007_Selecting_options_from_a_group_of_jewel_checkbox_controls.mxml
@@ -42,6 +42,7 @@
     <j:initialView>
         <j:View>
             <j:beads>
+                <j:Paddings padding="30"/>
                 <j:VerticalLayout gap="3"/>
             </j:beads>
 
diff --git 
a/examples/blog/BE0008_Using_View_States_to_show_or_hide_content/src/main/royale/BE0008_Using_View_States_to_show_or_hide_content.mxml
 
b/examples/blog/BE0008_Using_View_States_to_show_or_hide_content/src/main/royale/BE0008_Using_View_States_to_show_or_hide_content.mxml
index a126e84..4aedb4c 100644
--- 
a/examples/blog/BE0008_Using_View_States_to_show_or_hide_content/src/main/royale/BE0008_Using_View_States_to_show_or_hide_content.mxml
+++ 
b/examples/blog/BE0008_Using_View_States_to_show_or_hide_content/src/main/royale/BE0008_Using_View_States_to_show_or_hide_content.mxml
@@ -31,22 +31,33 @@
             
             <j:beads>
                 <js:SimpleStatesImpl/>
+                <j:VerticalCenteredLayout/>
             </j:beads>
 
             <j:Card id="loginForm" includeIn="login">
-                <html:H1 text="Royale login"/>
-                <j:TextInput id="username" text="someuser"/>
-                <j:TextInput id="password" text="somepass">
-                    <j:beads>
-                        <j:PasswordInput/>
-                    </j:beads>
-                </j:TextInput>
-                <j:Button text="Login" emphasis="primary" 
click="view.currentState = 'loggedIn'" />
+                <j:CardHeader>
+                    <html:H3 text="Royale login" className="primary-normal"/>
+                </j:CardHeader>
+                <j:CardPrimaryContent>
+                    <j:TextInput id="username" text="someuser"/>
+                    <j:TextInput id="password" text="somepass">
+                        <j:beads>
+                            <j:PasswordInput/>
+                        </j:beads>
+                    </j:TextInput>
+                </j:CardPrimaryContent>
+                <j:CardActions itemsHorizontalAlign="itemsRight">
+                    <j:Button text="Login" emphasis="primary" 
click="view.currentState = 'loggedIn'" />
+                </j:CardActions>
             </j:Card>
 
-            <j:Card id="loggedInForm" includeIn="loggedIn">
-                <html:H1 text="You are logged in!! :)"/>
-                <j:Button text="Logout" click="view.currentState = 'login'"/>
+            <j:Card id="loggedInForm" includeIn="loggedIn" width="50%" 
height="50%">
+                <j:CardHeader>
+                    <html:H3 text="You are logged in!! :)" 
className="primary-normal"/>
+                </j:CardHeader>
+                <j:CardPrimaryContent itemsHorizontalAlign="itemsCenter" 
itemsVerticalAlign="itemsCenter">
+                    <j:Button text="Logout" click="view.currentState = 
'login'"/>
+                </j:CardPrimaryContent>
             </j:Card>
         </j:View>
     </j:initialView>
diff --git a/examples/blog/BE0009_Using_an_Item_ 
Renderer_with_a_List/src/main/royale/BE0009_Using_an_Item_Renderer_with_a_List.mxml
 b/examples/blog/BE0009_Using_an_Item_ 
Renderer_with_a_List/src/main/royale/BE0009_Using_an_Item_Renderer_with_a_List.mxml
index 6510acb..fd56b14 100644
--- a/examples/blog/BE0009_Using_an_Item_ 
Renderer_with_a_List/src/main/royale/BE0009_Using_an_Item_Renderer_with_a_List.mxml
   
+++ b/examples/blog/BE0009_Using_an_Item_ 
Renderer_with_a_List/src/main/royale/BE0009_Using_an_Item_Renderer_with_a_List.mxml
   
@@ -44,20 +44,25 @@
     <j:initialView>
         <j:View>
             <j:beads>
-                <j:HorizontalCenteredLayout/>
+                <j:VerticalCenteredLayout/>
             </j:beads>
 
-            <j:Card width="270">
-                <html:H3 text="Jewel List With ItemRenderer"/>
+            <j:Card width="320">
+                <j:CardHeader>
+                    <html:H3 text="Jewel List With ItemRenderer" 
className="primary-normal"/>
+                </j:CardHeader>
+                <j:CardPrimaryContent>
                 
-                               <j:List width="100%" height="300" 
className="iconListItemRenderer">
-                                       <j:beads>
-                                               <js:ConstantBinding
-                                                       sourceID="listModel"
-                                                       
sourcePropertyName="iconListData"
-                                                       
destinationPropertyName="dataProvider"/>
-                                       </j:beads>
-                               </j:List>
+                                   <j:List width="100%" height="300" 
className="iconListItemRenderer">
+                        <j:beads>
+                            <js:ConstantBinding
+                                sourceID="listModel"
+                                sourcePropertyName="iconListData"
+                                destinationPropertyName="dataProvider"/>
+                        </j:beads>
+                    </j:List>
+                    
+                </j:CardPrimaryContent>
             </j:Card>
         </j:View>
     </j:initialView>
diff --git 
a/examples/blog/BE0010_Customization_through_the_Royale_API/src/main/royale/BE0010_Customization_through_the_Royale_API.mxml
 
b/examples/blog/BE0010_Customization_through_the_Royale_API/src/main/royale/BE0010_Customization_through_the_Royale_API.mxml
index 439a89e..7c35a15 100644
--- 
a/examples/blog/BE0010_Customization_through_the_Royale_API/src/main/royale/BE0010_Customization_through_the_Royale_API.mxml
+++ 
b/examples/blog/BE0010_Customization_through_the_Royale_API/src/main/royale/BE0010_Customization_through_the_Royale_API.mxml
@@ -84,16 +84,27 @@
     <j:initialView>
         <j:View>
             <j:beads>
-                <j:HorizontalCenteredLayout/>
+                <j:VerticalCenteredLayout/>
             </j:beads>
 
-            <j:Card width="350">
-                <html:H3 text="Customization through Royale API"/>
+            <j:Card width="400">
+                <j:CardHeader>
+                    <html:H3 text="Customization through Royale API" 
className="primary-normal"/>
+                </j:CardHeader>
+                <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."
+                                   <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="clickHandler(event)"/>
-                <j:Label id="status"/>
+                    
+                </j:CardPrimaryContent>
+                <j:CardActions itemsVerticalAlign="itemsCentered">
+                    <j:BarSection>
+                        <j:Label id="status"/>
+                    </j:BarSection>
+                    <j:BarSection itemsHorizontalAlign="itemsRight">
+                        <j:Button text="Click Me" 
click="clickHandler(event)"/>                    
+                    </j:BarSection>
+                </j:CardActions>
             </j:Card>
         </j:View>
     </j:initialView>
diff --git 
a/examples/blog/BE0011_Loading_external_data_through_HTTPService/src/main/royale/BE0011_Loading_external_data_through_HTTPService.mxml
 
b/examples/blog/BE0011_Loading_external_data_through_HTTPService/src/main/royale/BE0011_Loading_external_data_through_HTTPService.mxml
index 41e9bc3..dd2590e 100644
--- 
a/examples/blog/BE0011_Loading_external_data_through_HTTPService/src/main/royale/BE0011_Loading_external_data_through_HTTPService.mxml
+++ 
b/examples/blog/BE0011_Loading_external_data_through_HTTPService/src/main/royale/BE0011_Loading_external_data_through_HTTPService.mxml
@@ -54,24 +54,29 @@
     <j:initialView>
         <j:View>
             <j:beads>
-                <j:HorizontalCenteredLayout/>
+                <j:VerticalCenteredLayout/>
             </j:beads>
 
-            <j:Card percentWidth="90">
-                <html:H3 text="Loading Github external data through 
HTTPService"/>
-                
-                <j:Label text="This example loads its source code in the text 
code panel:"/>
+            <j:Card width="90%">
+                <j:CardHeader>
+                    <html:H3 text="Loading Github external data through 
HTTPService" className="primary-normal"/>
+                </j:CardHeader>
+                <j:CardPrimaryContent>
+                    
+                    <j:Label text="This example loads its source code in the 
text code panel:"/>
 
-                 <html:Pre height="300" percentWidth="100" 
style="background-color: white">
-                    <html:beads>
-                        <j:ScrollingViewport/>
-                    </html:beads>
-                    <html:Code id="sourceCodeMXMLText"/>
-                </html:Pre>
-                
-                <j:Label id="jsonData" multiline="true" html="This label shows 
JSON data when loaded."/>
-
-                <j:Button text="Retrieve source code from Github" 
emphasis="primary" click="getGithubContent(event)"/>
+                    <html:Pre height="300" width="100%" 
style="background-color: white">
+                        <html:beads>
+                            <j:ScrollingViewport/>
+                        </html:beads>
+                        <html:Code id="sourceCodeMXMLText"/>
+                    </html:Pre>
+                    
+                    <j:Label id="jsonData" multiline="true" html="This label 
shows JSON data when loaded."/>
+                </j:CardPrimaryContent>
+                <j:CardActions itemsHorizontalAlign="itemsRight">
+                    <j:Button text="Retrieve source code from Github" 
emphasis="primary" click="getGithubContent(event)"/>
+                </j:CardActions>
              </j:Card>
         </j:View>
     </j:initialView>
diff --git 
a/examples/blog/BE0012_Using_external_javascript_libraries_in_Apache_Royale/src/main/royale/BE0012_Using_external_javascript_libraries_in_Apache_Royale.mxml
 
b/examples/blog/BE0012_Using_external_javascript_libraries_in_Apache_Royale/src/main/royale/BE0012_Using_external_javascript_libraries_in_Apache_Royale.mxml
index 8f24425..f0c6a7c 100644
--- 
a/examples/blog/BE0012_Using_external_javascript_libraries_in_Apache_Royale/src/main/royale/BE0012_Using_external_javascript_libraries_in_Apache_Royale.mxml
+++ 
b/examples/blog/BE0012_Using_external_javascript_libraries_in_Apache_Royale/src/main/royale/BE0012_Using_external_javascript_libraries_in_Apache_Royale.mxml
@@ -46,22 +46,28 @@
     <j:initialView>
         <j:View>
             <j:beads>
-                <j:HorizontalCenteredLayout/>
+                <j:VerticalCenteredLayout/>
             </j:beads>
 
             <j:Card percentWidth="90">
-                <html:H3 text="Using external Javascript Libraries"/>
-                
-                <j:Label html="This example uses hljs library to highligh a 
piece of code"/>
+                <j:CardHeader>
+                    <html:H3 text="Using external Javascript Libraries" 
className="primary-normal"/>
+                </j:CardHeader>
+                <j:CardPrimaryContent>
 
-                <html:Pre height="300" percentWidth="100" 
style="background-color: white">
-                    <html:beads>
-                        <j:ScrollingViewport/>
-                    </html:beads>
-                    <html:Code id="sourceCodeMXMLText" text="{code_txt}"/>
-                </html:Pre>
-                
-                <j:Button text="highlight Block" emphasis="primary" 
click="highLightContent()"/>
+                    <j:Label html="This example uses hljs library to highligh 
a piece of code"/>
+
+                    <html:Pre height="300" percentWidth="100" 
style="background-color: white">
+                        <html:beads>
+                            <j:ScrollingViewport/>
+                        </html:beads>
+                        <html:Code id="sourceCodeMXMLText" text="{code_txt}"/>
+                    </html:Pre>
+
+                </j:CardPrimaryContent>
+                <j:CardActions itemsHorizontalAlign="itemsRight">
+                    <j:Button text="highlight Block" emphasis="primary" 
click="highLightContent()"/>
+                </j:CardActions>
              </j:Card>
         </j:View>
     </j:initialView>
diff --git 
a/examples/blog/BE0013_Dividing_an_Apache_Royale_application_with_modules/MainJewelApp/src/main/royale/MainJewelApp.mxml
 
b/examples/blog/BE0013_Dividing_an_Apache_Royale_application_with_modules/MainJewelApp/src/main/royale/MainJewelApp.mxml
index 819204d..3f48f96 100644
--- 
a/examples/blog/BE0013_Dividing_an_Apache_Royale_application_with_modules/MainJewelApp/src/main/royale/MainJewelApp.mxml
+++ 
b/examples/blog/BE0013_Dividing_an_Apache_Royale_application_with_modules/MainJewelApp/src/main/royale/MainJewelApp.mxml
@@ -38,18 +38,24 @@
     <j:initialView>
         <j:View>
             <j:beads>
-                <j:HorizontalCenteredLayout/>
+                <j:VerticalCenteredLayout/>
             </j:beads>
 
-            <j:Card percentWidth="90">
-                <html:H3 text="Dividing an Apache Royale application with 
modules"/>
+            <j:Card width="90%">
+                <j:CardHeader>
+                    <html:H3 text="Dividing an Apache Royale application with 
modules" className="primary-normal"/>
+                </j:CardHeader>
+                <j:CardPrimaryContent>
                 
-                <j:Label html="This example uses Modules to load other 
application parts"/>
+                    <j:Label html="This example uses Modules to load other 
application parts"/>
 
-                <j:ModuleLoader localId="moduleLoader" autoLoad="false"
-                                modulePath="modules" moduleName="JewelModule"/>
+                    <j:ModuleLoader localId="moduleLoader" autoLoad="false"
+                                    modulePath="modules" 
moduleName="JewelModule"/>
 
-                <j:Button text="Load a Module" emphasis="primary" 
click="loadModule()"/>
+                </j:CardPrimaryContent>
+                <j:CardActions itemsHorizontalAlign="itemsRight">
+                    <j:Button text="Load a Module" emphasis="primary" 
click="loadModule()"/>
+                </j:CardActions>
              </j:Card>
         </j:View>
     </j:initialView>
diff --git 
a/examples/blog/BE0014_Working_with_vector_graphics/src/main/royale/BE0014_Working_with_vector_graphics.mxml
 
b/examples/blog/BE0014_Working_with_vector_graphics/src/main/royale/BE0014_Working_with_vector_graphics.mxml
index 5148049..2ab8162 100644
--- 
a/examples/blog/BE0014_Working_with_vector_graphics/src/main/royale/BE0014_Working_with_vector_graphics.mxml
+++ 
b/examples/blog/BE0014_Working_with_vector_graphics/src/main/royale/BE0014_Working_with_vector_graphics.mxml
@@ -104,7 +104,7 @@
 
                     </j:Container>
                 </j:CardPrimaryContent>
-                <j:CardActions itemsHorizontalAlign="itemsRight" 
itemsVerticalAlign="itemsCentered">
+                <j:CardActions itemsVerticalAlign="itemsCentered">
                     <j:BarSection width="50%">
                         <j:ToggleButton localId="ruleVisibility" 
                             outlined="true" emphasis="emphasized"

Reply via email to