您的位置:首页 > 其它

Flex cookbook BETA 如何创建一个聚光灯效果

2007-12-07 20:47 471 查看
导读:
  Problem Summary
  Using Flash CS3 or prior its trivial to create a spotlight effect using a couple layers and making one of them, etc. Without Flash's timeline though something like a spotlight effect in Flex has to be done differently. 使用FLASH CS3创建一个聚光灯效果是很容易的,使用FLEX来创建,因为没有时间轴,做法是不同的。
  Solution Summary
  The code is trivial to create a spotlight effect. I've essentially used two images and then with a little ActionScript setup the mask to a circle that will follow the mouse around. There are other ways to do this, this is one way. 下面的代码。私用了两张图片以及一些AS的API来创建一个鼠标周围的遮罩。当然还有其他的方法来做这件事情,这只是一种解法。
  Explanation
  Make a basic Flex application with the following MXML:
  
  
  
  
private function myfunc():void
{
var myclass:MyClass = new MyClass();
myCanvas.rawChildren.addChild(myclass);
}
]]>  private function myfunc():void
  {
  var myclass:MyClass = new MyClass();
  myCanvas.rawChildren.addChild(myclass);
  }
  ]]>
  
  
  
  
  Once the Flex application was ready I added an ActionScript class file to the project called "MyClass.as" with the following code:
  package
  {
  import flash.display.Loader;
  import flash.display.Sprite;
  import flash.net.URLRequest;
  
  public class MyClass extends Sprite
  {
  public function MyClass():void
  {
  var loader:Loader = new Loader();
  var url:URLRequest = new URLRequest("myImage.jpg");
  loader.load(url);
  this.addChild(loader);
  
  var circle:Sprite = new Sprite();
  circle.graphics.beginFill(0x00FFFFFF, 1.0);
  circle.graphics.drawCircle(0, 0, 50);
  circle.graphics.endFill();
  this.addChild(circle);
  
  loader.cacheAsBitmap = true;
  circle.cacheAsBitmap = true;
  loader.mask = circle;
  circle.startDrag(true);
  }
  }
  }
  Of course for the "myImage.jpg" you will need to substitute some sort of image of your own and bring it into your project for the spotlight effect to work. Adjust the sizes as determined by your image size and needs. Its goes without saying that there are better spots to put this code other than the class's constructor but since this is just a simple example I wanted to keep everything as simple as possible. 当然你可以替换自己的图片将代码整合到自己的项目中去
  Run the project and simply click on the rendered SWF in your web browser and you should see the spotlight effect following your mouse around. 运行代码测试一下

本文转自
http://www.adobe.com/cfusion/communityengine/index.cfm?event=showdetails&productId=2&postId=6842
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐