Load random image from XML file - actionscript-3

I have almost non-existanl knowledge on AS3/Flash CS5.
I need to load a random image from an XML file with the list of urls.
Every time I load the movie, it should load a random image.
Any idea how to do this?

I'm assuming this is what your xml file looks like:
<images>
<image url="http://url_to_image/1.png" width="100" height="100" />
<image url="http://url_to_image/2.png" width="100" height="100" />
<image url="http://url_to_image/3.png" width="100" height="100" />
<image url="http://url_to_image/4.png" width="100" height="100" />
<image url="http://url_to_image/5.png" width="100" height="100" />
</images>
And here's what you'll do to get a random one from those:
private function randomImage(imagesXML:XML):Object {
var imageList:XMLList=imagesXML.image;
var imageCollection:XMLListCollection=new XMLListCollection(imageList);
var random:int=Math.floor(Math.random() * imageCollection.length);
var r:Object={};
r.url=xmlCollection[random].#url;
r.width=Number(xmlCollection[random].#width);
r.height=Number(xmlCollection[random].#height);
return r;
}
And here's how you would call it:
private var x:XML=<images>
<image url="http://url_to_image/1.png" width="100" height="100" />
<image url="http://url_to_image/2.png" width="100" height="100" />
<image url="http://url_to_image/3.png" width="100" height="100" />
<image url="http://url_to_image/4.png" width="100" height="100" />
<image url="http://url_to_image/5.png" width="100" height="100" />
</images>;
var img:Object=randomImage(x);
Now you have img.url, img.width, img.height

Related

How to embed 3rd party html page into the report?

How can i create this code for Jasperstudio, to display a page (by url) on a iframe within the report?
Using a text box, and html component.
<iframe src="demo_iframe.htm" name="iframe_a"></iframe>
<p>W3Schools.com</p>
Any direction would be helpful, this is the idea i have so far.
<componentElement>
<reportElement x="260" y="20" width="190" height="50" uuid="b7e534fb-15d5-4138-9522-793cf8d71afe">
<property name="net.sf.jasperreports.export.flash.element.allow.script.access" value="frame"/>
</reportElement>
<hc:html xmlns:hc="http://jasperreports.sourceforge.net/htmlcomponent" xsi:schemaLocation="http://jasperreports.sourceforge.net/htmlcomponent http://jasperreports.sourceforge.net/xsd/htmlcomponent.xsd" scaleType="RetainShape" horizontalAlign="Left" verticalAlign="Middle">
<hc:htmlContentExpression><![CDATA["page will be displayed here"]]></hc:htmlContentExpression>
</hc:html>
</componentElement>
<componentElement>
<reportElement x="0" y="20" width="190" height="50" uuid="b7e534fb-15d5-4138-9522-793cf8d71afe"/>
<hc:html xmlns:hc="http://jasperreports.sourceforge.net/htmlcomponent" xsi:schemaLocation="http://jasperreports.sourceforge.net/htmlcomponent http://jasperreports.sourceforge.net/xsd/htmlcomponent.xsd" scaleType="RetainShape" horizontalAlign="Left" verticalAlign="Middle">
<hc:htmlContentExpression><![CDATA["<a href='http://google.ca' target='frame'>click to go to google.ca</a>"]]></hc:htmlContentExpression>
</hc:html>
</componentElement>

how to get id of BorderContainer at runtime in Flex

I am getting error while attempting to get id of BorderContainer at runtime. I tried using getStyle but it is also failing.
<s:Panel id="colorPanel"
title="Dem display color"
width="500" height="500">
<s:layout>
<s:BasicLayout/>
</s:layout>
<s:Label id="label" y="4" horizontalCenter="0"/>
<s:BorderContainer id="Box1" x="70" y="70" height="50" width="50" backgroundColor="#0000ff">
</s:BorderContainer>
<s:BorderContainer id="Box2" x="90" y="90" height="51" width="50" backgroundColor="#00ff00">
</s:BorderContainer>
<s:BorderContainer id="Box3" x="50" y="50" height="52" width="50" backgroundColor="#ff0000">
</s:BorderContainer>
<s:Button label="Click" click="
colorPanel.setElementIndex(colorPanel.getElementAt(0),3);
label.text = ""+colorPanel.getElementAt(0).id ;
">
</s:Button>
</s:Panel>
Instead of casting to BorderContainer, it is safe to cast to UIComponent. In your example it crashes when the returned element is Label instead of BorderContainer. You can do as below:
<?xml version="1.0"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark">
<fx:Script><![CDATA[
import mx.core.UIComponent;
]]></fx:Script>
<s:Panel id="colorPanel"
title="Dem display color"
width="500" height="500">
<s:layout>
<s:BasicLayout/>
</s:layout>
<s:Label id="label" text="Red" y="4" horizontalCenter="0"/>
<s:BorderContainer id="Blue" x="70" y="70" height="50" width="50" backgroundColor="#0000ff">
</s:BorderContainer>
<s:BorderContainer id="Green" x="90" y="90" height="51" width="50" backgroundColor="#00ff00">
</s:BorderContainer>
<s:BorderContainer id="Red" x="50" y="50" height="52" width="50" backgroundColor="#ff0000">
</s:BorderContainer>
<s:Button label="Click" click="{
colorPanel.setElementIndex(colorPanel.getElementAt(1),3);
label.text = UIComponent(colorPanel.getElementAt(3)).id;}"/>
</s:Panel>
</s:Application>
Solution I found seems like over rigidness on the part of Adobe. I was able to get value of Id the moment I casted the returned Element as BorderContainer. So we have to live with it till Adobe lowers it's compiler's expectations from us.
label.text = ""+ BorderContainer(colorPanel.getElementAt(0)).id ;

Using dynamic id's or name's to change text of a label

I have a flex app I'm working on and want to be able to loop thru a series of labels and assign the text for them
kinda like
var labelnum:String = "1013";
var elem:Label = this["label" + labelnum];
elem.text = "this one";
example of the grid items... I have both name and id set
<mx:GridItem width="100%" height="100%">
<mx:Label text="1005" id="label1005" name="label1005" />
</mx:GridItem>
<mx:GridItem width="100%" height="100%">
<mx:Label text="1006" id="label1006" name="label1006" />
</mx:GridItem>
<mx:GridItem width="100%" height="100%">
<mx:Label text="1007" id="label1007" name="label1007" />
</mx:GridItem>
<mx:GridItem width="100%" height="100%">
<mx:Label text="1008" id="label1008" name="label1008" />
</mx:GridItem>
What is the proper way to access these labels and change the text?

get id inactionscript/flex

How to get all child ids of myCanvas1.Also for a specific mxml tag say <mx:Move /> how to get its id from action script
<?xml version="1.0" encoding="utf-8"?>
<mx:Application layout="absolute" xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
[Bindable("__NoChangeEvent__")]
[Embed(source="fruits.jpg")]
private var fruitImageClass:Class;
public function clickhandler(event:Event):void
{
//How to get all childs of myCanvas1
}
]]>
</mx:Script>
<mx:Canvas backgroundColor="#A9C0E7" borderStyle="solid" height="300" id="myCanvas1" width="300">
<mx:Move id="fruitAnimation1" target="{fruitImage}" xTo="100" yTo="10" />
<mx:Move id="fruitAnimation2" target="{fruitImage2}" xTo="100" yTo="10" />
</mx:Canvas>
<mx:Canvas backgroundColor="#A9C0E7" borderStyle="solid" height="800" id="myCanvas" width="800">
<mx:Image height="50" id="fruitImage" source="{fruitImageClass}" width="50" x="250" y="10" />
<mx:Image height="50" id="fruitImage2" source="{fruitImageClass}" width="50" x="250" y="10" />
</mx:Canvas>
<mx:Button click="clickhandler(event)" label="Generate" x="100" y="316" />
</mx:Application>
The problem of your code is children of myCanvas1 are not visual components and this declaration has no sense. You shouldn't put your animations, effects and transitions into visual container. That's all what I can say about your question :)
Have you looked at any of the getChild.. methods?
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/collections/HierarchicalCollectionView.html#getChildren%28%29
Does this help?

Flex zoom and scroll issue

i am required to zoom a canvas through Hslider.
The problem is after zooming the canvas i cannot scroll to the extreme left and top of the canvas i.e some part of left and top canvas are not visible. i cannot find the reason.
The source code for the example is given below.
"
import mx.events.SliderEvent;
private function changeZoom(event:SliderEvent) : void
{
layout_cnv.scaleY = event.target.values[0]*2/100;
layout_cnv.scaleX = event.target.values[0]*2/100;
}
private function adjustDefaultZoom() : void
{
layout_cnv.scaleX = slider.values[0]/100*2;
layout_cnv.scaleY = slider.values[0]/100*2;
}
private function myDataTipFunc(val:String):String {
return String(val)+ "%";
}
]]>
</mx:Script>
<mx:Panel title="Zoom Demo" width="100%" height="100%">
<mx:Canvas id="canvas" width="100%" height="100%" horizontalScrollPosition="500">
<!--<mx:Image id="img" x="{canvas.width/2 - img.width/2}"
y="{canvas.height/2 - img.height/2}"
source="#Embed('../assets/products/Nokia_6630.png')"
creationComplete="adjustDefaultZoom()"
/>-->
<mx:Canvas visible="true" id="layout_cnv" creationComplete="adjustDefaultZoom()" borderStyle="solid" height="300"
width="500" verticalCenter="0" horizontalCenter="0"
verticalScrollPolicy="off" horizontalScrollPolicy="off" backgroundColor="#FFFFFF">
<mx:TextArea id="company_name_ta" visible="true" selectable="true" editable="true" height="20" backgroundAlpha="0.0" borderColor="#000000" width="200" fontSize="14"
borderStyle="solid" x="10" y="10" />
<mx:TextArea id="job_ta" height="20" selectable="true" borderColor="#000000" width="200" x="289" y="10" backgroundAlpha="0.0" textAlign="right"/>
<mx:TextArea id="fullname_ta" height="20" selectable="true" backgroundAlpha="0.0" borderColor="#000000" width="200" x="10" y="38" editable="true" enabled="true"/>
<mx:TextArea id="adress_line3_ta" height="20" selectable="true" backgroundAlpha="0.0" borderColor="#000000" width="200" x="10" y="268"/>
<mx:TextArea id="adress_line2_ta" height="20" selectable="true" backgroundAlpha="0.0" borderColor="#000000" width="200" x="10" y="240"/>
<mx:TextArea id="adress_line1_ta" height="20" selectable="true" backgroundAlpha="0.0" borderColor="#000000" width="200" y="212" x="10"/>
<mx:TextArea id="mobile_ta" height="20" selectable="true" backgroundAlpha="0.0" borderColor="#000000" width="200" x="289" y="40" textAlign="right"/>
<mx:TextArea id="fax_ta" height="20" selectable="true" backgroundAlpha="0.0" borderColor="#000000" width="200" y="68" x="289" textAlign="right"/>
<mx:TextArea id="email_ta" height="20" selectable="true" backgroundAlpha="0.0" borderColor="#000000" width="200" x="289" y="268" textAlign="right"/>
</mx:Canvas>
</mx:Canvas>
<mx:ControlBar horizontalAlign="center">
<mx:HSlider id="slider"
width="400"
minimum="1"
maximum="100"
labels="['0%','100%']"
values="[50]"
tickInterval="10"
snapInterval="1"
liveDragging="true"
change="changeZoom(event)"
dataTipFormatFunction="myDataTipFunc" />
</mx:ControlBar>
</mx:Panel>
"
please help .
Thanks in advance.
You wouldn't have this problem if instead of centering the zoomable canvas, you'd show it at coords in the top left part of its parent.
Alternatively you could calculate the needed coordinates, based on the size of its parent, and not let them drop below 0.
Here's code that will help:
private function calculateCoordinates() : void
{
var x : Number = (canvas.width - layout_cnv.width) / 2;
x = x < 0 ? 0 : x;
var y : Number = (canvas.height - layout_cnv.height) / 2;
y = y < 0 ? 0 : y;
layout_cnv.move(x, y);
}
All you have to do is add this method to your application and
this.callLater(calculateCoordinates);
at the end of your changeZoom and adjustDefaultZoom methods. Also remove align properties from layout_cnv.
Took a while to figure this one out. Seems that since you are using verticalCenter and horizontal center the canvas is being drawn outside of the viewable area. When running right-click and select 'show redraw regions' then you can clearly see that the canvas is outside of the area.
Once you remove the verticalCenter and horizontal center it seemed to be working (seeing all of the canvas while scrolling.)
On another note I don't see why you want two canvas in the same panel with nothing between them. Maybe this was just for your example.
Good luck
//Declare a variable
[Bindable]
public var myborderColor: ColorPicker = new ColorPicker();
private function init():void
{
myborderColor:.selectedColor = Color.WHITE ;
… …. in other function change the color
myborderColor:.selectedColor = Color.RED ;
mx:TextInput id=”myText” backgroundColor=”{numcasoborderColor.selectedColor}”