I recently learned how to work with API's in Flash Builder. So I made this (note: it has no errors and it works in a normal Flex application:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="957" minWidth="800" minHeight="600"
creationComplete="initApp(event)">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
<s:HTTPService id="myRequest"
resultFormat="e4x"
url="{api_request}"
result="getMyPhotos(event)">
</s:HTTPService>
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.XMLListCollection;
import mx.events.FlexEvent;
import mx.rpc.events.ResultEvent;
[Bindable]
public var api_request:String;
protected function initApp(event:FlexEvent):void
{
btnClear.addEventListener(MouseEvent.CLICK, leegAlleVelden);
btnSearch.addEventListener(MouseEvent.CLICK, zoekOpFlickr);
flickrFotoCollection.addEventListener(MouseEvent.CLICK, haalFoto);
}
protected function zoekOpFlickr(event:MouseEvent):void
{
var api_URL:String = 'http://api.flickr.com/services/rest/';
var api_method:String = 'flickr.photos.search';
var api_key:String = '290845e3c32e4e10a9e4b09fd993ddb9';
var api_tags:String = txtSearchString.text;
api_request = api_URL + '?method=' + api_method +
'&api_key=' + api_key + '&tags=' + api_tags;
myRequest.send(); // hier maak je connectie met flickr
}
//http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=290845e3c32e4e10a9e4b09fd993ddb9&tags=cat&format=rest&api_sig=93e43cc21b7209d2e59af67736d27eb3
protected function leegAlleVelden(event:MouseEvent):void
{
txtSearchString.text="";
}
protected function getMyPhotos(event:ResultEvent):void
{
//photos allemaal ingelezen
flickrFotoCollection.dataProvider = new XMLListCollection(myRequest.lastResult.photos.photo);
}
public function haalFoto(selectedFoto:Object):String {
// http://farm{farm-id}.static.flickr.com/{server-id}/{id}_{secret}_[mstb].jpg
var farm_id:String = selectedFoto.@farm;
var server_id:String = selectedFoto.@server;
var id:String = selectedFoto.@id;
var secret:String = selectedFoto.@secret;
var size:String = 't';
var api_selectedPhotoURL:String = "http://farm"+farm_id+".static.flickr.com/"+server_id+
"/"+id+"_"+secret+"_"+size+".jpg";
return api_selectedPhotoURL;
}
public function toonFoto(event:MouseEvent):void
{
}
]]>
</fx:Script>
<s:BorderContainer x="0" y="21" width="800" height="100%" backgroundColor="#000000">
<s:HGroup x="30" y="14">
<s:TextInput x="0" y="23" width="267" id="txtSearchString"/>
<s:Button x="289" y="24" label="Search" id="btnSearch" click="zoekOpFlickr(event);"/>
<s:Button x="394" y="24" label="Clear" id="btnClear" click="leegAlleVelden(event);"/>
</s:HGroup>
<s:HGroup x="30" y="54" width="742" height="500">
<mx:Tile width="399" height="500">
<mx:Repeater id="flickrFotoCollection" dataProvider="{myRequest.lastResult.photos.photo}">
<s:Image id="fotoKlein"
source="{haalFoto(flickrFotoCollection.currentItem)}"
click="toonFoto(event);"
width="80" height="80"
scaleMode="stretch"/>
</mx:Repeater>
</mx:Tile>
<s:Image id="fotoGroot" width="336" height="500"/>
</s:HGroup>
</s:BorderContainer>
</s:Application>
Next, I wanted to see if I could get it to work in a 4.5.1 mobile application. I didn't get any errors except for a "could not resolve <mx:Repeater>
..." At line 87. So for some reason it doesn't recognize the <mx:Repeater>
tag?
I tried to find the cause of this problem, but didn't find it.
Is there a reason why it works in a normal application, but not in a mobile application?
The MX Components are not supported in a Mobile Project. For that code to compile in a Flash Builder mobile project you will have to manually add the SWC with MX components to the library path. Be prepared for poor performance, though.