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 803cde5 tour-de-jewel: refactor image play ground for better layout
and remove Basic controls since are not Jewel
803cde5 is described below
commit 803cde5aadf429765898b8d294e5c936e9736ac2
Author: Carlos Rovira <[email protected]>
AuthorDate: Sun Jul 12 16:13:18 2020 +0200
tour-de-jewel: refactor image play ground for better layout and remove
Basic controls since are not Jewel
---
.../src/main/royale/ImagePlayGround.mxml | 100 +++++++++++++--------
1 file changed, 65 insertions(+), 35 deletions(-)
diff --git a/examples/jewel/TourDeJewel/src/main/royale/ImagePlayGround.mxml
b/examples/jewel/TourDeJewel/src/main/royale/ImagePlayGround.mxml
index 2b327f1..46b6ffe 100644
--- a/examples/jewel/TourDeJewel/src/main/royale/ImagePlayGround.mxml
+++ b/examples/jewel/TourDeJewel/src/main/royale/ImagePlayGround.mxml
@@ -52,67 +52,97 @@ limitations under the License.
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
- <html:H3 text="Jewel Image"/>
-
- <j:Image localId="image"
src="assets/royale_spheres.png" click="imageClick(event)"/>
- <j:Label localId="imageResult" text="Image is
an img tag in html"/>
+ <j:CardHeader>
+ <html:H3 text="Default Image"
className="primary-normal"/>
+ </j:CardHeader>
+ <j:CardPrimaryContent>
+
+ <j:Image
src="assets/royale_spheres.png" click="imageClick(event)"/>
+
+ </j:CardPrimaryContent>
+ <j:CardActions>
+ <j:Label localId="imageResult"
text="Image is an img tag in html"/>
+ </j:CardActions>
</j:Card>
</j:GridCell>
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
- <html:H4 text="Jewel ImageButton"/>
-
- <j:ImageButton localId="imageButton"
src="assets/royale_spheres.png" click="imageButtonClick(event)"/>
- <j:Label localId="imageButtonResult"
text="Image is an input type='image' tag in html"/>
+ <j:CardHeader>
+ <html:H3 text="Default ImageButton"
className="primary-normal"/>
+ </j:CardHeader>
+ <j:CardPrimaryContent>
+
+ <j:ImageButton
src="assets/royale_spheres.png" click="imageButtonClick(event)"/>
+
+ </j:CardPrimaryContent>
+ <j:CardActions>
+ <j:Label localId="imageButtonResult"
text="Image is an input type='image' tag in html"/>
+ </j:CardActions>
</j:Card>
</j:GridCell>
-
-
+
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
- <html:H3 text="Jewel ImageButton with bead
error image alternative"/>
-
- <j:ImageButton
localId="imageButtonWithErrorBead" src="assets/royale.png">
- <j:beads>
- <js:ErrorImage emptyIsError="true"/>
- </j:beads>
- </j:ImageButton>
+ <j:CardHeader>
+ <html:H3 text="Image With ErrorImage"
className="primary-normal"/>
+ </j:CardHeader>
+ <j:CardPrimaryContent>
+
+ <j:Image localId="imageWithErrorBead"
src="assets/royale.png">
+ <j:beads>
+ <js:ErrorImage
emptyIsError="true"/>
+ </j:beads>
+ </j:Image>
+
+ </j:CardPrimaryContent>
+ <j:CardActions>
+ <j:Label text="This image doesn't exits
so ErrorImage loads a default image to show instead."/>
+ </j:CardActions>
</j:Card>
</j:GridCell>
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
- <html:H4 text="Basic ImageButton with bead
error image alternative"/>
-
- <js:ImageButton
localId="imageButtonBasicErrorBead" src="assets/royale.png">
- <js:beads>
- <js:ErrorImage emptyIsError="true"/>
- </js:beads>
- </js:ImageButton>
+ <j:CardHeader>
+ <html:H3 text="ImageButton with
ErrorImage" className="primary-normal"/>
+ </j:CardHeader>
+ <j:CardPrimaryContent>
+
+ <j:ImageButton
localId="imageButtonWithErrorBead" src="assets/royale.png">
+ <j:beads>
+ <js:ErrorImage
emptyIsError="true"/>
+ </j:beads>
+ </j:ImageButton>
+
+ </j:CardPrimaryContent>
+ <j:CardActions>
+ <j:Label text="This image doesn't exits
so ErrorImage loads a default image to show instead."/>
+ </j:CardActions>
</j:Card>
- </j:GridCell>
+ </j:GridCell>
- <j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
+ <!-- <j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
- <html:H3 text="Jewel Image with bead error
image alternative"/>
+ <html:H4 text="Basic Image with bead error
image alternative"/>
- <j:Image localId="imageWithErrorBead"
src="assets/royale.png">
- <j:beads>
+ <js:Image src="assets/royale.png">
+ <js:beads>
<js:ErrorImage emptyIsError="true"/>
- </j:beads>
- </j:Image>
+ </js:beads>
+ </js:Image>
</j:Card>
</j:GridCell>
<j:GridCell desktopNumerator="1" desktopDenominator="2"
tabletNumerator="1" tabletDenominator="2" phoneNumerator="1"
phoneDenominator="1">
<j:Card>
- <html:H4 text="Basic Image with bead error
image alternative"/>
+ <html:H4 text="Basic ImageButton with bead
error image alternative"/>
- <js:Image localId="imageBasicErrorBead"
src="assets/royale.png">
+ <js:ImageButton src="assets/royale.png">
<js:beads>
<js:ErrorImage emptyIsError="true"/>
</js:beads>
- </js:Image>
+ </js:ImageButton>
</j:Card>
- </j:GridCell>
+ </j:GridCell> -->
+
</j:Grid>
</c:ExampleAndSourceCodeTabbedSectionContent>
