`
01jiangwei01
  • 浏览: 541793 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

flex 图片翻转

阅读更多
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="732" height="110" backgroundColor="#ffffff">
<mx:Style>
.leftButtonStyle{
/*overSkin:Embed("/images/newpapcr_leftOn.jpg");
upSkin:Embed("/images/newpapcr_left.jpg");
downSkin:Embed("/images/newpapcr_leftClick.jpg");
*/}
.rightButtonStyle{
/*overSkin:Embed("/images/newpapcr_rightOn.jpg");
upSkin:Embed("/images/newpapcr_right.jpg");
downSkin:Embed("/images/newpapcr_rightClick.jpg");
*/}

</mx:Style>
<mx:Script>
<![CDATA[
import mx.effects.Glow;
import mx.events.EffectEvent;
import mx.effects.Move;
// import mx.controls.Alert;
private var state:Boolean = true;
private function getFunLeft():void{
if(state){

state = false;
var tright:Tile = new Tile();
c.addChild(tright);
tright.x=632;
tright.y=0;
tright.width=632;
tright.height=90;
tright.direction="horizontal";
var img1 :Image = new Image();
img1.source="image/1.jpg";
img1.height=90;
img1.width=120;

var img2 :Image = new Image();
img2.source="image/2.jpg";
img2.height=90;
img2.width=120;

var img3 :Image = new Image();
img3.source="image/3.jpg";
img3.height=90;
img3.width=120;

var img4 :Image = new Image();
img4.source="image/4.jpg";
img4.height=90;
img4.width=120;

var img5 :Image = new Image();
img5.source="image/1.jpg";
img5.height=90;
img5.width=120;

img1.addEventListener(MouseEvent.MOUSE_OVER,imagePlay);
img2.addEventListener(MouseEvent.MOUSE_OVER,imagePlay);
img3.addEventListener(MouseEvent.MOUSE_OVER,imagePlay);
img4.addEventListener(MouseEvent.MOUSE_OVER,imagePlay);
img5.addEventListener(MouseEvent.MOUSE_OVER,imagePlay);

tright.addChild(img1);
tright.addChild(img2);
tright.addChild(img3);
tright.addChild(img4);
tright.addChild(img5);

var m1 :Move = new Move();
m1.xFrom = 632;
m1.xTo = 0;
m1.target = tright;


var t2:Tile = Tile(c.getChildAt(0));
var m2 :Move = new Move();
m2.xFrom = 0;
m2.xTo = -632;
m2.target = t2;

m2.addEventListener(EffectEvent.EFFECT_END,function():void{c.removeChild(t2);state = true;});
m2.addEventListener(EffectEvent.EFFECT_START,function():void{m1.play();});

m2.play();

}
}


private function getFunRight():void{
if(state){
state = false;
var tleft:Tile = new Tile();
c.addChildAt(tleft,0);
tleft.x=-632;
tleft.y=0;
tleft.width=632;
tleft.height=90;
tleft.direction="horizontal";
var img11 :Image = new Image();
img11.source="image/1.jpg";
img11.height=90;
img11.width=120;
var img12 :Image = new Image();
img12.source="image/2.jpg";
img12.height=90;
img12.width=120;
var img13 :Image = new Image();
img13.source="image/3.jpg";
img13.height=90;
img13.width=120;
var img14 :Image = new Image();
img14.source="image/4.jpg";
img14.height=90;
img14.width=120;
var img15 :Image = new Image();
img15.source="image/1.jpg";
img15.height=90;
img15.width=120;

img11.addEventListener(MouseEvent.MOUSE_OVER,imagePlay);
img12.addEventListener(MouseEvent.MOUSE_OVER,imagePlay);
img13.addEventListener(MouseEvent.MOUSE_OVER,imagePlay);
img14.addEventListener(MouseEvent.MOUSE_OVER,imagePlay);
img15.addEventListener(MouseEvent.MOUSE_OVER,imagePlay);


tleft.addChild(img11);
tleft.addChild(img12);
tleft.addChild(img13);
tleft.addChild(img14);
tleft.addChild(img15);

var m11 :Move = new Move();
m11.xFrom = -632;
m11.xTo = 0;
m11.target = tleft;


var t12:Tile = Tile(c.getChildAt(1));
var m12 :Move = new Move();
m12.xFrom = 0;
m12.xTo = 632;
m12.target = t12;

m12.addEventListener(EffectEvent.EFFECT_END,function():void{c.removeChild(t12);state = true;});
m12.addEventListener(EffectEvent.EFFECT_START,function():void{m11.play();});

m12.play();
}
}

private function imagePlay(evt:MouseEvent):void{
var g:Glow = new Glow();
var array:Array = new Array(evt.target);
//Alert.show(array.length+"");
if(array.length>0){
g.target = array[0];
g.duration=2000;
g.play();
}
}

]]>
</mx:Script>
<mx:Glow id="hitHight" duration="2000" />
<mx:Button x="0" y="0" label="Button" height="110" width="25" click="getFunLeft();" styleName="leftButtonStyle"/>
<mx:Button x="707" y="0" label="Button" height="110" width="25" click="getFunRight();" styleName="rightButtonStyle"/>
<mx:Canvas id="c" x="50" y="10" width="632" height="90" horizontalScrollPolicy="off" verticalScrollPolicy="off">
<mx:Tile x="0" y="0" width="632" height="90" id="tile2" direction="horizontal" > 
<mx:Image source="image/1.jpg" id="pic2"   height="90" width="120" rollOverEffect="hitHight"/>
<mx:Image source="image/2.jpg" id="pic1"   height="90" width="120" rollOverEffect="hitHight"/>
<mx:Image source="image/3.jpg" id="pic3"   height="90" width="120" rollOverEffect="hitHight"/>
<mx:Image source="image/4.jpg" id="pic4"   height="90" width="120" rollOverEffect="hitHight"/>
<mx:Image source="image/1.jpg" id="pic5"   height="90" width="120" rollOverEffect="hitHight"/>
</mx:Tile> 
</mx:Canvas>
</mx:Application>

分享到:
评论

相关推荐

    Flex 图片旋转 缩放 拖动 特效

    在Flex开发中,图片的旋转、缩放和拖动功能是常见的交互效果,尤其是在构建富互联网应用程序(RIA)时。Flex作为一个基于ActionScript 3.0的开源框架,提供了强大的图形处理和用户交互能力,使得实现这些特效成为...

    flex 图片自动旋转移动放大

    根据给定的标题和描述,我们将重点讨论如何使用Flex来实现图片的自动旋转、移动和放大功能。 首先,我们要理解Flex中的基本组件。`MXML`是Flex的主要标记语言,它与HTML类似,用于定义用户界面的布局和组件。在给定...

    flex图片旋转

    简单的图片旋转功能 详细的代码 图片按顺时针自动旋转

    flex实现旋转效果

    在本文中,我们将深入探讨如何使用Flex来实现一个图片旋转效果,这在产品展示或交互式界面设计中非常常见。Flex是一种强大的、基于XML的框架,用于构建富互联网应用程序(RIA),尤其适用于创建动态、响应式的用户...

    flex 两个图片播放小程序

    在这个“flex 两个图片播放小程序”项目中,我们可以看到它被用来创建一个图片浏览应用,支持图片的放大和缩小功能,提供了用户友好的交互体验。接下来,我们将深入探讨Flex在图片浏览中的应用及其关键技术。 首先...

    Flex图片预览功能的实现

    一、Flex图片预览组件基础 在Flex中,我们可以利用MX或Spark组件库中的Image组件来展示单张图片。然而,为了实现多图预览和滚动效果,我们需要自定义组件或者使用现有的第三方库,如在本例中的"photocoverflowLayout...

    FLEX 图片浏览功能可以轻松实现图片浏览

    标题提及的"“FLEX 图片浏览功能可以轻松实现图片浏览”",这指的是使用Flex3开发的图片查看器应用,它允许用户方便地查看和浏览图片,同时可能还支持一些高级特性,如缩放、旋转、平移等。Flex3提供了强大的图形...

    flex 图片编辑器

    在开发Flex图片编辑器时,主要涉及以下知识点: 1. **Flex SDK**:Flex SDK是开发Flex应用程序的基础,包括ActionScript编译器和MXML编译器,以及用于构建、测试和部署应用的工具。开发者需要下载并安装SDK来开始...

    flex实现对图片的旋转与拖动

    flex实现对图片的旋转与拖动,简单的小例子,希望对大家有所帮助

    用Flex写的照片旋转

    "ImageWheel"可能是一个自定义组件,模拟了轮盘式的图片浏览体验,用户可以通过滚动或选择来查看和旋转不同的照片。在这个组件中,可能包含了对图像的加载、显示、以及旋转逻辑的实现。 关于Flex开发照片旋转功能的...

    flex图片显示 很绚丽的图片显示

    5. 图片特效:Flex还允许开发者利用ActionScript 3.0实现自定义的图片特效,例如淡入淡出、旋转、模糊等。可以利用`BitmapData`类对图片进行像素级别的操作。 6. 案例分析:提到的“PicWatcher”可能是一个图片查看...

    flex 图片查看组件

    3. **交互性**:Flex图片查看组件通常具备手势识别功能,如平移、缩放、旋转,使用户能够用鼠标或触摸设备进行直观的操作。这种高交互性增强了用户与图片内容的连接。 4. **性能优化**:由于图片可能很大,所以高效...

    flex 4.6 中实现手机端图片导入和旋转图片

    flex 4.6 中实现手机端图片导入和旋转图片 里面有 3 个图片 文件没有上传(旋转按钮上的图标left.png right.png 和一个默认图片视图=^.^=.jpg 可自己修改一下)例如 自己加图片在 assets中并命名为这些名字 或 在...

    flex图片上传功能,包括图片预览

    标题中的“flex图片上传功能,包括图片预览”是指使用Adobe Flex技术实现的图片上传和预览功能。Flex是基于ActionScript(AS)3.0的开放源代码框架,主要用于构建富互联网应用程序(RIA)。这一功能允许用户在Web...

    flex360°全视角立体旋转图片demo

    "flex360°全视角立体旋转图片demo"就是一个利用Adobe Flex技术来创建的交互式3D展示应用,它带给用户一种全新的、全方位的图片浏览体验。这个应用通过Flash平台实现了图片的立体360度旋转,使用户可以像观察实物...

    Flex电子相册旋转一

    这个标题所指的“Flex电子相册旋转一”可能是基于Flex开发的一个交互式电子相册应用,具有图片旋转功能。在Flex中,可以利用ActionScript,一个基于ECMAScript的脚本语言,来实现动态效果,如图像的旋转。 在Flex中...

    flex图片滚动

    Flex图片滚动技术是一种基于Adobe Flex框架实现的动态图像展示解决方案。Flex是一款强大的开发工具,用于构建富互联网应用程序(RIA),它使用ActionScript编程语言和MXML标记语言,为Web提供丰富的交互体验。在这个...

    Flex 3D图片图片浏览

    Flex 3D图片浏览是一种利用Adobe Flex技术和PaperVision3D库实现的三维图像展示技术。在Web开发领域,这样的技术可以为用户提供更加丰富、立体的交互体验,尤其适用于产品展示、艺术画廊或者照片库等应用场景。下面...

    flex图片浏览(带图片缩放功能)

    对于"flex图片浏览(带图片缩放功能)"这个应用,我们需要使用Flex中的Image组件来显示图片。Image组件能够加载和显示各种图像格式,包括JPEG、PNG、GIF等。以下是一个简单的例子: ```mxml ('path/to/your/image.jpg...

    flex 图片操作

    在本话题中,我们将探讨“flex图片操作”,这涉及到如何使用Flex来处理和展示图片,包括调整角度和应用滤镜等视觉效果。 一、Flex中的图片显示 在Flex中,我们可以使用`mx.controls.Image`组件来显示图片。这个...

Global site tag (gtag.js) - Google Analytics