如何创建一个九宫格拉伸方式的Sprite

                                               如何创建一个九宫格拉伸方式的Sprite

       很多时候需要将一个Sprite的四个角保持不变进行拉伸，比如聊天气泡。下面是一个我封装的BubbleSprite类，从CCSprite派生出来的。

   类的实现方式如下：

   .h文件

#import <Foundation/Foundation.h>
#import "cocos2d.h"

@interface BubbleSprite : CCSprite
{
    
}

+(id)spriteWithFile:(NSString*)file size:(CGSize)size leftCap:(NSInteger)leftcap topCap:(NSInteger)topcap;
-(id)initWithFile:(NSString*)file size:(CGSize)size leftCap:(NSInteger)leftcap topCap:(NSInteger)topcap;

@end

.m 文件：

#import "BubbleSprite.h"
@implementation BubbleSprite


+(id)spriteWithFile:(NSString*)file size:(CGSize)size leftCap:(NSInteger)leftcap topCap:(NSInteger)topcap
{
    return [[[self alloc] initWithFile:file size:size leftCap:leftcap topCap:topcap] autorelease];
}

-(id)initWithFile:(NSString*)file size:(CGSize)size leftCap:(NSInteger)leftcap topCap:(NSInteger)topcap
{
    UIImage* image = [UIImage imageNamed:file];
    CGImageRef base = image.CGImage; 
    CGContextRef context = CGBitmapContextCreate(nil,
                                                 size.width, 
                                                 size.height, 
                                                 CGImageGetBitsPerComponent(base), 
                                                 4 * size.width,
                                                 CGImageGetColorSpace(base), 
                                                 kCGImageAlphaPremultipliedLast | kCGBitmapByteOrderDefault);
    
    
    float BASE_COL_X[] = {0,leftcap,leftcap + 1};
    float BASE_ROW_Y[] = {0,topcap,topcap +1};
    float BASE_COL_WIDTH[] = {leftcap,1,image.size.width - leftcap -1};
    float BASE_ROW_HEIGHT[] = {topcap,1,image.size.height - topcap -1};

    
    float TARGET_COL_WIDTH[] = {BASE_COL_WIDTH[0], size.width - BASE_COL_WIDTH[0] - BASE_COL_WIDTH[2], BASE_COL_WIDTH[2]};
   
    float TARGET_ROW_HEIGHT[] = {BASE_ROW_HEIGHT[0], size.height - BASE_ROW_HEIGHT[0] - BASE_ROW_HEIGHT[2], BASE_ROW_HEIGHT[2]};
    
    float TARGET_COL_X[] = {0,TARGET_COL_WIDTH[0],TARGET_COL_WIDTH[0]+TARGET_COL_WIDTH[1]};
    
    float TARGET_ROW_Y[] = {size.height - TARGET_ROW_HEIGHT[0],
        size.height - TARGET_ROW_HEIGHT[0] - TARGET_ROW_HEIGHT[1],
        size.height - TARGET_ROW_HEIGHT[0] - TARGET_ROW_HEIGHT[1] - TARGET_ROW_HEIGHT[2]};

//    int  originWidth=image.size.width;
//    int  originHeight=image.size.height;
//    
//    float BASE_COL_X[] = {0,leftcap,(originWidth-leftcap)};
//    float BASE_ROW_Y[] = {0,topcap,(originHeight-topcap)};
//    float BASE_COL_WIDTH[] = {leftcap,1,leftcap};
//    float BASE_ROW_HEIGHT[] = {topcap,1,topcap};
//
//    
//    float TARGET_COL_WIDTH[] = {BASE_COL_WIDTH[0], size.width - BASE_COL_WIDTH[0] - BASE_COL_WIDTH[2], BASE_COL_WIDTH[2]};
//    
//    float TARGET_ROW_HEIGHT[] = {BASE_ROW_HEIGHT[0], size.height - BASE_ROW_HEIGHT[0] - BASE_ROW_HEIGHT[2], BASE_ROW_HEIGHT[2]};
//    
//    float TARGET_COL_X[] = {0,TARGET_COL_WIDTH[0],size.width-TARGET_COL_WIDTH[0]};
//    
//    float TARGET_ROW_Y[] = {size.height - TARGET_ROW_HEIGHT[0],TARGET_ROW_HEIGHT[0],0};
//    
    

    for (int row=0; row<3; row++) 
    {
        for (int col=0; col<3; col++)
        {
            CGRect source = CGRectMake(BASE_COL_X[col], BASE_ROW_Y[row], BASE_COL_WIDTH[col], BASE_ROW_HEIGHT[row]);
            
            if (source.origin.x<0) 
            {
                source.origin.x=0;
            }
            if (source.origin.y<0) 
            {
                source.origin.y=0;
            }
            if (source.size.width<0) 
            {
                source.size.width=0;
            }
            if (source.size.height<0) 
            {
                source.size.height=0;
            }
            
            CGRect target = CGRectMake(TARGET_COL_X[col], TARGET_ROW_Y[row], TARGET_COL_WIDTH[col], TARGET_ROW_HEIGHT[row]);
            
            
            if (target.origin.x<0) 
            {
                target.origin.x=0;
            }
            if (target.origin.y<0) 
            {
                target.origin.y=0;
            }
            if (target.size.width<0) 
            {
                target.size.width=0;
            }
            if (target.size.height<0) 
            {
                target.size.height=0;
            }
            
            
            CGImageRef ref = CGImageCreateWithImageInRect(base, source);
            
            if (ref) 
            {
                CGContextDrawImage(context, target, ref);
                CFRelease(ref); 
            }

        }
    }     
    CGImageRef final = CGBitmapContextCreateImage(context); 
    CGContextRelease(context);
    return [super initWithCGImage:final key:nil];
}

@end

一般这个类是这么调用的：

         CGSize  bubbleSize;

    int gap_X = 11.0f;  //左右两边保持不拉伸的宽度

    int gap_Y = 15.0f;  //上下两边保持不拉伸的高度

    bubbleSize.width+=gap_X*2;

    bubbleSize.height+=gap_Y*2;

    上面就是非Retina模式下，传递给BubbleSprite的

spriteWithFile函数的参数。

    为了统一处理Retina模式，添加如下代码：

    

    int  RETINA = 1;

    if (IS_RETINA == NO) 

    {

        RETINA = 1;

    }

    else

    {

        RETINA= 2;

    }    

    

    bubbleSize.width = bubbleSize.width * RETINA;

    bubbleSize.height = bubbleSize.height * RETINA;

    gap_X=gap_X * RETINA;

    gap_Y=gap_Y * RETINA;

    最后调用：

    

   

    //pic name  这个地方要手动处理hd与非hd的图片，因为cocos并不能自动识别这两个图片。

    char temp[30];

    memset(temp, 0, 30);

    if (RETINA==1)

    {

       sprintf(temp, "chat_bubble.png"); 

    }

    else

    {

       sprintf(temp, "chat_bubble-hd.png"); 

    }

    

    NSString  * nsPicName=[NSString  stringWithCString:temp encoding:NSUTF8StringEncoding];

    BubbleSprite  * bubbleSprite=[BubbleSprite  spriteWithFile:nsPicName size:bubbleSize leftCap:gap_X topCap:gap_Y];