我在从API获取数据到我的项目渲染器时遇到了麻烦。应用程序只需要使用api搜索电影，然后使用项目渲染器显示搜索结果。
与API的连接总是有效的，因为我在flash构建器中查看我的网络选项卡，并看到数据进来。此外，项目渲染显示字段的正确数量(例如:如果我搜索一个电影，得到4个结果返回，它显示4个白框从项目渲染器)，但它不会显示数据。我想让它显示标题
主MXML文件
<?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" minWidth="955" minHeight="600"
creationComplete="application1_creationCompleteHandler(event)">
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.controls.Button;
import mx.events.FlexEvent;
import mx.rpc.events.ResultEvent;
import mx.rpc.http.HTTPService;
import classes.MovieSearch;
import classes.Movie;
public var http:HTTPService = new HTTPService();
[Bindable]public var acMovies:ArrayCollection = new ArrayCollection();
protected function application1_creationCompleteHandler(event:FlexEvent):void
{
txtSearch.addEventListener(FlexEvent.ENTER, search);
}
protected function search(event:Event):void
{
if(txtSearch.text == "")
{
//var top100:Itunes = new Itunes();
//top100songs.dataProvider = top100.getSongs();
}
else
{
var movieSearch:MovieSearch = new MovieSearch(txtSearch.text);
movieResults.dataProvider = movieSearch.search();
//lblFullTitle.text = "Search results for: " + txtSearch.text;
}
}
]]>
</fx:Script>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<s:VGroup width="1090" height="90%" gap="30" paddingTop="30">
<s:HGroup width="100%" height="35" gap="60" horizontalAlign="right" verticalAlign="middle">
<s:HGroup width="100%" height="35" gap="20" horizontalAlign="left" verticalAlign="middle">
</s:HGroup>
<s:TextInput id="txtSearch" x="635" y="3" width="225" height="25" text="Search...">
<s:filters>
<s:DropShadowFilter distance="0" blurX="8" blurY="8" angle="310" alpha="0.75"/>
</s:filters>
</s:TextInput>
</s:HGroup>
<s:Group width="100%">
<s:DataGroup id="movieResults" itemRenderer="customComponents.MovieRenderer" width="100%" contentBackgroundColor="#ffffff">
<s:layout>
<s:TileLayout horizontalGap="60" verticalGap="30" requestedColumnCount="5" />
</s:layout>
</s:DataGroup>
</s:Group>
</s:VGroup>
</s:Application>
当前简单的影片类
package classes
{
public class Movie extends Object
{
public var title:String;
public function Movie(title:String)
{
this.title = title;
}
}
}
movieSearch类
package classes
{
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
import mx.rpc.http.HTTPService;
public class MovieSearch extends Object
{
private var url:String;
private var result:ArrayCollection;
public function MovieSearch(keywords:String)
{
result = new ArrayCollection();
url = "http://api.themoviedb.org/3/search/movie?api_key=7f182385c9030e466efebf258c9a5f37&query="+ keywords;
var request:HTTPService = new HTTPService();
request.url = url;
request.showBusyCursor = true;
request.addEventListener(ResultEvent.RESULT, setInfo);
request.send();
}
public function setInfo(ev:ResultEvent):void{
var json_result:Object = JSON.parse(ev.result.toString());
json_result.results.splice(0, 1);
for each (var results:Object in json_result.results){
var newMovie:Movie = new Movie(results.original_titel);
result.addItem(newMovie);
}
}
private function strReplace(str:String, search:String, replace:String):String {
return str.split(search).join(replace);
}
public function search():ArrayCollection {
return this.result;
}
}
}
和最后一个项目渲染器，(注意:我在代码末尾的标签处得到一个警告:Databinding不能检测到对title的分配)
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
dataChange="validateNow();"
creationComplete="itemrenderer1_creationCompleteHandler(event)"
autoDrawBackground="false">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Declarations>
</fx:Declarations>
<fx:Script>
<![CDATA[
import classes.Movie;
import mx.events.FlexEvent;
[Bindable]
public var movieData:Movie;
protected function itemrenderer1_creationCompleteHandler(event:FlexEvent):void
{
// TODO Auto-generated method stub
movieData = data as Movie;
//lbl_more.addEventListener(MouseEvent.CLICK, parentDocument.moreInfo(songData));
}
]]>
</fx:Script>
<s:states>
<s:State name="normal"/>
<s:State name="hovered"/>
</s:states>
<s:BorderContainer styleName="bc_song" width="170">
<s:layout>
<s:VerticalLayout gap="12" horizontalAlign="center" verticalAlign="middle"/>
</s:layout>
<s:Group>
<s:filters>
<s:DropShadowFilter distance="0" blurX="8" blurY="8" angle="310" alpha="0.75"/>
</s:filters>
<!--<s:Image width="170" height="170" x="-4" y="-4" source="{movieData.image}"/>-->
</s:Group>
<s:Label width="170" text="{movieData.title}"/>
</s:BorderContainer>
</s:ItemRenderer>
提前感谢您查看我的问题!
这可能是数据绑定工作的问题。
'[Bindable]'，当应用于非原语对象时，将使绑定在应用绑定时应用于该对象，当引用更改时绑定不会移动。所以:
[Bindable]
public var movieData:Movie;//this creates a null or undefined object,
//anything binding to this will be stuck
//referencing this null object
protected function itemrenderer1_creationCompleteHandler(event:FlexEvent):void
{
movieData = data as Movie;//once this line is applied, any future binds
//will link to this but all the UI object are
//already bound to the old one
parentDocument.moreInfo(songData));
}
解决方法是使用[Bindable] get/set functions。
,
private var _movieData:Movie;
[Bindable]
public function get movieData():Movie
{
return _movieData;
}
public function set movieData(value:Movie):void
{
_movieData = value;
}