Can't understand the exception in Flex? - apache-flex

I was trying the flickr code provided in the learn.adobe.com website, and I am getting this exception:
[RPC Fault faultString="Error #1090: XML parser failure: element is malformed." faultCode="Client.CouldNotDecode" faultDetail="null"]
at mx.rpc.http::HTTPService/http://www.adobe.com/2006/flex/mx/internal::processResult()[C:\autobuild\3.2.0\frameworks\projects\rpc\src\mx\rpc\http\HTTPService.as:851]
at mx.rpc::AbstractInvoker/http://www.adobe.com/2006/flex/mx/internal::resultHandler()[C:\autobuild\3.2.0\frameworks\projects\rpc\src\mx\rpc\AbstractInvoker.as:188]
at mx.rpc::Responder/result()[C:\autobuild\3.2.0\frameworks\projects\rpc\src\mx\rpc\Responder.as:43]
at mx.rpc::AsyncRequest/acknowledge()[C:\autobuild\3.2.0\frameworks\projects\rpc\src\mx\rpc\AsyncRequest.as:74]
at DirectHTTPMessageResponder/completeHandler()[C:\autobuild\3.2.0\frameworks\projects\rpc\src\mx\messaging\channels\DirectHTTPChannel.as:403]
at flash.events::EventDispatcher/dispatchEventFunction()
at flash.events::EventDispatcher/dispatchEvent()
at flash.net::URLLoader/onComplete()
I can't understand this exception. Can anyone help me with this?
This is the code which i have typed
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
backgroundGradientColors="[0xFFFFFF,0xAAAAAA]" horizontalAlign="left"
horizontalGap="15" verticalGap="15" width="459" height="371">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
[Bindable]
public var photoBindable:ArrayCollection;
private function requestPhotos():void{
photoService.cancel();
var params:Object=new Object();
params.format = 'rss_200_enc';
params.tags = searchTerm.text;
photoService.send(params);
}
private function photoHandler(event:ResultEvent):void{
photoBindable=event.result.rss.channel.items as ArrayCollection;
}
]]>
</mx:Script>
<mx:HTTPService id="photoService"
url="http://api.flickr.com/services/feeds/photos_public.gne"
result="photoHandler(event)" />
<mx:HBox>
<mx:Label text="Flicker tags" />
<mx:TextInput id="searchTerm" />
<mx:Button label="Search" click="requestPhotos()"/>
</mx:HBox>
<mx:TileList width="100%" height="100%"
dataProvider="{photoBindable}"
itemRenderer="thumbnail">
</mx:TileList>
</mx:Application>
This is itemRender thumbnail.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" width="75" height="75"
horizontalScrollPolicy="off" verticalScrollPolicy="off"
paddingBottom="5" paddingLeft="5" paddingTop="5">
<mx:Image width="75" height="75" source="{data.thumbnail.url}" />
<mx:Text text="{data.credits}" />
</mx:VBox>

Of course there's an error in the XML or in the .php file, maybe blank space or something else; check the first line of xml which has to start only with the following statement:
<?xml version="1.0" encoding="utf-8"?>
I'm quite sure you forget to import the itemRender:
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
import itemRender; //substitute itemRender with your own itemRender.mxml file
]]>
</mx:Script>
Anyway take a look to this page even if it's italian language the code is very simple to understand.
Hope to be useful

I think the problem is in this tag event.result.rss.channel.items it is not items it is item
Remove the extra 's' .....
The example is good...it worked for me...you can use this code below to check
Printing my code here...i added some more stuff to it
FlickrPrj.mxml
<mx:Script>
<![CDATA[
import mx.events.ListEvent;
import mx.controls.Alert;
import mx.managers.PopUpManager;
import mx.rpc.events.ResultEvent;
import mx.collections.ArrayCollection;
[Bindable]
public var photoFeed:ArrayCollection;
public function searchFlickr():void {
photoService.cancel();
var params:Object = new Object();
params.format = 'rss_200_enc';
params.tags = srchTxtId.text;
photoService.send(params);
}
public function resultHandler(event:ResultEvent):void {
photoFeed = event.result.rss.channel.item as ArrayCollection;
}
public function openPanel(levent:ListEvent):void {
var panelCmpObj:panelcomp = new panelcomp();
panelCmpObj.source = levent.itemRenderer.data.content.url;
PopUpManager.addPopUp(panelCmpObj,this,true);
}
public function test():void {
Alert.show('testtest');
}
]]>
</mx:Script>
<mx:HTTPService id="photoService" url="http://api.flickr.com/services/feeds/photos_public.gne" result="resultHandler(event)"/>
<mx:HBox width="362" height="24">
<mx:TextInput id="srchTxtId"/>
<mx:Button label="Search for pics" id="srchBtnId" click="searchFlickr()"/>
</mx:HBox>
<mx:TileList id="imgTileList" dataProvider="{photoFeed}" width="100%" height="100%" itemClick="openPanel(event)">
<mx:itemRenderer>
<mx:Component>
<mx:VBox width="125" height="125"
paddingBottom="5"
paddingLeft="5"
paddingTop="5"
paddingRight="5">
<mx:Image width="75" height="75" source="{data.thumbnail.url}"/>
</mx:VBox>
</mx:Component>
</mx:itemRenderer>
</mx:TileList>
</mx:Application>
panelcomp.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"
showCloseButton="true"
styleName="noPadding"
creationComplete="init();"
close="titleWindow_close(event);">
<mx:Script>
<![CDATA[
import mx.managers.IFocusManagerComponent;
import mx.controls.Alert;
import mx.core.IFlexDisplayObject;
import mx.events.CloseEvent;
import mx.managers.PopUpManager;
[Bindable]
public var source:String;
private function init():void {
PopUpManager.centerPopUp(this);
}
private function titleWindow_close(evt:CloseEvent):void {
PopUpManager.removePopUp(evt.target as IFlexDisplayObject);
}
]]>
</mx:Script>
<mx:Image width="379" height="261" id="imgId" source="{source}"/>
<mx:ControlBar horizontalAlign="right" width="100%">
</mx:ControlBar>
</mx:TitleWindow>
Note put FlickPrj.mxml and panelcomp.mxml in the same directory.

It means that the xml file that was loaded was not written properly , try to open it in IE ( or some xml tool such as altova ) and see whats wrong with it.

Related

How to Push a View Based on a selected Array Collection? (Flash Builder 4.6 , Flex)

I have an application that has an Array Collection of calculator names. Upon selection I would like to push the actual view of the calculator for that item.
Here is my code could someone help me write a function that will allow me to do this ?
<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
title="iCalculate"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
creationComplete="creationCompleted(event)"
width="100%" height="100%">
<s:layout>
<s:VerticalLayout paddingTop="10"/>
</s:layout>
<fx:Script>
<![CDATA[
import com.Watts.collections.filter.Evaluator;
import com.Watts.demo.Album;
import mx.collections.ArrayCollection;
import mx.events.CollectionEvent;
import mx.events.FlexEvent;
import mx.rpc.http.Operation;
import spark.components.Image;
import spark.components.ViewMenu;
import spark.components.gridClasses.GridColumn;
import spark.events.IndexChangeEvent;
import spark.events.TextOperationEvent;
// Everything Below this line holds information specifically relating to Beta 2
// Below this line is the coding for the search bar or filter bar
private var _collection:ArrayCollection;
private var _evaluator:Evaluator = new Evaluator();
private function creationCompleted(event:FlexEvent):void
{
_collection = Album.collection;
_collection.filterFunction = filterCollection;
_evaluator.synonyms["four"] = new ArrayCollection(["4"]);
grid.dataProvider = _collection;
}
private function filterChanged(event:Event):void
{
update();
}
private function update():void
{
_evaluator.prepare(filter.text);
_collection.refresh();
formula.text = (_evaluator.tree) ? _evaluator.tree.toString() : "";
}
private function filterCollection(data:Object):Boolean
{
var labels:ArrayCollection = new ArrayCollection();
for (var i:int; i < grid.columns.length; i++)
{
labels.addItem((grid.columns.getItemAt(i) as GridColumn).itemToLabel(data));
}
return _evaluator.evaluate(labels);
}
]]>
</fx:Script>
<s:VGroup left="5" right="-9" top="5" bottom="5" width="100%" height="100%" textAlign="center">
<s:TextInput id="filter" width="100%" change="filterChanged(event)"/>
<s:DataGrid id="grid" width="100%" height="100%" textAlign="left">
</s:DataGrid>
<s:Label id="formula" />
</s:VGroup>
<s:Label id="lblWattsMessage" click="navigator.pushView(views.CompanyDetail)" color="#1021C7"
fontFamily="_typewriter" fontSize="12" text="Powered by WATTS Professionals"
textAlign="center" verticalAlign="middle"/>
</s:View>
Here is the code that I used to fix this issue. Inside the flex application there is a navigator.pushView component that can be used. The issue I had was that I did not assign view ID's to each of the calculators. This must be done in the ArrayCollection container.
navigator.pushview(ViewID)

Display text with images in flex bar chart axis

I am creating column chart to show friends score statistics in facebook application. My problem is how to display friend names with images in y-axis and their score in x-axis.I cant able to pass any arguments in the method 'setSource' of tag. please see the sample code here. If anybody came to know please give me some idea or samples. Thanks in advance.
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical" width="100%" height="100%">
<mx:Script><![CDATA[
import mx.controls.TextArea;
import mx.controls.Text;`enter code here`
import mx.utils.ObjectUtil;
import mx.controls.Alert;
import mx.collections.ArrayCollection;
import mx.charts.series.items.PlotSeriesItem;
import mx.controls.Label;
import mx.controls.Image;
import mx.containers.HBox;
import mx.charts.series.items.BarSeriesItem;
import mx.charts.chartClasses.Series;
import mx.charts.ChartItem;
[Bindable]
public var frienddetails:ArrayCollection = new ArrayCollection([
{score:"5",Name:"charles",imgSource:"http://graph.facebook.com/10058050960/picture"},
{score:"9",Name:"Martin",imgSource:"http://graph.facebook.com/100231645808/picture"},
{score:"7",Name:"stewart",imgSource:"http://graph.facebook.com/10058050960/picture"}]);
]]>
</mx:Script>
<mx:BarChart id="bar" height="100%"
paddingLeft="15" paddingRight="5"
showDataTips="true" width="847"
dataTipMode="multiple" >
<mx:verticalAxis>
<mx:CategoryAxis id="vAxis" categoryField="Name" dataProvider="{frienddetails}" />
</mx:verticalAxis>
<mx:verticalAxisRenderers>
<mx:AxisRenderer placement="left" axis="{vAxis}" >
<mx:labelRenderer>
<mx:Component>
<mx:HBox width="100%" height="100%" minWidth="120" minHeight="20">
<mx:Image id="axisImage" height="100%" width="25" source="{setSource()}">
<mx:Script><![CDATA[
import mx.collections.ArrayCollection;
import mx.utils.ObjectUtil;
import mx.controls.Alert;
import mx.charts.chartClasses.Series;
import mx.charts.ChartItem;
import mx.charts.series.items.BarSeriesItem;
public function setSource(element : ChartItem, series : Series) : String
{
var data : BarSeriesItem = BarSeriesItem(element);
var imgSrc : String = "";
Alert.show("Check : "+data.item.imgSource);
imgSrc = data.item.imgSource;
return imgSrc;
}
]]></mx:Script>
</mx:Image>
<mx:Label id="axisLabel" fontSize="12" width="100%" height="100%">
<mx:Script><![CDATA[
[Bindable]
override public function set data(value : Object) : void
{
if (value == null)
{
return;
}
axisLabel.text = value.text;
}
]]>
</mx:Script>
</mx:Label>
</mx:HBox>
</mx:Component>
</mx:labelRenderer>
</mx:AxisRenderer>
</mx:verticalAxisRenderers>
<mx:series>
<mx:BarSeries id="bs2" dataProvider="{frienddetails}"
yField="Name" xField="score" displayName="Score" />
</mx:series>
</mx:BarChart>
</mx:Application>
setSource(element : ChartItem, series : Series)
Before we look at anything else, your function expects 2 arguments: [element] and [series]. Neither are specified in the call. Only [element] is referenced in the function.

Problem with showing data in Accordian using an XML file and VBox container

I am using an XML file to populate my Accordian. But I am missing something which is not showing the labels of VBox in the Accordian. I am trying to get the labels from my XML file i.e 'name' of each user should appear on each Vbox in the Accordian.
Can you spot any logical error in following code:
XML file: currentUsers.xml
<currentUsers>
<user>
<name>Tom</name>
<age>34</age>
</user>
<user>
<name>Jerry</name>
<age>99</age>
</user>
</currentUsers>
MXML file:
<fx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;
import mx.collections.ArrayCollection;
[Bindable] private var userArray : ArrayCollection;
private function serviceHandler(event:ResultEvent):void{
userArray = event.result.currentUsers.user;
}
private function send_data():void{
service.send();
}
]]>
</fx:Script>
<fx:Declarations>
<mx:HTTPService id="service" url="currentUsers.xml" result="serviceHandler(event)"/>
</fx:Declarations>
<mx:Accordion includeIn="UserList" x="10" y="10" width="554" height="242">
<mx:Repeater id="rep" dataProvider="{userArray}">
<mx:VBox width="100%" height="100%"
verticalAlign="middle" horizontalAlign="center"
label="{rep.currentItem.user}" >
</mx:VBox>
</mx:Repeater>
</mx:Accordion>
Nevermind. Found the problem.
Label of VBox should have been set to currentItem.name, instead of currentItem.user.
<mx:VBox width="100%" height="100%"
verticalAlign="middle" horizontalAlign="center"
label="{rep.currentItem.name}" >
</mx:VBox>
Thank you all.

Flex ChangeWatcher doesn't work

I'm trying to implement a binding between some custom-built models and just beginning to dabble with the whole mx.binding.* collection. I tried this simple, stripped down example, but can't get the binding working correctly. Can somebody tell me where I'm going wrong?
// Model
package
{
import flash.events.EventDispatcher;
public class Model extends EventDispatcher
{
private var m_count:uint = 0;
[Bindable]
public function get Count():uint
{
return this.m_count;
}
public function set Count(c:uint):void
{
this.m_count = c;
}
}
}
And this is what the application MXML looks like
// MXML
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:core="*" creationComplete="this.init();">
<mx:Script>
<![CDATA[
import flash.events.Event;
import flash.utils.describeType;
import mx.binding.utils.ChangeWatcher;
[Bindable]
public var model:Model;
public function init():void
{
var _this:Object = this;
this.addEventListener(Event.ENTER_FRAME, function(e:Event):void {
_this.model.Count++;
});
this.model = new Model();
trace(ChangeWatcher.canWatch(this.model, "Count")); // This always returns false for some reason
trace(describeType(this.model));
}
public function UpdateText(s:String):void
{
trace(s);
}
]]>
</mx:Script>
<mx:Text text="{this.model.Count}" creationComplete="trace(this);" />
</mx:WindowedApplication>
Update: I tried an even more bare-bones version as shown below.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="this.m_init();">
<mx:Script>
<![CDATA[
import mx.binding.utils.ChangeWatcher;
[Bindable] public var m:Object = new Object();
public function m_init():void
{
trace(ChangeWatcher.canWatch(this, "m"));
}
]]>
</mx:Script>
<mx:Text text="{this.m}" />
</mx:Application>
Still. Doesn't. Work. ChangeWatcher.canWatch still returns false, although the textfield does display [object Object].
public function init():void
{
this.addEventListener(Event.ENTER_FRAME, increment);
this.model = new Model();
}
public function increment(e:Event):void
{
if(this.model)
this.model.Count++;
}
<mx:Text text="{model.Count}" creationComplete="trace(this);" /-->
i can give u one example of changeWatcher, that may be some help, right now i m working with this, it's helpful,
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init();">
<mx:Style source="../assets/css/scaleCSS.css"/>
<mx:Script>
<![CDATA[
import mx.binding.utils.ChangeWatcher;
import mx.controls.Text;
private var text:Text;
[Bindable]private var ti1mc:int=50;
private function init():void
{
ChangeWatcher.watch(ti1,'text',updateTextti);
ChangeWatcher.watch(ti2,'text',updateTextti);
ChangeWatcher.watch(ti3,'text',updateTextti);
ChangeWatcher.watch(ti4,'text',updateTextti);
ChangeWatcher.watch(ti5,'text',updateTextti);
}
private function updateTextti(event:Event):void
{
var str:String;
str=event.currentTarget.id.slice(2,3);
// trace("str : "+str);
// trace(Canvas(textbox.getChildAt(int(TextInput(event.currentTarget).id.slice(2,3))-1)).id);
Text(Canvas(textbox.getChildAt(int(TextInput(event.currentTarget).id.slice(2,3))-1)).getChildAt(0)).text=event.currentTarget.text;
// trace(Text(Canvas(textbox.getChildAt(int(TextInput(event.currentTarget).id.slice(2,3))-1)).getChildAt(0)).id);
// trace(event.currentTarget.id.slice(2,3));
if(Canvas(textbox.getChildAt(int(TextInput(event.currentTarget).id.slice(2,3))-1)).width>=textbox.width)
event.currentTarget.maxChars=event.currentTarget.length;
else
event.currentTarget.maxChars=50;
}
]]>
</mx:Script>
<mx:Canvas width="80%" height="80%" horizontalCenter="0" verticalCenter="0" borderStyle="solid">
<mx:VBox id="textbox" height="300" width="200" borderStyle="solid" top="50" left="100" horizontalScrollPolicy="off" verticalScrollPolicy="off">
<mx:Canvas id="textcan1" borderStyle="solid" borderColor="#FF0000">
<mx:Text id="text1" fontFamily="Arbeka" styleName="text" rotation="20"/>
</mx:Canvas>
<mx:Canvas id="textcan2" borderStyle="solid" borderColor="#FFFF00">
<mx:Text id="text2" fontFamily="Arbeka" styleName="text" rotation="20"/>
</mx:Canvas>
<mx:Canvas id="textcan3" borderStyle="solid" borderColor="#00FF00">
<mx:Text id="text3" fontFamily="Arbeka" styleName="text" rotation="20"/>
</mx:Canvas>
<mx:Canvas id="textcan4" borderStyle="solid" borderColor="#0000FF">
<mx:Text id="text4" fontFamily="Arbeka" styleName="text" rotation="20"/>
</mx:Canvas>
<mx:Canvas id="textcan5" borderStyle="solid" borderColor="#00FFFF">
<mx:Text id="text5" fontFamily="Arbeka" styleName="text" rotation="20"/>
</mx:Canvas>
</mx:VBox>
<mx:VBox id="textinputbox" height="300" width="200" top="50" right="100" borderStyle="solid" verticalGap="0">
<mx:TextInput id="ti1" width="100%" maxChars="50"/>
<mx:TextInput id="ti2" width="100%" maxChars="50"/>
<mx:TextInput id="ti3" width="100%" maxChars="50"/>
<mx:TextInput id="ti4" width="100%" maxChars="50"/>
<mx:TextInput id="ti5" width="100%" maxChars="50"/>
</mx:VBox>
</mx:Canvas>
</mx:Application>
here ti1(textinput) text property is being watched, if there is a change in to the property, then the handler function(updatetextti) will be called
hope this helps
I removed all files inside the obj folder under the project and the problem seems to have gone away. It might have been that FlashDevelop was using older compiled binaries out of this folder, which made the output go out of sync with the source code.
Evidence to support this lies in two things. Changing the SDK did not affect the output on my own computer, which ruled out any SDK-specific issues. So I created a new project in another IDE on the same computer and copy-pasted the code into that one. This time it worked. That's when I thought it might be the cache and went in and deleted it.
In hindsight, I should have renamed it, and later tried to compile with the old cache in place again. That would have been conclusive.

Image as Label with Checkbox in Flex

I want to use an image in my checkbox as label, anybody know how ?
When I tried doing the same thing with a RadioButton a while back, I ended up having to create my own component. This is what I did:
IconRadioButton.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.controls.RadioButtonGroup;
[Bindable]
public var imgLabel:Class;
[Bindable]
public var groupName:RadioButtonGroup;
[Bindable]
public var selected:Boolean;
[Bindable]
public var value:String;
]]>
</mx:Script>
<mx:RadioButton
id="radioBtn"
group="{groupName}"
groupName="{groupName}"
selected="{selected}"
label=""
value="{value}"
visible="{visible}"
includeInLayout="{includeInLayout}" />
<mx:Image source="{imgLabel}" click="{radioBtn.selected = true}" />
</mx:HBox>
Then you could use it like this:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:controls="com.example.controls.*">
<controls:IconRadioButton
groupName="{group}"
imgLabel="{AssetsFactory.getInstance().iconCCVisa}"
value="{CreditCardTypes.VISA}" />
...
Hope that maybe gets you started or gives you some ideas.
To use image as label, use the following code.
<mx:HBox width="100%">
<mx:RadioButton groupName="Yield"/>
<mx:Image source="#Embed('/scripts/btn_highest.png')"/>
</mx:HBox>

Resources