Question

I’ve been trying to create a sprite sheet loader for days now, and I’ve written what I feel to be a pretty solid a pretty decent algorithm for it. However when it comes to drawing the single frame I’ve cut-out of the larger sprite sheet, nothing is drawn, and at the moment I’m trying to identify where the problem is. I strongly suspect it’s in the method I use to cut out the frame. So here it is. (Maybe I over annotate my code a bit)

- (UIImage*) cutOutFrame:(UIImage *)spriteSheet frameDimensions:(CGRect)frameRect 
{ 

//create a context to do our cropping within
UIGraphicsBeginImageContext(frameRect.size);
CGContextRef currentContext = UIGraphicsGetCurrentContext();

//now we create a CGRect to crop our new Context down to the size of the sprite we're about to place in it. Make the X&Ycoordinates 0,0 so that we clip at the beginning of the context. Then the height and width need to be the height and width of our sprite.
CGRect rectForContextClip = CGRectMake(0, 0, frameRect.size.width, frameRect.size.height);
//now clip the context to nothing but rectForContextClip
CGContextClipToRect(currentContext, rectForContextClip);

//create a rect the size of the spritesheet to draw out sprite sheet into. We will then put the sprite sheet ontop of our frame-sized context and make a UIImage out of JUST THAT. This CGRect however is mainly to control the offset
//This is important as we need to be drawing the right frame into our context below
CGRect drawRect = CGRectMake(frameRect.origin.x, 
                             frameRect.origin.y, 
                             spriteSheet.size.width, 
                             spriteSheet.size.height);

//draw the spritesheet to our clipped context
CGContextDrawImage(currentContext, drawRect, spriteSheet.CGImage);

//now we simply rip this clipped context with our Frame on it into its own UIImage :D
UIImage* ourFrame = UIGraphicsGetImageFromCurrentImageContext();


//I'm assuming this clears the context and makes it not the current context anymore. Probably doesn't do the memory any harm too.
UIGraphicsEndImageContext();

NSLog(@"ourFrame dimensions /nwidth = %f/nheight = %f",ourFrame.size.width, ourFrame.size.height);

return ourFrame;
}

This cutOutFrame method is then used within another function that loops through the sprite sheet and creates an array of UIImages, each containing just one of the images contained in the sprite sheet. That method is below if anybody feels it could have a hand in the problem.

- (void) chopSpriteSheet:(UIImage*) sheetToChop
{
    //create a dictionary to hold the dictionary "frames" we loaded in from the plist file
    if(!sheetFrameData)
    {
    sheetFrameData = [[NSDictionary alloc] initWithDictionary:[coordinates valueForKey:@"frames"]];
    }

    //create an array to hold all the keys in sheetFrameData for us to iterate through
    NSArray* framesKeysArray = [[NSArray alloc]initWithArray:[sheetFrameData allKeys]];

    //loop through the elements in framesKeyArray, get the info at that key within sheetFrame Data
    for (int i=0; i<[framesKeysArray count]; i++) 
    {
            //TODO cycle through, create the UIimages for each frame and load them into the NSArray sheetFrames//UPDATE load
            //TOBEDONE with the cutOutFrame function then into the frames dictionary

        //ensure the frames dictionary is not Nil and holds enough memory to accomodate for all the images in the sprite sheet 

        //not to be confused with the frames dictionary from the plist file
        if (!frames)
        {
            frames = [[NSMutableDictionary alloc] initWithCapacity:[framesKeysArray count]];
        }

        //Shove the values found in the dictionary at the location of the key given by the corresponding entry in the framesKeyArray into the cutOutFrame function
        UIImage* frameToArray = [self cutOutFrame:sheetToChop frameDimensions:CGRectMake(
            [[[sheetFrameData valueForKey:[framesKeysArray objectAtIndex:i]] valueForKey:@"x"] floatValue], 
            [[[sheetFrameData valueForKey:[framesKeysArray objectAtIndex:i]] valueForKey:@"y"] floatValue], 
            [[[sheetFrameData valueForKey:[framesKeysArray objectAtIndex:i]] valueForKey:@"width"] floatValue],
            [[[sheetFrameData valueForKey:[framesKeysArray objectAtIndex:i]] valueForKey:@"height"] floatValue])];


        we'll then stick it all into the frames dictionary, which stores all of them as GLTextures

        [frames setValue:[[GLTexture alloc] initWithImage:frameToArray] forKey:[NSString stringWithFormat:@"frame%i", i]];



    }
    //release framesKeyArray 
    [framesKeysArray release];



}

So that’s what I have. Can you see anything in here that would cause the UIImage to be drawn blank?

P.S. in case you were wondering GLTexture is the class i am using to draw the UIImage using openGL. But Using other examples I’ve already proven to myself that this class works.

Answer 1

I think you want to do this:

CGRect drawRect = CGRectMake(-frameRect.origin.x, 
                             -frameRect.origin.y, 
                             spriteSheet.size.width, 
                             spriteSheet.size.height);

That is, draw the full image offset down and to the left so that the section you are clipping falls within the current context.

(Also, the CGContextClipToRect is unnecessary because the context will automatically clip to its bounds)