I want to use animated sprite characters in my LibGdx Project.
I have sprite sheets and also individual images for the sprite animations.
While creating texture atlas,do I have to use sprite sheet itself or individual images for packing?
Which one is the best approach?
Currently I'm creating separate atlas for each sprite animations using individual images,and adding the pack& png files to assets folder. It is working. But I hope there is some way to efficiently use one pack file and one png file for the game.
Also I want to know about naming those individual sprite sheet images.
I'm naming it in such a way that "name_01,name_02.....etc".
Please suggest the better way of creating single texture atlas for the entire game,that contain sprite sheets and non-sprite images.
You would have to use a texture packer. https://code.google.com/archive/p/libgdx-texturepacker-gui/
Create the sprite sheet as one texture for animation and pack them.
Pack all sprite animations images into one pack file.
Get TextureAtlas from AssetManager if you want to use AssetManager or you can create object of TextureAtlas.
Then you can call getArray(gameAtlas.findRegion("resourceName"),x,y); method. That returns Array of TextureRegion which can be used as argument of Animation class.
public TextureRegion[] getArray(TextureRegion textureRegion,int column,int row){
TextureRegion[][] arrayTextureRegion= textureRegion.split(textureRegion.getRegionWidth()/column,textureRegion.getRegionHeight()/row);
TextureRegion textureRegion1[]=new TextureRegion[arrayTextureRegion[0].length*arrayTextureRegion.length];
for (int i=0;i<arrayTextureRegion.length;i++)
for (int j=0;j<arrayTextureRegion[i].length;j++)
textureRegion1[i*arrayTextureRegion[i].length+j]=arrayTextureRegion[i][j];
return textureRegion1;
}
Related
How important is it to set a texture filter?
In the book Java Game Development with LibGDX in chapter 3 they set a texture filter.
When I load video assets with the assetmanager I can't convert a textureregion to a texture to set the texture filter.
But I can however set a texture filter on the entire spritesheet like so:
textureAtlas = assetManager.get("images/packed/game.pack.atlas") // all images are found in this global static variable
textureAtlas!!.findRegion("button").texture.setFilter(Texture.TextureFilter.Linear, Texture.TextureFilter.Linear)
How important is it to set a texture filter? Is this an ok solution? How can I get the textures from the atlas?
Textures always have a filter. If you don't set one, it will have the default filter of (Nearest, Nearest). This filter is appropriate for retro graphics (pixellated look). Otherwise, you'll most likely want to use (MipMapLinearLinear, Linear). If your game is mostly done and you've identified sprite drawing as a performance bottle-neck, then you can downgrade to (MipMapLinearNearest, Linear).
When creating an atlas using the TexturePacker, there is an option for texture filter, and if you set that you don't have to set it after you load the TextureAtlas in your game. You could also add a line at the top of your pack file like this:
filter: MipMapLinearLinear,Linear
Otherwise, if you want to set it on the atlas, it is fine with a single-page atlas to do what you did, and apply the filter using a texture reference from any of the texture regions, since they are all referencing the same Texture instance. But TextureAtlases can have multiple pages, so it would be more appropriate to do this:
for (Texture texture : textureAtlas.getTextures())
texture.setFilter(...);
Edit: To add settings to a TexturePacker build, put a text file named pack.json in the directory with the source images. You only have to add the settings that you want to change from the defaults. LibGDX can read simplified json that omits quotation marks for elements with no whitespace. So to just set the texture filter, this is all you need in the file:
{
filterMin: MipMapLinearLinear,
filterMag: Linear
}
I am making a game in AS3 for a school project (using the AIR api). I have about a year's worth of experience in AS3, so i would say i'm proficient but not an expert. Anyway, i have never attempted to do sprite animations in AS3 and i'm not quite sure how to approach it.
If i create a list of bitmaps and call addChild() and removeChild() to display each frame of the animation, it would affect the framerate as these functions are not very efficient (i have tried this before and it tanked my framerate if i had too many animations going at once). I have also tried creating a list of BitmapData objects, adding a bitmap to the display list, and then pointing it to a different BitmapData each frame, but this does not seem to work at all.
So what is the best way to do this? In XNA, for example, i would create a sprite class that draws to the screen using a sprite batch, then i would create a list of sprite objects and cycle through them to create the animation. Is there any way to achieve a similar result in actionscript?
First (simple) method: you can just use multi-frame MovieClip for animation. Put an image in each frame, put a MovieClip on the stage and that's all. You can control this animation using play(), stop(), gotoAndPlay(), gotoAndStop(). It will work without much problems for a generic platform game (I did that myself long ago).
Second (advanced) method: use bitmap blitting. For each animation, create a bitmap image that holds each frame of the animation. Use this image as a source for copying pixels into your current animated object. You just need to copy a particular rectangle area inside a source bitmap that corresponds to the current frame.
The actual blitting happens here
destinationBitmapData.copyPixels(sourceBitmapData, areaRectangle, destinationPoint);
Where destinationBitmapData is your "canvas" that you're blitting to; sourceBitmapData is the source image holding all animation frames; areaRectangle is the Rectangle inside the source image defining which area to copy; destinationPoint is left-top coordinate of the copy area in your canvas.
The destination canvas can be just one small object (like your game character that is moving around) or the entire game screen with all objects. I.e. instead of blitting and adding each object separately, you can just have one big canvas and blit any necessary parts directly to it.
That said, there is already a number of various ready-made engines that use blitting and even advanced techniques like 3D acceleration for 2D sprites.
One of them is Starling.
I'm new to AS3 and I'm trying to create a simple game with it.
So far, I have been able to draw images like this:
[Embed(source = 'C:/mypath/myimage.png')]
public static var myImageClass:Class;
private var myImage:Bitmap = new myImageClass();
and then render myImage.
but that draws only a picture with no animation.
What I want is to import this picture:
and then cut the image to series of subimages and draw an animation out of them, rather than a single image. How may I do this?
Thanks!
This is called "Blitting". You could accomplish it with fairly decent results, depending on your deployment target and how many animations you require, using BitmapData.copyPixels(), but it's more ideal to use the Starling Framework, which employs Stage3D hardware acceleration.
More here:
Introducing the Starling Framework (Video tutorial)
Starling documentation
What you are looking for is SpriteSheet support. You can easily write this yourself or use existing libraries (like Starling for instance).
The idea is to draw an area of the image at each frame to actually create the animation. Depending on the format of your sprite sheet, you may have to add another file to describe the positions of each rectangle to draw.
This page explains how to implement it.
I'm making an animation of a 2D character that can walk, run, jump, bend,...
Would it be better to load one big 'spritesheet' with all the animations and just use a mask, or would loading separate files (walk, run,...) be better because you're not using a mask on such a big image every frame?
I'm not using the Stage3D features with a framework like Starling because I think the normal flash display API is fast enough and has much less bugs than the relatively new GPU frameworks.
Blitting just the character (using lock(),copyPixels(),unlock()) works pretty well.
private function updatePixels():void{
//update sprite sheet copy position based on the frame placements ons prite sheet
position.x = spriteSourceData[currentFrame].x + offset.x;
position.y = spriteSourceData[currentFrame].y + offset.y;
//draw into the bitmap displayed
displayData.lock();
displayData.fillRect(displayData.rect, 0x00FFFFFF);//clear
displayData.copyPixels(sourceData, spriteData[currentFrame], position);//copy new frame pixels
displayData.unlock();
}
//a bit about vars:
position:Point
spriteSourceData:Vector.<Rectangle> - from parsed Texture Packer data
offset:Point - front view and side view animations weren't always centred, so an offset was needed
displayData:BitmapData - pluging into a Bitmap object displayed
sourceData:BitmapData - the large sprite sheet
currentFrame:int - image index on the sprite sheet
I've done this on an older project writing a custom class loosely following what I've learned from Lee Brimelow's tutorial series Sprite Sheets and Blitting (Part 1,Part 2, Part 3)
In short, you'd use two BitmapData objects:
a large sprite sheet
a small image to display just the character (size of the largest character bounding box) to copy pixels into
In my project I had a character with front and side animations and for the sides I've used one set of animations and used the Matrix class to flip(scale and translate) the side animation accordingly. I've used TexturePacker to export the image sequence as a sprite sheet and the frame data as well as a JSON object. There is native JSON support now, so that's handy. Texture Packer isn't free but it's really worth the money (affordable, fast and does the job perfectly). I haven't used Flash CS6 yet but I imagine it's also possible to import your image sequence and export a spritesheet with the new feature.
In my experience the rule "the simpler the display list the better the performance" generally applies. Which means you should use the most specific display object that will do the job (don't use a Sprite when a Shape would be sufficient or favor Bitmaps over vectors where it makes sense).
The most extreme version of this is to only have one Bitmap display object on the stage and use copyPixels to draw all game objects into it every time you want to update the screen. It doesn't really matter what the source in the copyPixel call is, it could either be a large BitmapData acting as a sprite sheet or a small BitmapData objects representing a single frame in an animation. This method is really fast and you could easily have many hundreds of objects on screen at the same time. But using copyPixels means you can't scale or rotate a game object, so for those cases you would have to fall back to the much slower draw() method. Of course this single Bitmap method is not suitable for games where you need to attach mouse events to specfic objects in the game, but works well for shoot'em ups or platform games.
To answer your question, I think you will get better performance by using a single Bitmap display object to represent the player and a collection of BitmapData objects for all the animation frames. Then you can just change the Bitmap's bitmapData property to the frame you want to display. You can still load a large spritesheet png and then plit it up into a series of BitmapData objects during the initialization of the game.
For my project I need to copy the graphics of a Movieclip with all of its children without copying anything else into a second Movieclip. I cannot use the Bitmap classes because I need the graphics to be displayed as a vector and I cannot use a method that simply copies the clip by calling the instructor ie:
var copy:MovieClip = clip.constructor
Is there any way to copy only the display portions of a clip into another Movieclip without turning it into a bitmap?
Thanks
Cloning display objects out of the box in as3 is no easy task. Here is a tutorial explaining the several approaches that have been attempted over the years and what works and what does not:
http://www.dannyburbol.com/2009/01/movieclip-clone-flash-as3/