页面

2010年5月26日星期三

bitmap类型九宫格应用

用flash创作客户端界面时,我们常常要用到显示对象的九宫格属性,然而...

问题:bitmap无法应用scale9Grid

原因:设置DisplayObjiect.scale9grid时,flash仍会正常缩放所有文本和填充(包括位图、视频和渐变),即便这些文本和填充在九宫格中心区域以外.

解决办法:
1 将位图(渐变、文本)打散,按照九宫格划分九个区域,然后将他们ctrl+G到九个不同组中,这样flash会认为他们不再是文本和填充,而导致scale9Grid起作用.
a.如果你只是在水平方向需要scale9grid,可以划三条竖直线,分三组即可.垂直方向亦如此。
而如果水平、垂直方向都需要scale9grid,就需要分成9组了。

b.一旦旋转显示对象,则会忽略 scale9Grid属性。

2使用流传的BitmapScale9Grid 类
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.geom.Rectangle;
import flash.geom.Point;

public class BitmapScale9Grid extends Sprite
{
private var source : Bitmap;
private var scaleGridTop : Number;
private var scaleGridBottom : Number;
private var scaleGridLeft : Number;
private var scaleGridRight : Number;

private var leftUp : Bitmap;
private var leftCenter : Bitmap;
private var leftBottom : Bitmap;
private var centerUp : Bitmap;
private var center : Bitmap;
private var centerBottom : Bitmap;
private var rightUp : Bitmap;
private var rightCenter : Bitmap;
private var rightBottom : Bitmap;

private var _width : Number;
private var _height : Number;

private var minWidth : Number;
private var minHeight : Number;

public function BitmapScale9Grid(source:Bitmap, scaleGridTop:Number, scaleGridBottom:Number, scaleGridLeft:Number, scaleGridRight:Number )
{
this.source = source;
this.scaleGridTop = scaleGridTop;
this.scaleGridBottom = scaleGridBottom;
this.scaleGridLeft = scaleGridLeft;
this.scaleGridRight = scaleGridRight;
init();

}

private function init() : void {
_width = source.width;
_height = source.height;

leftUp = getBitmap(0, 0, scaleGridLeft, scaleGridTop);
this.addChild(leftUp);

leftCenter = getBitmap(0, scaleGridTop, scaleGridLeft, scaleGridBottom - scaleGridTop);
this.addChild(leftCenter);

leftBottom = getBitmap(0, scaleGridBottom, scaleGridLeft, source.height - scaleGridBottom);
this.addChild(leftBottom);

centerUp = getBitmap(scaleGridLeft, 0, scaleGridRight - scaleGridLeft, scaleGridTop);
this.addChild(centerUp);

center = getBitmap(scaleGridLeft, scaleGridTop, scaleGridRight - scaleGridLeft, scaleGridBottom - scaleGridTop);
this.addChild(center);

centerBottom = getBitmap(scaleGridLeft, scaleGridBottom, scaleGridRight - scaleGridLeft, source.height - scaleGridBottom);
this.addChild(centerBottom);

rightUp = getBitmap(scaleGridRight, 0, source.width - scaleGridRight, scaleGridTop);
this.addChild(rightUp);

rightCenter = getBitmap(scaleGridRight, scaleGridTop, source.width - scaleGridRight, scaleGridBottom - scaleGridTop);
this.addChild(rightCenter);

rightBottom = getBitmap(scaleGridRight, scaleGridBottom, source.width - scaleGridRight, source.height - scaleGridBottom);
this.addChild(rightBottom);

minWidth = leftUp.width + rightBottom.width;
minHeight = leftBottom.height + rightBottom.height;
}

private function getBitmap(x:Number, y:Number, w:Number, h:Number) : Bitmap {
var bit:BitmapData = new BitmapData(w, h);
bit.copyPixels(source.bitmapData, new Rectangle(x, y, w, h), new Point(0, 0));
var bitMap:Bitmap = new Bitmap(bit);
bitMap.x = x;
bitMap.y = y;
return bitMap;
}

override public function set width(w : Number) : void {
if(w < minWidth) {
w = minWidth;
}
_width = w;
refurbishSize();
}

override public function set height(h : Number) : void {
if(h < minHeight) {
h = minHeight;
}
_height = h;
refurbishSize();
}

private function refurbishSize() : void {
leftCenter.height = _height - leftUp.height - leftBottom.height;
leftBottom.y = _height - leftBottom.height;
centerUp.width = _width - leftUp.width - rightUp.width;
center.width = centerUp.width;
center.height = leftCenter.height;
centerBottom.width = center.width;
centerBottom.y = leftBottom.y;
rightUp.x = _width - rightUp.width;
rightCenter.x = rightUp.x;
rightCenter.height = center.height;
rightBottom.x = rightUp.x;
rightBottom.y = leftBottom.y;
}
}
}

没有评论:

发表评论