设为首页 加入收藏 网站搜索 繁體中文 中国建站网 — 站长资源分享平台

关于制作Flash翻书效果的研究

来源:136z.Com 作者:佚名 时间:2005-10-17 01:15:36
  这个项目的概念是使来到我站点的人有机会用FlashMX设计一本虚拟的书,就象一本真正的书那样,不过它是摆在你的计算机桌面上的。你可以一页一页地阅读。  

  注意,这个课程是面向那些对ActionScript有所了解以及知道如何在FlashMX中编码的人。如果你只知道如何创建一个球并让它在桌面上滚动,那么请过几个月再来吧。  



  只是开玩笑啦。基本上在这个课程里只有很少的技术。在这个教程中的所有函数是经常使用的。编码非常容易,你需要知道的只是一些基本的三角知识,比如sine(正弦)、cosec(余弦)、hypotenuse(直角三角形的斜边)。这些对于这个教程来说就足够了。所以,放轻松,好好享受吧。

  这是一个正在进行的项目。  

  如果你有任何问题,请给我e-mail。  

  让我们开始吧。  

  第一部分  

  ——基本计算函数(basic calculation functions)  

  在这个根脚本(root script)里,我们有两个基本计算函数。你可以把它们直接拷贝到你的舞台(stage)上,因为我们将会一遍遍用到它们。一个是getDist,另一个是getAngle。它们对你来说很简单,是吧?老实说,我都没兴趣解释这样的东西,这些是高中数学课上该学的。  

  第一个函数是获得两点之间的距离。我们需要知道这两点之间的坐标。  

  // Get the distance between two points. (得到两点之间的距离)

  function getDist(px1, py1, px2, py2){

  x = px2 - px1;

  y = py2 - py1;  

  hyp = Math.sqrt(Math.pow(x,2) + Math.pow(y,2));  

  return hyp;

  }  

  
请添加描述


  好了,现在你进展已经不错。我们可以试一下更难点的。——怎么获得两点之间的角度。  

  // Get the angle between two points. (得到两点之间的角度)

  function getAngle(px1, py1, px2, py2){

  x = px2 - px1;

  y = py2 - py1;

  hyp = Math.sqrt(Math.pow(x,2) + Math.pow(y,2));  

  cos = x / hyp;

  rad = Math.acos(cos);

  // Ask your math teacher if you don’t understand this one.(如果你看不懂,就去问你的数学老师)
  deg = 180/(Math.PI / rad);

  // Yes, we do got one angle, rad, by 'Math.acos(cos)', but in radians.(是的,我们通过cos得到了一个角度“rad”,不过是以弧度为单位的)  

  // Therefore, we need do one more step to transfer it to normal angle we need.(因此,我们需要再进一步把它转换成我们所需要的标准的角度)  

  if(y <0){deg = -deg;}

  else if((y == 0) && (x <0)){deg = 180;}  

  return deg;

  }
  
请添加描述


  我不需要做更多解释了吧?

  第二部分  

  ——舞台(stage)上基本的Movie Clips  

  在库(library)中创建4个方块符号(symbol)。它们是你书中的不同的页面。如果你喜欢,你可以根据需要重新设计。我只需要提醒你一件事,就是,把参考点放在每个symbol的左下角,我们需要用它们来找到页面的位置。

  
请添加描述


  在这个演示例子里,假定我们的书只有4页。如果你想让你的书页数更多,那就请自己加一些新的check situation函数。要确保页面的大小与书本相符。  

  把它们拖到你的舞台上,确保它们在不同的层面。  

  按照这个顺序:第4页,第1页,第2页,第3页。  

  第3页应该在最上面一层。  

  确保将这些movie clip如下图所示放置。

  
请添加描述


  第3页的具体位置没什么要紧,因为我们将会把它做动态调整。  

  2、创建一个符号(symbol)圆,并切割下来(cut)。我们需要在移动鼠标的时候用它来检查不同的位置。

  
请添加描述


  3、创建一个包含一个点的symbol,你可以用任何风格的点,这取决于你。  

  把“点”这个symbol在舞台上放5次,分别命名为D0,D1,D2,D3和D4。  

  
请添加描述


  我需要提醒你的是,不要在movie clip Page1和Page4的区域外放置任何movie clip。  

  4、我们还会需要一些别的符号(symbol),比如阴影或别的什么,我们可以迟一点再创建它们,别担心。  

  现在再数一次,你库(library)里的符号(symbol)有:  

[1] [2] [3] [4]  下一页

Tags:

  • 好的评价 如果您觉得好,就请您
      0%(0)
  • 差的评价 如果您觉得差,就请您
      0%(0)
  • 相关文章
    广告赞助

    文章随便看看 设计素材 建站学院 网页模板 视频教程

    网友评论

    共有 0 位网友发表了评论,得分 0 分,平均 0 分    查看完整评论

    用户名: 查看更多评论

    分 值:100分 85分 70分 55分 40分 25分 10分 1分

    内 容:

             通知管理员 验证码: