呵呵.先别急.等你知道了这俩个类,就知道了图片移动并不困难了..
第一个是 mx.effects.Move 移动
第二个是 mx.effects.Zoom 缩放
废话不多说.看例子 move例子
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
>
<mx:Script>
<![CDATA[
//移动
import mx.effects.Move;
private function moveTest1():void
{
var move:Move = new Move();
move.target = myImage;
move.duration = 2000;
//指定x
move.xTo = 230;
//指定y
move.yTo = 0;
//移动
move.play();
}
]]>
</mx:Script>
<mx:Panel id="myPanel" width="90%" height="90%" title="移动示例:点击图片">
<mx:Image id="myImage" source="assets/1.jpg" click="moveTest1()"/>
</mx:Panel>
</mx:Application>
zoom 例子
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
>
<mx:Script>
<![CDATA[
//变大变小
import mx.effects.Zoom;
private function zoomTest():void
{
var zoom:Zoom = new Zoom();
//指定目标
zoom.target = myImage;
//过程耗时
//zoom.duration = 2000;
//目标增加高度倍数
zoom.zoomHeightTo = 1.5;
//目标增加宽度倍数
zoom.zoomWidthTo = 1.5;
//开始
zoom.play();
}
]]>
</mx:Script>
<mx:Panel id="myPanel" width="90%" height="90%" title="移动示例:点击图片">
<mx:Image id="myImage" source="assets/1.jpg" click="zoomTest()"/>
</mx:Panel>
</mx:Application>
如果你试了试这俩个例子..心里应该有普了.
我写的很垃圾..- -# 毕竟只看了俩三天..- -#
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute" width="740" height="270"
creationComplete="getImage.send()"
horizontalScrollPolicy="off"
verticalScrollPolicy="off">
<mx:Script>
<![CDATA[
import flash.events.MouseEvent;
import flash.net.URLRequest;
import flash.net.navigateToURL;
import mx.collections.ArrayCollection;
import mx.containers.VBox;
import mx.controls.Image;
import mx.controls.Label;
import mx.core.Container;
import mx.effects.Move;
import mx.effects.Zoom;
import flash.utils.Timer;
import mx.rpc.events.ResultEvent;
//计时器
private var timer:Timer;
//存放xml
private var imageResource:ArrayCollection = new ArrayCollection();
//存放当前中间图片的下标
private var index:Number = 0;
//声明6个图画
private var urls:ArrayCollection = new ArrayCollection();
public var vboxes:ArrayCollection = new ArrayCollection();
private var vb:VBox = new VBox();
private function fromImage(event:ResultEvent):void
{
imageResource = event.result.images.image;
init();
goLayout();
timer = new Timer(3000);
timer.addEventListener(TimerEvent.TIMER,doTimer);
timer.start();
}
private function init():void
{
for(var i:uint=0;i<imageResource.length;i++)
{
//连接
var url:String = imageResource.getItemAt(i).url;
//id
var id:String = imageResource.getItemAt(i).id;
//vbox
var vbox:VBox = new VBox();
//图画
var image:Image = new Image();
image.buttonMode = true;
image.id = id;
image.source = imageResource.getItemAt(i).src;
image.height = 120;
//标题
var title:Label = new Label();
title.id = "t"+id;
title.buttonMode = true;
title.text = imageResource.getItemAt(i).title;
//描述
var descript:Label = new Label();
descript.id = "d"+id;
descript.buttonMode = true;
descript.text = imageResource.getItemAt(i).descript;
//添加单击事件
image.addEventListener(MouseEvent.CLICK,doClick);
image.addEventListener(MouseEvent.MOUSE_OVER,doOver);
image.addEventListener(MouseEvent.MOUSE_OUT,doOut);
title.addEventListener(MouseEvent.CLICK,doClick);
descript.addEventListener(MouseEvent.CLICK,doClick);
//添加
urls.addItem(url);
vbox.addChild(image);
var vbox2:VBox = new VBox();
vbox2.addChild(title);
vbox2.addChild(descript);
vbox.addChild(vbox2);
vboxes.addItem(vbox);
}
}
//鼠标悬浮事件
private function doOver(event:MouseEvent):void
{
var image:Image = event.currentTarget as Image;
//第一个是颜色, 第二个不知道,第三个左右背光的宽度,第四个是上下背光,第五个是背光颜色的深度,最后一个数字好像是溢出
image.filters=[new GlowFilter(0xffffff,0.8,10,10,2,10,false,false)];
}
private function doOut(event:MouseEvent):void
{
var image:Image = event.currentTarget as Image;
image.filters=[new GlowFilter(0xcccccc,0.8,4,4,1,3,false,false)];
}
//图片单击事件
private function doClick(event:MouseEvent):void
{
var id:uint;
if(event.currentTarget is Image)
id = uint(event.currentTarget.id);
else
id = uint(event.currentTarget.id.substring(1))
var url:String = urls.getItemAt(id).toString();
navigateToURL(new URLRequest(url), '_blank');
}
//布局
private function goLayout():void
{
setVbox(vboxes[vboxes.length-2],0,0,-10,154);
setVbox(vboxes[vboxes.length-1],1,1,109,71);
setVbox(vboxes[0],1.5,1.3,317,10);
setVbox(vboxes[1],1,1,543,71);
setVbox(vboxes[2],0,0,750,154);
}
private function setVbox(vbox:VBox,zoomH:Number,zoomW:Number,xT:Number,yT:Number):void
{
addChild(vbox);
var image:Image = vbox.getChildAt(0) as Image;
//放大
var zoom:Zoom = new Zoom();
var other:Zoom = new Zoom();
//行动的时间
zoom.duration = 1000;
other.duration = 1000;
if(zoomW == 0 && zoomH == 0)
{
zoom.target = vbox;
other.target = image;
}
else
{
zoom.target = image;
other.target = vbox;
}
//指定放大倍数
zoom.zoomHeightTo = zoomH;
zoom.zoomWidthTo = zoomW;
other.zoomHeightTo = 1;
other.zoomWidthTo = 1;
//移动
var move:Move = new Move();
move.duration = 1000;
move.target = vbox;
//指定移动到哪个位置
move.xTo = xT;
move.yTo = yT;
//移动 放大
move.play();
zoom.play();
other.play();
}
private function doTimer(event:TimerEvent):void
{
nextImage();
}
//下一张
private function nextImage():void
{
timer.stop();
timer.start();
index += 1;
setVbox(vboxes[vboxes.length-2],0,0,750,154);
setVbox(vboxes[vboxes.length-1],0,0,0,154);
setVbox(vboxes[0],1,1,119,71);
setVbox(vboxes[1],1.7,1.5,317,10);
setVbox(vboxes[2],1,1,533,71);
//转换
vb = vboxes[vboxes.length-2];
vboxes[vboxes.length-2] = vboxes[vboxes.length-1];
vboxes[vboxes.length-1] = vboxes[0];
vboxes[0] = vboxes[1];
vboxes[1] = vboxes[2];
vboxes[2] = vb;
if(index > imageResource.length - 1)
{
index = 0;
}
var r:Number = index+2;
//验证索引
if(r > imageResource.length - 1)
{
r = 0;
if(index == imageResource.length -1)
r = 1
}
var image:Image = vboxes[2].getChildAt(0) as Image;
image.source = imageResource.getItemAt(r).src;
}
private function backImage():void
{
timer.stop();
timer.start();
index -= 1;
setVbox(vboxes[vboxes.length-2],1,1,119,71);
setVbox(vboxes[vboxes.length-1],1.7,1.5,317,10);
setVbox(vboxes[0],1,1,533,71);
setVbox(vboxes[1],0,0,750,154);
vboxes[2].alpha = 0;
setVbox(vboxes[2],0,0,0,154);
vboxes[2].alpha = 100;
vb = vboxes[2];
vboxes[2] = vboxes[1];
vboxes[1] = vboxes[0];
vboxes[0] = vboxes[vboxes.length-1];
vboxes[vboxes.length-1] = vboxes[vboxes.length-2];
vboxes[vboxes.length-2] = vb;
if(index < 0)
{
index = imageResource.length-1;
}
var l:Number = index - 2;
if(l < 0)
{
l = imageResource.length - 1;
if(index == 0)
l=imageResource.length - 2;
}
var image:Image = vboxes[vboxes.length-2].getChildAt(0) as Image;
image.source = imageResource.getItemAt(l).src;
}
]]>
</mx:Script>
<mx:HTTPService id="getImage"
url="../../flash/image.xml"
result="fromImage(event)"/>
<mx:Button x="26" label="←"
verticalCenter="0"
click="backImage()"/>
<mx:Button x="666" label="→"
click="nextImage()" verticalCenter="0"/>
</mx:Application>
其中的 HTTPService id 就是一名字, url 是指向谁发送一个请求. result是当请求得到响应时调用哪个函数.
<mx:HTTPService id="getImage" url="image.xml" result="fromImage(event)"/>
在开头的application 中, creationComplete的值 是当自己部署完毕时的动作. 换句话说,就是当<application>这个标签执行完的时候,就会执行creationComplete的值. 在这里 它的值getImage.send() 就是发送请求~好好看看 getImage是谁呢.~~就是在上边声明的 HTTPService的id.
horizontalScorollPolicy = "off" 是让横向滚动条禁用
verticalScrollPolicy = "off" 纵向滚动条禁用.
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="740" height="270" creationComplete="getImage.send()" horizontalScrollPolicy="off" verticalScrollPolicy="off">
这里的 event.result.images.image.
event.result 可以得到请求的整个xml文档.
images,和image都是xml文档里的标签. xml文档代码在下边
看得出,imageResource 得到是image的数组.~~
Timer 的用法.- -# 我能不能另写一个帖子..其实我也是在javaeye上看人家才写出来的..就是一时间器.定时调用.
private function fromImage(event:ResultEvent):void
{
imageResource = event.result.images.image;
init();
goLayout();
timer = new Timer(3000);
timer.addEventListener(TimerEvent.TIMER,doTimer);
timer.start();
}
image.xml文档代码
<?xml version="1.0" encoding="UTF-8"?> <images> <image id="0" src="assets/1.jpg" title="勇敢者" descript="还是波波" url="http://www.1.com"/> <image id="1" src="assets/2.jpg" title="冰河世纪" descript="波~波~" url="http://www.2.com"/> <image id="2" src="assets/3.jpg" title="异煞" descript="路径波" url="http://www.3.com"/> <image id="3" src="assets/4.jpg" title="天衣无缝" descript="路径波" url="http://www.4.com"/> <image id="4" src="assets/5.jpg" title="反反复复" descript="路径波" url="http://www.5.com"/> <image id="5" src="assets/6.jpg" title="生生世世" descript="路径波" url="http://www.6.com"/> </images>
127
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
