Skip to main content

dealing with textureAtlas and spritekit all about preloading texture atlas and remove them when you not need them anymore

spritekit is a cool 2d framework designed by apple with support fast 2d graphics rendering one of the killer feature of sprite kit is texture atlas a

what is a texture atlas

https://developer.apple.com/library/ios/recipes/xcode_help-texture_atlas/_index.html

working with texture atlas in sprite kit is very easy.



example



#import "GameScene.h"

@implementation GameScene
{
    UIImage *defaultImg;
    int MCrow;
    int MCcoloum;
    float imgWidth;
    float imgHeight;
    NSArray *atlasArray;
    NSMutableArray *fetchedAtlas;
    NSDictionary *dict1;
    NSDictionary *dict2;
    NSDictionary *dict3;
    NSDictionary *dict4;
    NSDictionary *dict5;
    NSDictionary *dict6;
    NSDictionary *dict7;
    SKSpriteNode *node;

}
-(void)didMoveToView:(SKView *)view {
    /* Setup your scene here */

    MCrow=3;
    MCcoloum=3;


 /*
loading all texture atlas in memory after ten second


*/   
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, 10 * NSEC_PER_SEC), dispatch_get_main_queue(), ^{
        [self drawAllTextures];
    });
}
-(void)drawAllTextures
{
    
/*
all my texture atlas 

*/
atlasArray=@[@"yellowseahorse",@"stingray",@"tiger",@"shark",@"mathlab",@"zipline",@"hurdies"];

//and empty array thats holds a group of textureAtlas

    
fetchedAtlas=[[NSMutableArray alloc] init];
    
    
    for(int i=0;i<[atlasArray count];i++)
    {
        //add texture atlas to a NSMutableArray 
        [fetchedAtlas addObject:[self getAtlas:atlasArray[i]]];
    }
//preload texture atlas 
    [SKTextureAtlas preloadTextureAtlases:fetchedAtlas withCompletionHandler:^{
        
        //fetch all texture from textureAtlas and add them their respective dictionary 
        dict1=[self fetchTexturesFromAtlas:fetchedAtlas[0]];
        dict2=[self fetchTexturesFromAtlas:fetchedAtlas[1]];
        dict3=[self fetchTexturesFromAtlas:fetchedAtlas[2]];
        dict4=[self fetchTexturesFromAtlas:fetchedAtlas[3]];
        dict5=[self fetchTexturesFromAtlas:fetchedAtlas[4]];
        dict6=[self fetchTexturesFromAtlas:fetchedAtlas[5]];
        dict7=[self fetchTexturesFromAtlas:fetchedAtlas[6]];
        
    }];
}
-(NSMutableDictionary*)fetchTexturesFromAtlas:(SKTextureAtlas*)atlas
{
    NSMutableDictionary *SKTextureDictionary=[[NSMutableDictionary allocinit];
    for(int i=0;i<[atlas.textureNames count];i++)
    {
        SKTexture *texture=[self createTextureFromAtlas:atlas texture:atlas.textureNames[i]];
        NSArray *fullname=[atlas.textureNames[i] componentsSeparatedByString:@"."];
        [SKTextureDictionary setObject:texture forKey:fullname[0]];
    }
    return SKTextureDictionary;
}
-(SKTexture*)createTextureFromAtlas:(SKTextureAtlas *)atlas texture:(NSString*)textureName
{
    SKTexture *spriteTexture=[atlas textureNamed:textureName];
    return spriteTexture;
}

//fetch texture atlas from memory

-(SKTextureAtlas*)getAtlas:(NSString*)name
{
    return [SKTextureAtlas atlasNamed:name];
}

//
-(void)drawObjects
{
    for (NSString* key in dict1) {
        node=[SKSpriteNode spriteNodeWithTexture:[dict1 objectForKey:key]];
        node.position=CGPointMake(400, 400);
        [self addChild:node];
       
    }
    for (NSString* key in dict2) {
        node=[SKSpriteNode spriteNodeWithTexture:[dict2 objectForKey:key]];
        node.position=CGPointMake(300, 300);
        [self addChild:node];
        
    }
    for (NSString* key in dict3) {
        node=[SKSpriteNode spriteNodeWithTexture:[dict3 objectForKey:key]];
        node.position=CGPointMake(100, 100);
        [self addChild:node];
        
    }
}





-(void)removeAllAtlas
{
//remove all reference of texture atlas and all textures 
    dict1=nil;
    dict2=nil;
    dict3=nil;
    dict4=nil;
    dict5=nil;
    dict6=nil;
    dict7=nil;
    [fetchedAtlas removeAllObjects];
    [self removeAllChildren];
     fetchedAtlas=nil;
   
    
}
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    /* Called when a touch begins */
     [self drawObjects];
  }
-(void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
    
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, 10 * NSEC_PER_SEC), dispatch_get_main_queue(), ^{
        [self removeAllAtlas];
    });
}

-(void)update:(CFTimeInterval)currentTime {
    /* Called before each frame is rendered */
    
}


@end




Comments

Popular posts from this blog

Better Memory management with PixiJS or How to manage cpu and cpu memory in PixiJS.

PixiJS is my favorite framework when i am looking for a web games specially for mobile or desktop  PixiJS is fast blazing fast and you can get a decent FPS even on older device.   so here is my optimization techniques for PixiJs 1. manage your sprites in a better way use spritesheet to reduce the draw calls create big sprite sheet which contain multiple sprites can be draw in gpu with a single draw call. use TexturePacker  https://www.codeandweb.com/texturepacker  best tool when its comes to spritesheet 2. for floating point calculation round off calculation for example let  speed = 0.75 ; let  position = 100 ; console . log ( Math . round ( speed * position )) 3. don't create very big canvas when u need a big canvas size game just try to create a small canvas and translate it. 4. its very important one managing TextureCache in memory you can get all TextureCache list by using  Object.entries(PIXI.utils.TextureCache); so even you use ap...

adding particles Effect in pixijs using https://pixijs.io/pixi-particles-editor/

adding particle in pixijs is very easy using the below tool more information can be found below https://github.com/pixijs/pixi-particles https://pixijs.io/pixi-particles-editor/ required packages  /// < reference path = "node_modules/pixi-particles/ambient.d.ts" /> import 'pixi-particles' code of particle delcare a     global variable   private emitter ?: Emitter ; const img = PIXI . Texture . from ( "./assets/images/particle.png" ); this . emitter = new Emitter ( this ,[ img ],{ "alpha" : { "start" : 0.62 , "end" : 0.39 }, "scale" : { "start" : 0.1 , "end" : 0.9 , "minimumScaleMultiplier" : 1.25 }, "color" : { "start" : "#ffff8f" , "end" : ...