麻球开发者平台,麻球开发者大赛

只看楼主 楼主

艾睿会员有特权,登陆后广告自动屏障。
现在就花5秒钟免费注册!更有好礼相送!

Adobe Flex迷你教程 -- Super easy实现Mac系统下滑式Alert窗口

睡前没事突然想起有次在哪见过一个苹果样式的弹出窗口demo. 因为当时没有源码,也没有注意是怎么实现的。今天用一个简单的方式做一个试试。

我们知道Flex中内置了很多默认的Effect,其实只要我们稍加组合,可以实现很多很有意思的效果,这次的下滑菜单就用了其中两个效果,wipeUp和Move,然后用Parallel把他们组合起来用。我现在来详解。

Demo中我创建了一个KAlert类,用它弹出的信息框就是下滑样式了,这其中我只添加了一个静态的show()方法,重点就是我在其中调用的 setAppleStyle(alert)和setOpenEffect(alert)。
分别用来设置样式和设置弹出动画。

public static function show(text:String,modal:Boolean = false):void{
      var alert:Alert = new Alert();

setAppleStyle(alert);
      setOpenEffect(alert);



      alert.text = text;
      var parent:Sprite = Sprite(Application.application);  
      PopUpManager.addPopUp(alert, parent, modal);
      alert.x = Application.application.width/2-100;
      alert.setActualSize(alert.getExplicitOrMeasuredWidth(), alert.getExplicitOrMeasuredHeight());

}


样式设置就是让弹出框看上去更像mac的样式。我们主要来看下面的setOpenEffect(alert);,看其中的注释既可,demo就靠这个方法实现下滑弹出窗口。



//设置弹出动画
private static function setOpenEffect(alert:Alert):void{
      var wipeUp:WipeUp = new WipeUp(); //Wipe效果,方向向上
      var move:Move = new  Move(); //移定效果
      var parallel:Parallel = new  Parallel(); //加入其中的效果会被并发执行
      parallel.addChild(move);
      parallel.addChild(wipeUp);

      //设置弹出框在正中央
      move.xFrom = Application.application.width/2-100;
      move.xTo = Application.application.width/2-100;

      //弹出时从-100移动到100,同时wipeUp
      move.yFrom = -100;
      move.yTo = -1;
      //动画执行时间为300毫秒
      wipeUp.duration = 300;
      move.duration=300;
      //在当前控件被加入舞台时执行
      alert.setStyle("addedEffect",parallel)
}






原文:http://www.flextheworld.com/?p=16
[本帖最后由 kevin.luo.sl 于 2009-01-02 21:01:20 编辑]

(您是游客)您没有权限查看附件

kevin.luo.sl的签名

评分

举报 使用道具 TOP

只看该用户 沙发!

Re:Adobe Flex迷你教程 -- Super easy实现Mac系统下滑式Alert窗口

谢谢分享~

评分

举报 使用道具 TOP

只看该用户 板凳

挺有用的,我试过了,不错

评分

举报 使用道具 TOP

只看该用户 地板

楼主啥也不说  - - 你是最棒的

评分

举报 使用道具 TOP

只看该用户 #4

支持楼主

评分

举报 使用道具 TOP

只看该用户 #5

好东西.不错 谢谢

评分

举报 使用道具 TOP

只看该用户 #6

好东西,谢谢分享!

评分

举报 使用道具 TOP

只看该用户 #7

好东西,可惜我没钱,留个记号先

评分

举报 使用道具 TOP

只看该用户 #8

好东西.下来看看
zhoubinlai的签名
我这一生只有两件事不会,这也不会,那也不会.

评分

举报 使用道具 TOP

只看该用户 #9

很好很好很好很好

评分

举报 使用道具 TOP

只看该用户 #10

支持楼主!! 谢谢你的分享!!

评分

举报 使用道具 TOP

只看该用户 #11

支持大家开源,我也好多学一点

评分

举报 使用道具 TOP

只看该用户 #12

非常不错 强烈推荐

评分

举报 使用道具 TOP

只看该用户 #13

好东西,谢谢分享!

评分

举报 使用道具 TOP

只看该用户 #14

崇拜楼主。呵呵。多谢

评分

举报 使用道具 TOP

只看该用户 #15

画面好好哦   下了分享

评分

举报 使用道具 TOP

只看该用户 #16

好东西@谢谢分享@

评分

举报 使用道具 TOP

只看该用户 #17

谢谢楼主.楼主辛苦了

评分

举报 使用道具 TOP

只看该用户 #18

不错,谢谢。。。

评分

举报 使用道具 TOP

只看该用户 #19

潜水伤身,回帖加分!

评分

举报 使用道具 TOP

只看该用户 #20

你的帖子激发了我说话的欲望!

下载下来学习以下,谢谢分享

评分

举报 使用道具 TOP

只看该用户 #21

潜水伤身,回帖加分!

学习了~~

评分

举报 使用道具 TOP

只看该用户 #22

学习了
Andrea的签名
最好不相見,如此便可不相戀。
最好不相知,如此便可不相思。

评分

举报 使用道具 TOP

只看该用户 #23

顶顶顶!!!

评分

举报 使用道具 TOP

只看该用户 #24

也漂亮也实用  谢谢。。
marcoojoey的签名
为了工作而劳累

评分

举报 使用道具 TOP

只看该用户 #25

很好很好很好很好

评分

举报 使用道具 TOP

只看该用户 #26

收藏了 先留个标记
Chao的签名

评分

举报 使用道具 TOP
艾睿会员有特权,登陆后广告自动屏障。现在就花5秒钟免费注册!更有好礼相送!