MXML是一个可以让你在AdobeFlex中布局用户界面组件的一种XML语言,你也可以使用MXML声明来定义程序中的非可视化组件,安装好FLEXDevelopment后,你就可以轻松的结合PHP完成一个FLASH曲线图.
先从PHP入手:
FLEX和PHP的交互最常用的就是和XML的交互,就是用PHP生成XML,然后用FLEX去读取并且显示,我们以XML的形式先写一个帐目详单的数据,代码如下:
header("Content-Type:text/xml");
$arr=array(
array('day'=>'01','sum'=>'153.1'),
array('day'=>'02','sum'=>'882.86'),
array('day'=>'03','sum'=>'456.9'),
array('day'=>'04','sum'=>'717.7'),
array('day'=>'05','sum'=>'255.1'),
array('day'=>'06','sum'=>'533.1')
);
$xml_return.="<bills>";
foreach($arras$use){
$xml_return.="<bill><sum>{$use['sum']}</sum><name>{$use['day']}</name></bill>";
}//开源代码phpfensi.com
$xml_return.="</bills>";
echo$xml_return;
显示6个月的消费记录,$arr也可以是从数据库读出来的数据,这里只是作为一个例子,所以直接给一个数组赋值.
-<bills>
-<bill>
<sum>153.1</sum>
<name>01</name>
</bill>
-<bill>
<sum>882.86</sum>
<name>02</name>
</bill>
-<bill>
<sum>456.9</sum>
<name>03</name>
</bill>
-<bill>
<sum>717.7</sum>
<name>04</name>
</bill>
-<bill>
<sum>255.1</sum>
<name>05</name>
</bill>
-<bill>
<sum>533.1</sum>
<name>06</name>
</bill>
</bills>
Php部分就完成了,接下来是写MXML,实例代码如下:
<?xmlversion="1.0"encoding="utf-8"?>
<?xmlversion="1.0"encoding="utf-8"?>
<mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="absolute"creationComplete="getaccount()">
<mx:HTTPServiceid="listRequest"url=""useProxy="false"method="POST">
<mx:requestxmlns=""></mx:request>
</mx:HTTPService>
<mx:Script><![CDATA[
importmx.rpc.events.ResultEvent;//引用ResultEvent类
publicfunctiongetaccount():void{
listRequest.url='http://localhost/arr.php';
listRequest.send();
}
]]></mx:Script>
<mx:LineChartshowDataTips="true"clipContent="false"x="126"y="10"id="tongjitu"dataProvider="{listRequest.lastResult.bills.bill}"width="678">
<mx:horizontalAxis>
<mx:CategoryAxisdataProvider="{listRequest.lastResult.bills.bill}"categoryField="name"title="(日)"/>
</mx:horizontalAxis>
<mx:series>
<mx:LineSeriesdisplayName="每日消费"yField="sum"xField="name"/>
</mx:series>
</mx:LineChart>
</mx:Application>
逐一解释一下:
Application//MXML应用程序开头
creationComplete="getaccount()"//代表页面加载完成后执行getaccount函数
〈mx:HTTPServiceid="listRequest"url=""useProxy="false"method="POST"〉
〈mx:requestxmlns=""〉〈/mx:request〉
〈/mx:HTTPService〉
//则是一个HTTP的请求,发送POST到一个PHP文件去获取数据
mx:Script//MXML里面的脚本都用<mx:Script>包含进去
下面分析下getaccount函数:
publicfunctiongetaccount():void{
listRequest.url='http://localhost/arr.php';
listRequest.send();
}
//列出了HTTPService请求地址是http://localhost/arr.php
//你同样也可以写成相对路径比如listRequest.url='./arr.php';
mx:LineChart//是一个曲线组件,我们可以直接拿来使用
dataProvider:数据源:listRequest.lastResult.bills.bill
bills.bill是XML里面的标签
mx:LineSeriesdisplayName="每日消费"yField="sum"xField="name"
//则定义了横纵坐标的值。
//Sumname就是XML里面的数据的标签
|