flex 开发卡片模板处理(三)

<?xml version="1.0" encoding="utf-8"?>

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"

width="500"

height="100%"

borderStyle="solid"

borderThickness="2"

borderColor="#757B7F"

xmlns:common="common.*"

fontWeight="normal"

backgroundColor="#FFFFFF">

<mx:Script>

<![CDATA[

import mx.containers.HBox;

import code.ProductHandlerBasic;

import mx.events.ItemClickEvent;

import mx.core.Container;

import mx.controls.Image;

import flash.events.* ;

//模板显示列表数据，存放在xml当中，单击主题时。分析此数据

private var mbdata:XML = <wdxc></wdxc> ;

/*型号:明星片，长贺卡，两折卡，折叠卡*/

private var _type :String ;

/*主题:综合，儿童卡，生日卡，情侣卡...*/

private var _subject:String;

private var _subjectObj:XMLList ;

private var _productHandlerBase:ProductHandlerBasic ;

/**

* 创建主题列表

*/

public function createSubjecthbox():void{

for(var i:int=0;i<_subjectObj.length();i++){

var v:HBox = new HBox() ;

v.name = _subjectObj[i].@subjectname ;

v.label =_subjectObj[i].@label ;

this.viewstack1.addChild(v) ;

}

}

/**用户进入操作页面之前选择的模板*/

public function set type(t:String):void{

this._type = t ;

}

public function get type():String{

return this._type ;

}

public function set subject(s:String):void{

this._subject = s ;

}

public function get subject():String{

return this._subject ;

}

/**

* 创建模板显示视图

*/

public function initModuleviewUI():void{

_subjectObj = _productHandlerBase.mbClass;

//创建模板图片数据

this.createPhotoUrlToXml(_subjectObj) ;

/*创建模板分类组件*/

this.createSubjecthbox() ;

this.viewstack1.selectedChild.name = _subjectObj[0].@subjectname ;

/*要加上callLater，否则ie下滚动条有问题*/

this.callLater(subjectClickHandler);

}

public function set productHandlerBase(p:ProductHandlerBasic):void{

_productHandlerBase = p ;

}

public function get productHandlerBase():ProductHandlerBasic{

return this._productHandlerBase ;

}

/**

* 每个主题下面有很多张图片，图片地址有,型号及主题组成。

* 图片张数存放数组中，循环而可得到xml形式的图片地址。

* @param arr:主题名称数组,及个数

* @param t :型号。(明星片,长贺卡)

* 生成格式如下:

* <wdxc>

* <subject name="zonghe">

* <url>/images/product/newcard/pagemb/postcard/zonghe/zonghe01.jpg</url>

* <url>/images/product/newcard/pagemb/postcard/zonghe/zonghe01.jpg</url>

* </subject>

* </wdxc>

**/

private function createPhotoUrlToXml(arr:XMLList):void{

var t:String =_productHandlerBase.typename ;

for(var j:int=0;j<arr.length();j++){

var t1:String =null ;

var subjectNode:XML = <subject name={arr[j].@subjectname}></subject> ;

for(var i:int=1;i<=arr[j].@number;i++){

t1=(i<10)?("0"+i+".jpg"):i+".jpg";

var picurlNode:XML =<url>/images/product/newcard/operatemb/{t}/{arr[j].@subjectname}/{arr[j].@subjectname}{t1}</url> ;

subjectNode.appendChild(picurlNode);

}

mbdata.appendChild(subjectNode) ;

}

}

/********************单击版式，更换版式*/

// private function bsClickHandler(e:MouseEvent):void {

//

// var ig:Image = Image(e.currentTarget) ;

// var _url :String = ig.source.toString() ;

// _url = _url.replace(".jpg",".gif") ;

// }

/**

* 单击模板图片。用户更换模板，把该图片加载到编辑台上面。*/

private function photoClickHandler(e:MouseEvent):void{

var ig:Image = Image(e.currentTarget) ;

var _url :String = ig.source.toString() ;

_url = _url.replace(".jpg",".gif") ;

this._productHandlerBase.moduleChange(_url);

}

private function subjectClickHandler():void{

var subjectname:String = viewstack1.selectedChild.name;

// this.t1.text= subjectname;

var hbox:HBox = HBox(viewstack1.getChildByName(subjectname));

if(hbox.numChildren!=0){

return ;

}

hbox.removeAllChildren() ;

//得到当前主题所对应的图片地址.

var subjectxmllist:XMLList = mbdata.subject.(@name==subjectname).url ;

//this.t1.text= this.t1.text+"werwrwrwe"+ mbdata.subject.(@name==subjectname).url.toXMLString();

for(var j:int=0;j<subjectxmllist.length();j++){

var img:Image = new Image() ;

img.buttonMode = true ;

img.useHandCursor = true ;

img.source =subjectxmllist[j];

//this.t1.text=this.t1.text+img.source ;

img.addEventListener(MouseEvent.CLICK,photoClickHandler) ;

hbox.addChild(img) ;

}

}

]]>

</mx:Script>

<mx:ViewStack x="10" y="35" id="viewstack1" fontWeight="normal" width="100%" height="100%">

</mx:ViewStack>

<mx:LinkBar itemClick="subjectClickHandler();" dataProvider="viewstack1" fontFamily="Arial" fontSize="12" backgroundColor="#FFFFFF" width="100%" fontWeight="normal" fontStyle="normal" textDecoration="underline" color="#1A75E0"/>

<!--

<mx:TextArea id="t1" x="336" y="5"/>

-->

</mx:Canvas>