omiga

简单就好

AS3绘制扇形

3条评论»

AS3中本身并没有提供绘制扇形的的方法,但是可以利用curveTo()来间接的完成这一任务。curveTo()绘制的曲线是接近Bezier曲线的曲线,并不是标准的圆弧,所以如果对精确度要求过高并不合适。

为了写这个类,努力地去回忆了下高中几何知识,再借助万能的Google才拼出了下面这张图(相信你一看就懂),看大图

看看demo~

Sector.as 源码(提供了一个reDraw方法,重新传递半径、起始角度和角度clear后重新绘制):

import flash.display.Sprite;
//Description:draw a sector by curveTo()
//Email:wondger[at]gmail.com
//Blog:http://omiga.org/
//Date:2010-08
public class Sector extends Sprite{
  private var _x0:Number; //圆心横坐标
  private var _y0:Number; //圆心纵坐标
  private var _r:Number; //圆半径
  private var _a0:Number; //起始角度 0度开始顺时针方向
  private var _lineWidth:Number; //线条宽度
  private var _lineColor:Number; //线条颜色
  private var _fillColor:Number; //填充颜色
  public function Sector(x0:Number,y0:Number,r:Number,a0:Number,a:Number,lineWidth:Number=1,lineColor:Number=0xFF0000,fillColor:Number=0xFFFF00){
    _x0 = x0;
    _y0 = y0;
    _r = r;
    _a0 = a0*Math.PI/180;
    _lineWidth = lineWidth;
    _lineColor = lineColor;
    _fillColor = fillColor;
    if(a>0&&a<=360) drawSector(a);
  }
  private function drawSector(a:Number):void{
    this.graphics.lineStyle(_lineWidth,_lineColor);
    this.graphics.beginFill(_fillColor);
    this.graphics.moveTo(_x0,_y0);
    this.graphics.lineTo(_x0+_r*Math.cos(_a0),_y0+_r*Math.sin(_a0)); //曲线绘制起始点
    var n:uint = Math.floor(a/45); //分段绘制接近Bezier曲线的曲线,分段越细,曲线越接近真实圆弧线
    var a0:Number = _a0; //记录初始角度
    while(n-->0){
      a0+=Math.PI/4;
      this.graphics.curveTo(_x0+_r/Math.cos(Math.PI/8)*Math.cos(a0-Math.PI/8),_y0+_r/Math.cos(Math.PI/8)*Math.sin(a0-Math.PI/8),_x0+_r*Math.cos(a0),_y0+_r*Math.sin(a0));
    }
    if(a%45){
      var am:Number = a%45*Math.PI/180;
      this.graphics.curveTo(_x0+_r/Math.cos(am/2)*Math.cos(a0+am/2),_y0+_r/Math.cos(am/2)*Math.sin(a0+am/2),_x0+_r*Math.cos(a0+am),_y0+_r*Math.sin(a0+am));
    }
    this.graphics.lineTo(_x0,_y0);
    this.graphics.endFill();
  }
  public function reDraw(r:Number,a0:Number,a:Number):void{
    if(a>0&&a<=360){
      _r = r;
      _a0 = a0*Math.PI/180;
      this.graphics.clear();
      drawSector(a);
    }
  }
}

<object>

1条评论»

说object?说啥呢?先简单说下object历史。Long long ago……为了实现将大量不需要在服务端的运算转移到到客户端,NetScape(NS)率先率先实现了对Java applet的支持。当时如日中天的微软当然不甘落后,而且微软觉得自己可以更NB一点,于是自己重新开发了ActiveX以替代Java applet。众所周知,HTML是标记性语言,任何的内容都需要标签来表示。于是NetScaple使用了<applet>标签来嵌入Java applet,IE则使用<object>标签来嵌入ActiveX。尽管在当时NS具有绝对优势的市场份额,而IE因与windows捆绑也“鸡犬升天”,一步步蚕食着NS的市场,双方为了争夺更多的用户,NS在随后的版本中也实现了对<object>的支持,当然仅仅是实现了对<object>标签的支持,而不是ActiveX;而IE则也开始支持<applet>和<embed>标签。

后来HTML4提出了一个概念-inclusions(包含对象),Java applet、ActiveX均是inclusions,也包括.png、.gif等图像文件,.avi等视频文件。同时标准建议使用<object>标签来嵌入inclusions。主流浏览器也开始提供对<object>更为良好的支持,但是在实现上还是存在一些差异。比如IE始终将<object>嵌入的对象作为ActiveX来处理。

那么如何使用<object>来嵌入对象?举一个大家都很熟悉的嵌入flash的例子。以下三段代码均能在现代主流浏览器中得到正确地解析而将flash嵌入到页面中。

<embed src="temp.swf" quality="high"  pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash"  type="application/x-shockwave-flash" width="200"  height="200"></embed>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"  codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0"  width="200" height="200">
    <param name="movie" value="temp.swf"  />
    <param name="quality" value="high" />
</object>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"  codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0"  width="200" height="200">
    <param name="movie"  value="temp.swf" />
    <param name="quality" value="high" />
    <embed src="temp.swf" quality="high"  pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash"  type="application/x-shockwave-flash" width="200"  height="200"></embed>
</object>

正如前面所说,由于历史原因,最初对嵌入对象的实现方式不尽相同,但到今天个主浏览器对嵌入对象方式都具有了较好的兼容性。不论是使用<embed>,还是<object>都能在页面中嵌入对象。第三段代码是Dreamweaver中插入flash使用的代码,这段代码更好地解决了浏览器兼容性的问题,包括一些老版本浏览器。当浏览器不支持<object>标签时,会解析<object>中除<param>外的其他标签,所以第三段代码较之第一、二段代码具有更好的兼容性。

关于<object>中相关属性的介绍就不在此赘述了,大家可参考其他一些资料都有详细介绍。在此提醒两处需要注意的地方:

  1. 在使用<object>嵌入对象的时候,需要为<object>设置id属性,否则IE会报错
  2. 使用兼容方式嵌入对象的时候,对象的获取存在差异。标准的方法是用下面函数即可获取到对象
function getSwfMovie(movieName){
   if(navigator.appName.indexOf("Microsoft")!=-1)  return window[movieName]; 
   else return document[movieName];
}

但是该方法在Firefox中无法获取到对象,而是需要通过获取<embed>来完成

function getSwfMovie(movieName){
    if(navigator.appName.indexOf("Microsoft")!=-1) return  window[movieName]; 
    else return  document[movieName].getElementsByTagName("embed")[0];
}

Adobe Flash Player—Debugger Versions

2条评论»

ExternalInterface

发表评论»

ExternalInterface是一个外部的用于实现Actionscript和Flash Player容器之间通信的应用程序接口(诸如AS与JS的通信)。推荐对所有 JavaScript 与 ActionScript 之间的通信使用 ExternalInterface,替代较旧的fscommand(),getURL()方法。

ExternalInterface类有两个公共属性:

  1. available : Boolean [static][read-only] 指示此播放器是否位于提供外部接口的容器中。
  2. objectID : String [static][read-only] 在 Internet Explorer 中,返回标签的 id 属性;在 Netscape 中,返回 name 属性。

同时具有两个公共方法:

  1. addCallback(functionName:String, closure:Function):void [static] 将 ActionScript 方法注册为可从容器调用。
  2. call(functionName:String, … arguments):* [static] 调用由 Flash Player 容器公开的函数,不传递参数或传递多个参数。

ActionScript调用JavaScript demo

AS:

import flash.events.MouseEvent;
import flash.external.ExternalInterface;
bt.addEventListener(MouseEvent.MOUSE_UP,alert);
function alert(e:MouseEvent):void{
 ExternalInterface.call("alert","a demo for call \n http://omiga.org");
}

直接调用即可,当然,最好检查一下当前容器是否支持外部接口通信。

bt.addEventListener(MouseEvent.MOUSE_UP,alert);
function alert(e:MouseEvent):void{
 if(ExternalInterface.available){
 ExternalInterface.call("alert","a demo for call \n http://omiga.org");
 }
}

JavaScript调用ActionScript demo

AS:

import flash.external.ExternalInterface;
function setText(s){
 i_txt.text = s;
}
ExternalInterface.addCallback("setText",setText);

HTML:

<object id="mySWF"  classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="300" height="22">
 <param name="movie" value="addCallback.swf" />
 <param name="quality" value="high" />
 <param name="allowScriptAccess" value="always" />
 <embed src="addCallback.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="300" height="22"></embed>
</object>
<button onclick="set()">设 置</button>
<script type="text/javascript">
function getFlash(id){
 if(document.all) return document.getElementById(id);
 else return document.getElementById(id).getElementsByTagName("embed")[0];
}
function set(){
 var s = prompt('请输入:');
 getFlash("mySWF").setText(s);
}
</script>

Flash Video Player Plugin for WordPress

发表评论»

WP的一款播放器插件,界面和CoolPlayer很相似呢~···但是需要加载的文件明显比CoolPlayer少,也要小~··· BTW:原来它们都用的JW FLV MEDIA PLAYER~···汗~···这个播放器本来就支持很多媒体格式,或许作者只是改装成WP plugin而已~···囧~

WP的插件虽然很丰富,但是多了,必然影响网站的加载时间,所以插件的使用也应有所选择~··· Flasher Video Player相对于CoolPlayer来说功能上要逊色不少,但是基本上可以满足正常需求咯~···所以说如果你对网站的访问速度要求不那么苛刻的话,CoolPlayer是很好的选择~

Flash Video Player Player Plugin for WordPress 下载地址

安装后发表的时候嵌入下面的代码便可使用~注意文件名后面留空格,否则会出错~
[flashvideo filename=videos/my-video.flv /]
OK,测试下~《青花瓷》~

[flashvideo filename=http://omiga.org/music/青花瓷.mp3 /]