编写Flex阅读器 （三） ---------------------一个纠结的问题

我承认，我是个浮躁的人。昨天送走了妈妈，然后又开始坐下来学习。可是，还是发现进度太慢了。而且自己觉得有了JavaScript和HTML的基础，可能Flex+ActionScript 上我可以少花些功夫。急于求成的召唤，让我开始了直接看源码。

E4X的源码，看着是比较纠结。再到后来，干脆直接开始写编辑器。一弄弄到今天凌晨1点，没办法，睡神开始召唤了，所以倒下就睡了。废话不说了， 先上图吧！





写之前，我看了网上的动态加载，讲的头大，后来看到了Flex中如何利用睡醒空间（Tree Control)和SWFLoader空间创建简单图片相册例子觉得非常好，就仿写了一个（在链接中有源码）。果然我本来使用icon图片，结果不能正常的显示，最后换成了jpg的图片。正常显示。





这是我将图片换成了SWF文档（使用pdf2swf转化的）后的效果。

在写这个的过程中，发现要在Flex中使用树，实在是太简单了

<

mx:XML

id

="myXML"

source

="source/tree.xml"

/>

<

mx:Tree

dataprovider

="

{myXML}

"

/>

就这样，一个树就生成了。我也在网上查看了树的一些资料。大呼好东西啊。

通过这个代码的仿写后，接着，我就开始了我的阅读器的编写。

在编写之前还有一个问题一直困扰着我，那就是动态的加载Controller。虽然是个看似简单的问题，我还真琢磨了很久。最后也是在上面的哪个程序的基础上，我开始了测试。动态添加

SWFLoader。通过直接的

var loader:mx.controller.SWFLoader = new mx.controller.SWFLoader();
loader.id = 'loader_' + 1;
swf_content.addChild(loader);

这一段代码完成了动态生成swfloader，并添加到了指定位置，然后可以对loader进行文件的源控制。实现动态加载。

为了滚动条不会因为动态加载内容而跳动，所以，我在每一个生成的swfloader的尺寸定下来，并按照前一个的尺寸计算。这样即使动态的加载还是不会让滚动条跳动。

<?

xml version="1.0" encoding="utf-8"

?>

<

mx:Application

xmlns:mx

="http://www.adobe.com/2006/mxml"

layout

="absolute"

creationComplete

="init()"

>

<

mx:Script

>

<![CDATA[

import mx.controls.scrollClasses.ScrollBar;
import mx.events.ScrollEvent;
import mx.controls.SWFLoader;
import mx.controls.Alert;

private var pathes:Array =  ["source/swf/1.swf","source/swf/2.swf","source/swf/3.swf","source/swf/4.swf","source/swf/5.swf",];
private var ySize:Number = 800;
private var last_page:Number = 3;
private var page_count:Number =pathes.length;

private function init():void
{
for(var i:Number = 0;i< pathes.length;i++)
{
var swf_loader:SWFLoader = new SWFLoader();
swf_loader.id = 'swf_content_' + (i+1);
swf_loader.name = 'swf_content_' + (i+1);
if(i < last_page)
{
swf_loader.source =  pathes[i];
}
swf_loader.height = ySize;
swf_loader.width = 600;
swf_loader.addEventListener(Event.COMPLETE,complete);
swf_context.addChild(swf_loader);
}
swf_context.status = swf_context.childDescriptors.length.toString();
}

private function complete():void
{
swf_context.status = swf_context.childDescriptors.length.toString();
}

private function dymic_load(e:ScrollEvent):void
{
main_panel.status = e.position.toString();
var vertical_y:Number = e.position;
var current_view_page:Number = (vertical_y - vertical_y % ySize)/ySize;
main_panel.status = (current_view_page + 1).toString();

if ((current_view_page + 1) > (last_page -2) && last_page <= page_count)
{
last_page ++;
Alert('d');
//var swf:SWFLoader = getChildByName('swf_content_' + last_page) as SWFLoader;
//swf.source = pathes[last_page-1];

}
}

]]>

</

mx:Script

>

<

mx:Panel

id

="main_panel"

width

="650"

height

="730"

backgroundColor

="#FFFFFF"

layout

="vertical"

verticalScrollPolicy

="off"

horizontalScrollPolicy

="off"

horizontalAlign

="center"

>

<

mx:Panel

id

="swf_context"

left

="5"

right

="5"

height

="700"

width

="640"

backgroundColor

="#F0F0F0"

layout

="vertical"

horizontalAlign

="center"

scroll

="dymic_load(event)"

>

</

mx:Panel

>

</

mx:Panel

>

</

mx:Application

>

刚开始的滚动条，一直附着在main_panel内，后来对main_panel添加了 verticalScrollPolicy="off" horizontalScrollPolicy="off" 后 完美解决。

文档的加载可能还有好的方法，请赐教。我继续学习了。晚上或者明天再继续写。