利用BlendMode.LAYER处理图形重叠

　　画两个有重叠部分的图形，如果都不透明或者在上面的图形不透明的话，这样的重叠我们不会觉得有什么不妥。如：

　　但是如果要设置图形有一定的透明度，重叠部分就会显得很不和谐，这并不是想要的效果，理想的效果应该是重叠部分在透明时只显示上面图形的部分（下图红色部分），而下面第二张图显然就是想要的效果

这种效果可以用混合模式中的LAYER模式来实现，LAYER强制为显示对象创建一个透明度组，将子对象看成一个整体进行透明渲染

//s,s1为上图的圆和长方形
sp.addChild(s); sp.addChild(s1); sp.blendMode=BlendMode.LAYER; sp.alpha=0.5;

在这里要注意一下，就是包含在显示对象中的子对象如果想要在设置透明度时当成一个整体透明化时，子对象的alpha必须设为1，不然即使为该显示对象设置LAYER混合模式出来的效果也是如第2张图那样会有重叠部分出现。

LAYER还可以用来实现TextField里的文本透明显示，不过在flash player 9可能会出现异常，前几天正是这个异常花了我近一天的时间才查出，据说是flash player 9对于TextField的渲染有Bug。在IE上运行时会使IE异常关闭并重新加载，在firefox上运行就不会出错。TextField文本透明如下：（其实也差不多）

//将textfield加到混合模式为LAYER的容器中，设容器的透明来调文本的透明度 sp.addChild(textfield); sp.blendMode=BlendMode.LAYER; sp.alpha=0.5;

下面是完整的测试代码（只限于图像重叠）：

 

import flash.display.BlendMode;

import flash.display.Shape;

import flash.display.Sprite;



var sp:Sprite=new Sprite();

var s:Shape=new Shape();

var s1:Shape=new Shape();

/*s.graphics.lineStyle(10,0);

s.graphics.lineTo(100,100);

s1.graphics.lineStyle(10);

s1.graphics.moveTo(0,100);

s1.graphics.lineTo(100,0);*/

s.graphics.beginFill(0);

s.graphics.drawCircle(0,0,100);

s.graphics.endFill();

s1.graphics.beginFill(0xff0000);

s1.graphics.drawRect(0,0,100,200);

s1.graphics.endFill();

s.x=100;

s.y=100;

s1.x=100;

s1.y=100;

sp.addChild(s);

sp.addChild(s1);

sp.blendMode=BlendMode.LAYER;

sp.alpha=0.5;



this.addChild(sp);

sp.x=100;

sp.y=100;



var sp2:Sprite=new Sprite();

sp2.graphics.beginFill(0xffff00,0.5);

sp2.graphics.drawRoundRect(0,0,20,20,10,10);

sp2.graphics.endFill();

//this.addChild(sp2);

sp2.x=200;

sp2.y=200;



//this.setChildIndex(sp,1);