Find Pixel Color using Texture2DMutable on Sprite from SpriteSheet - cocos2d-x

I am trying to find out the color of a pixel on a Sprite. Using the method at the following
CCImage *testImage = new CCImage;
testImage->initWithImageFile(filename);
unsigned char *data = testImage->getData();
Then I would use the data to create a Texture2DMutable. From there I was able to achieve what I want.
Now my project's assets are being packed using TexturePacker, into a sprite sheet. Now my sprites are created using createWithSpriteFrameName. I tried using the method from the following link:
http://discuss.cocos2d-x.org/t/get-raw-image-data-from-sprite-or-texture2d/3360/2
to get a Image from my Sprite object, but I believe the texture that was rendered was incorrect. Can anyone point me in a better direction please? I am currently working with cocos2d-x 3.2.

Related

LibGdx Texture packing

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;
}

How to change bitmapdata in AS3

I'm building a spritesheet class. Hopefully this will be low hanging fruit to someone, but I'm stumped.
I have a spritesheet (.png) that I've loaded at runtime and placed a section of it on the stage using this code from within the Spritesheet class .as file ouside of the constructor method:
private function onLoad(e:Event):void
{
var loaderBmp:Bitmap = Bitmap(_loader.content);
_bmpData.copyPixels(loaderBmp.bitmapData, new Rectangle(0,0,80,80),new Point(0,0));
}
That works fine. I get my slice of the .png file displaying nicely. In my case, the spritesheet is meant for animating a character, so I need to update the BitmapData and I'm not having any luck. Here is what I'm trying this within my Main class in a function I use to alter the frame of the animation depending on the state of the character:
c._thisSpriteSheet._loader.content.bitmapData.copyPixels(loaderBmp.bitmapData, new Rectangle(0,20,50,30),new Point(0,0));
loaderBmp is a variable who's value is var loaderBmp: Bitmap = Bitmap(_spriteSheet._loader.content);
c is a reference to the Runner object that is the character.
_spriteSheet is a property of the Runner class of type Spritesheet.
_loader is a property of the c._spriteSheet and is the Loader object used when the spritesheet was instantiated.
It doesn't throw an error, but it also doesn't replace the original bitmapData object with the new one. I thought maybe this meant that I need to create a new BitmapData object and use that in the copyPixels method, but that returned the same results (nothing). When I step through the code in debug mode, everything looks like it is working, but my display object does not update with the new bitmapData. What am I tripping on?
Thanks for looking!
Well, probably no one will read this since I'm answering it so quickly, but I literally spent 3 days trying to figure this out. Sometimes trying to ask the question in a concise way helps one answer their own question, and moments later, voila!
So in case anyone has a similar issue, what I was doing wrong was that I was trying to access the BitmapData object via the Loader that originally loaded it. Then it dawned on me that I could simply reference the BitmapData directly via that property of the SpriteSheet class I had made. I think this will be pretty confusing for someone else to follow. If a moderator sees this and thinks it's junk, I don't mind it getting erased, but thought I'd keep it up anyway. The new code looked like this:
c._thisSpriteSheet._bmpDSheet.copyPixels(loaderBmp.bitmapData, new Rectangle(0,20,50,30),new Point(0,0));
and _bmpDSheet is the bitmapdata property of the class.

ActionScript3: How to make an animation out of a series of images?

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.

How to extract the shape of MovieClip?

We have a flash application that we are planning on converting to javascript. It's a pretty simple map application with an image as the background and a bunch of simple polygon movie clips that represent destinations on the map.
I would like to iterate through each movie clip and extract the shape into an array of x,y points to redraw the polygon using an external javascript function.
Is this possible with actionscript?
If you want to export the shape coordinates at author time, you can do try the JSFL script recommented by #strille or this one or export transparent images (if that's not too limiting for your application).
If you need to export the shapes at runtime, you can use the awesome as3swf library to decompile the swf and export the shapes. Have a look at the ShapeExport wiki as there are couple of handy exporters for js like JSCanvasShapeExporter and the more generic JSONShapeExporter
There are ways you can read the coordinates from an SWF. For instance, I've written a parser in PHP (link). Getting the data doesn't help though, as it turns out. The Flash painting model is different enough from the HTML5 one enough to make transfer exceeding difficult. The main obstacle I discovered is that in Flash, a path can be filled with two fill styles: one for area enclosed by the path, the other for enclosed area considered to be "outside" by the even-odd rule (e.g. the pentagon in the middle of a star). Since the HTML5 canvas let you specify only one fill style, you can't redraw shapes from Flash accurately. I was trying to create a tool that extract shapes as SVG and was getting a lot of gap and holes in the result.
Flash Player 11.6 introduced readGraphicsData() which does exactly what you ask for.
If you need to target an earlier version, then there's no simple way to read shape coordinates from a display object with ActionScript at runtime unfortunately.
If you just want to extract the shape coordinates once someone has written a jsfl script for Flash CS3 which looks like it might be able to help you out.

AS3 Is it possible to duplicate a Shape object?

I'm trying to make a shape available for duplicating. Here's an explanation of what I've done, what I'm trying to do, and where I'm stuck:
Drew a shape manually in the Flash IDE (paintbrush).
Created a new movieclip containing the shape; exports as a class.
Instantiate the class (var mc:MovieClip = new shapeMovieClip()).
Add a reference to the shape in mc that I want (var myShape:Shape = mc.getChildAt(0) as Shape;
This works perfect and I now have my shape, but how can I duplicate it without instantiating the parent MovieClip class - is it possible?
I've tried creating a new shape and using the copyFrom() graphics method with no avail, I believe this method just copies draw calls when they're made on the referenced graphics and instead I just have a reference of a shape that's already been drawn.
Right now I'm extending the movieclip as a sprite instead, instantiating, pulling the shape from the parent and saving its reference, and then nulling the sprite. Does anyone know of a better, more lightweight, strategy for duplicating Shapes in this manner?
Basically depends on whether you need to scale your shapes. If you don't, and you can work it out with a fixed sized bitmap representation of the shape, then you will get much better performance drawing your shape to a BitmapData (it's called rasterisation) and instanciating Bitmap objects (as other commenters have pointed out). The code would go something like this:
var base:Sprite = new shapeMovieClip();
var bmd:BitmapData = new BitmapData(base.width, base.height, true, 0);
bmd.draw(base);
var clip1:Bitmap = new Bitmap(bmd);
var clip2:Bitmap = new Bitmap(bmd);
If you do need to scale the clips, you will get pixelation using bitmaps. When scaling down Bitmap.smoothing can help to some extent (also when rotating), but if you need to scale up, you will probably have to use some kind of mip-mapping. This is basically creating a few bitmaps of the shape at different scale levels, and then swap them depending on the current scale. Coding this has some complexity (using a helper parent to adjust the scale can help) but it will definitely perform better than using many shape symbols (with or without a sprite parent).
This is very old, but it still comes up high in Google, so I just wanted to share a true shape duplicating method:
var shapeonstage:Shape = shapeMadeInIDE;
var g:Vector.<IGraphicsData> = shapeonstage.graphics.readGraphicsData();
var shapecopy:Shape = new Shape();
shapecopy.graphics.drawGraphicsData(g)
And boom. It works. Had to share this because it would have helped me a looooong time ago and in so many ways.
UPDATE:
There is some clarification I'd like to add why you would want to use this method, for duplicating AND for storing references to Shapes that are within an swf.
If you target a Shape object on the stage or in a movie clip, the Flash Rendering engine does something strange. It will RECYCLE Shape objects to render new graphics thus making your Shape reference point to a COMPLETELY different rendering.
For example:
Create an fla with a movieclip.
Inside the movie clip make 10 frames.
On each frame, draw a different shape
In your code, get a reference to the shape (The Shape on Frame 1)
Draw and verify your shape (draw to a bitmap then put the bmp on stage)
Now let the flash engine play for 5 frames
Draw and verify your shape again
The second time you draw your shape without EVER reassigning your shape reference, will SOMETIMES yield a completely different shape.
Just know, this little quirk can leave you pulling your hair out if you don't know what you're looking for :)