AS3模拟书本翻页效果

森森 2009-10-31 125 views

     用AS3可以作出很多图形特效,但是我还没深深研究过,现在公司要做电子杂志项目。由于公司广告理念的创新性,使用常见的Zcom或IEBook制作出的电子杂志根本不能满足目前公司广告的需求。于是决定自己研发,从Flash平台到Exe打包平台,都自行研发。

    其他的就不说了,很多技术细节说起来可是没完没了,杂志的效果可以看http://www.kansoubao.com/files/online/200911/Soubao.html。下面重点讲一下翻页特效的实现!

    这里运用到了一个现成的AS3类“PageFlip”,这个类可以根据你设定的坐标位置以及翻页页角作出翻页效果。:我自己根据需要对这个类进行了简单的修改,让他翻页的时候有点阴影的效果。

     调用这个类的方法:

      var o:Object = PageFlip.computeFlip(
               new Point(rx,ry), // 页角要到达的坐标
               new Point(1,1),  // 从哪一个角翻开
               475,  //要翻开页面的宽度 
               650, // 高度
               true,    // 这个我也不知道是什么
     1);     // 这个也是
   PageFlip.drawBitmapSheet(o,     // computeflip returned object
              render,     // target
              page0,  //页面正面的图
              page1);  // 页面背面的图

     添加到你的Flash或者Flex项目中,你可以看到翻页的效果。
    2009-10-31 18 36 14

    说明一下:指定从那个页角开始翻页是这样的,以页面的左上角为坐标原点,以右下角为坐标(1,1),所以(0,0)表示左上角、(0,1)表示左下角、(1,0)表示右上角、(1,1)表示右下角。如下所示:
    2009-10-31 18 43 09

    好了,能做出翻页效果了,但是这仅仅是静态的,你没指定一次他做一个效果,至于让他怎么翻那就仁者见仁智者见智了。我自己想了一种椭圆坐标显示法。即把页面的左下角想象为坐标圆点,画二维坐标轴,以页面宽为长轴a,以自定义高度为短轴b作椭圆。于是便有翻页的运动轨迹如下红线所示:
2009-10-31 18 53 15
根据椭圆公式:x2/a2 + y2/b2 = 1,可以通过匀速变化的x来求的变动的y,然后就可以达到翻页效果了。

Tags: , , / Posted in AS3
欢迎订阅: Google Reader | 鲜果 | 抓虾 | 九点 | QQ邮箱 | 有道 | 更多

评论暂缺

  • (Required)
  • (Required, will not be published)

友情链接

Design By CKSKY TEAM VERSION 3.0 他说博客不用备案... © Copyright 2010 All Rights Reserved