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

导读:
   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
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值