I am surely overlooking something, but is there an easy to draw for example only half a sprite in LibGDX? I originally thought I could do this with setBounds() but this distorts the sprite and does not clip it.
do not know if this is what you want, or is the most efficient way but that's what I happened to read your question, I hope I understand and serve you this:
Variable class:
Texture testTexture = new Texture (Gdx.files.internal("badlogic.jpg"));
In render method for example:
//batch is a SpriteBatch.
batch.draw(testTexture, 50, 50,
0, 0,
testTexture.getWidth() /2,
testTexture.getHeight());
this is the method in SrpiteBatch.class:
public void draw (Texture texture, float x, float y, int srcX, int
srcY, int srcWidth, int srcHeight)
Now for example in you sprite (simple test):
batch.draw(yourSprite.getTexture(), 50, 50,
0, 0, yourSprite.getTexture().getWidth() /2,
yourSprite.getTexture().getHeight() );
Edit Note:
to re-look the answer, I thought it would be nice to say that this makes, show only one area of the texture as you say, but perhaps should be noted that the texture remains the same size, I say this because if you texture used to detect collisions, keep in mind, that although half display, texture remains as large than the original
There was also Scissors class:
http://libgdx.badlogicgames.com/nightlies/docs/api/com/badlogic/gdx/scenes/scene2d/utils/ScissorStack.html
I think I tried it once...but it worked well on desktop and not on android...so I didn't use it. Maybe it's fixed meanwhile.
Related
Let's say that I have an Actor which has a draw method:
#Override
public void draw(Batch batch, float parentAlpha) {
super.draw(batch,parentAlpha);
sr.begin(ShapeRenderer.ShapeType.Line);
sr.setColor(Color.RED);
sr.rectLine(getX(),getY(),getX() + getWidth(),getY(),3);
sr.end();
}
As you can see, the actor also draws a red line below itself.
Now, when I zoom the camera on a stage, where the actor is, he becomes bigger - it works but his red rectangle doesn't.
When I set debug() on the Actor, it shows the debug lines and zooms them aswell.
What I'm trying to achieve?
I need to zoom the line too, along the actor.
If there's anyone who knows how to achieve this, I would be grateful ;)
Shaperenderer is similar to batch. It has own coordinate matrix.
So you need to set projection matrix on shaperenderer too.
shaperenderer.setProjectionMatrix(camera.combined);
It will probably work for you.
But while shaperenderer drawing via vertexes, lines' width may not change even when you zoom in/out.
You can change line width with openGL function.
Gdx.gl.glLineWidth(width);
And additionaly im suggesting not to use Shaperenderer because its quite expensive class and only recommended for debug drawings.
I am painting on a Panel by overriding the paintComponent -method.
class Canvas extends Panel ...
...
override def paintComponent(g: Graphics2D) {
super.paintComponent(g)
for (cmd <- commands.get) cmd.execute(g, this)
}
Okay. Inside one of the commands is this one.
case class TestCommand() {
def execute(g: java.awt.Graphics2D, c: Canvas) = {
val img = new BufferedImage(c.width, c.height, BufferedImage.TYPE_INT_RGB)
g.drawImage(img, null, 0, 0)
}
What im trying to do there is create a BufferedImage from the Graphics2D -object, so i can read the value of some pixel at location x, y.
However when this command is executed, i notice that the drawImage -method causes my panel to turn completely black, wiping everything i've drawn on it so far. I want the command to simply create a BufferedImage of what i've drawn on the panel, instead of somehow affecting the Graphics2D -object itself. What am i doing wrong here?
A Graphics2D is connected to some canvas or image. You might think of it like a brush or a pen. In this case, the graphics object you have is tied to your panel. Calling drawImage draws the image on to the panel.
If you want to draw the panel on to the image, you need a Graphics for the BufferedImage:
Graphics2D ig = img.createGraphics();
Then you need to paint the panel to the graphics. java.awt.Component provides a number of convenience methods for this type of thing, for example printAll:
c.printAll(ig);
ig.dispose(); // don't forget to dispose Graphics you've created
(Sorry, I don't really know Scala syntax, if it's different.)
Without being too presumptuous, there may be better ways to approach what you're doing. E.g. if you're doing painting to the panel, as mentioned in the comments, it's usually a good idea to do your painting on an image to begin with, then paint the image to the panel. Then you always have the image.
I have one SpriteBatch in my game, between whose batch.begin() and batch.end() I draw...
a large static background image
several game sprites
I want to clip the area in which the sprites are seen, which I've read is done using ScissorStack.
The problem is that ScissorStack appears to clip the entire SpriteBatch that's sent to the GPU. The result is that it clips my game sprites and the background image.
Question:
Must I have two separate batch.begin() and batch.end() cycles, one without clipping for the background, and another with clipping for the sprites? Or is there a way of clipping just the sprites without using ScissorStack?
If the former, then isn't it rather expensive flushing the SpriteBatch twice as many times simply in order to clip a few sprites, or is it really nothing to worry about in terms of performance?
Related question:
The calculateScissors() method in the latest source code has more parameters than I've seen documented anywhere...
calculateScissors(camera, viewportX, viewportY, viewportWidth, viewportHeight, batchTransform, area, scissor)
What is the purpose of the viewportX, viewportY, viewportWidth, viewportHeight when they appear to be duplicating the camera's viewport and area information, and are not mentioned in any docs?
Basically, I'm really confused... even after (or especially after!) testing the behaviour of different values for each of these parameters.
Any advice sought.
Instead of using a ScissorStack I resorted to using using glScissor to get the results I needed.
#Override
public void render(float delta) {
GameStage.INSTANCE.act(Gdx.graphics.getDeltaTime());
GameStage.INSTANCE.setViewport(GameGeometry.width, GameGeometry.height,
true);
GameStage.INSTANCE.getCamera().translate(
-GameStage.INSTANCE.getGutterWidth(),
-GameStage.INSTANCE.getGutterHeight(), 0);
Gdx.gl.glScissor(
(int) GameStage.INSTANCE.getGutterWidth() * 2,
(int) GameStage.INSTANCE.getGutterHeight(),
(int) Gdx.graphics.getWidth()
- (int) (GameStage.INSTANCE.getGutterWidth() * 4),
(int) Gdx.graphics.getHeight());
Gdx.gl.glDisable(GL10.GL_SCISSOR_TEST);
Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
Gdx.gl.glEnable(GL10.GL_SCISSOR_TEST);
GameStage.INSTANCE.draw();
}
Hope this helps.
I have a drawn a Circle Shape in AS3. I want to render the Circle into a Bitmap with nice/antialiased Edges. Because I want it to work on Mobile Devices (Air Apps are limited to stagequality = low) I need a workaround. Any custom shape to bitmap renderer available?
Not sure this solution would work for Air Mobile Apps, but worth looking into.
Didier Brun # ByteArray.org posted an API used to draw primitive shapes (as BitmapData, not from Vector draw calls either), which might help you get your circles to draw the way you want.
http://www.bytearray.org/?p=67
Code Snippet (from that URL):
// create the BitmapData to work on
var pixels:Raster = new Raster(320, 240, true);
// draw stuff
pixels.drawRoundRect( new Rectangle ( 20, 20, 200, 100), 18, 0xFF00FFFF );
pixels.drawRect( new Rectangle ( 70, 70, 100, 100 ), 0xFF009900 );
pixels.filledTri( 40, 40, 80, 110, 50, 30, 0xFF998811 );
pixels.aaCircle(100, 100, 40, 0x77AA88 );
pixels.circle(40, 40, 30, 0xFF000000);
pixels.line(10, 10, 60, 80, 0xFF000000 );
// show it
addChild ( new Bitmap ( pixels ) );
Hopefully the library / source code is compatible for your project! :)
Have you consider using the drawWithQuality method?
The drawWithQuality() method works exactly like the draw() method, but instead of using the Stage.quality property to determine the quality of vector rendering, you specify the quality parameter to the drawWithQuality() method.
StageQuality.LOW is going to make your bitmap quality low if you're using draw() because the source will be of low quality whether it's on the DisplayList or not.
I don't think there's a way around this.. You'll have to load in circle graphics or import images to use.
If it is only something simple as circle, you can synthesize smooth image pixel by pixel. Create BitmapData of sufficient size and loop on pixels. On every pixel, compute distance from center - if it less than circle radius - half of pixel diagonal, set pixel to circle color. If it greater than circle radius + half of pixel diagonal, call setPixel32(x, y, 0).
Pixels that won't pass both conditions are near the edge - to do exact antialiasing, you must compute how much of pixel is covered by circle. Maybe you can find some convincing simple approximation. Good luck!
Update:
OK, I think I can remember simpler approach... You can draw your circle or any shapes two times bigger than they should be, then draw that bitmap into another with scale 0.5 (set through matrix) and smoothing on. That would be supersampling 4x. If stage quality doesn't affect bitmap smoothing, it should work.
In ActionScript 3 bitmap is created from BitmapData, so you need to create if first with
_bitmapData = new BitmapData(..
BitmapData has method draw, passing DisplayObject instance (Sprite, MovieClip or other) to it as parameter, will draw it's content into BitmapData.
Example:
var c:Sprite = new Sprite();
c.graphics.clear();
c.graphics.beginFill(0x00FF00, 0.5);
c.graphics.lineStyle(2.0);
c.graphics.drawRectangle(0, 0, 100, 100);
c.graphics.endFill();
var bd:BitmapData = new BitmapData(100, 100);
bd.draw(c);
var bitmap:Bitmap = new Bitmap(bd);
I'm using the AS3 drawRoundRect function as in the following snippet:
g.lineStyle(1, 0x808080, 1, true);
g.drawRoundRect(0, 0, 100, 24, 12, 12);
As you can see, pixel hinting is on.
The problem I'm having is corners being anti-aliased way too much, they are way too blurry and not even symmetrical on the above snippet. Frankly, the drawRoundRect function draws the ugliest rounded rectangles that I've ever seen.
Is there a way to make AS3 draw more crisp rectangles?
Thanks!
:)
fills are rendered much better than lines. as you can see here:
const thickness:Number = 1;
g.beginFill(0x080808);
g.drawRoundRect(0, 0, 100, 24, 12);
g.drawRoundRect(thickness, thickness, 100 - 2 * thickness, 24 - 2 * thickness, 12 - thickness);
g.endFill();
g.lineStyle(thickness, 0x080808, 1, true);
g.drawRoundRect(0, 50, 100, 24, 12);
well, it is not SOOOOOOOOOOO unincredibly better ... :-S ... but at least its symetric ... and the smudges on the corners are more like little beads ... :-D
greetz
back2dos
I've had similar problems in the past. It usually came down to one of the movieclips along the display path not being on an even pixel. Flash then tries to render fractional pixels, which it can't do, which caused distortion and blurriness.
So, make sure all your movieclips/sprites are on an even pixel (I know you're drawing the rect on even pixels, but if the displayobject it belongs to, or any of its parents aren't on an even pixel, it would be causing the problem).
I've had the same deal, as well. One hacky trick you could try is to apply a minor blur filter to the parenting object.
It looks like you're using the drawRoundRect method of the Graphics class.
If the object you're working with is a UIComponent, you could try using the drawRoundRect method of UIComponent. It takes an Object for the cornerRadius value, rather than setting ellipse width and height values. I'm not 100% sure that the cornerRadius value isn't converted into ellipse width and height, but it seems like it'd be something to try.
Also, you could try the GraphicsUtil class's drawRoundRectComplex. It takes a Number for each corner's radius. Again, not completely sure that it doesn't eventually use the same underlying mechanics as drawRoundRect.
When you using drawRoundRect set X to be half of thickness, and then thickness will be on rounded pixel. In this your case try:
g.lineStyle(1, 0x808080, 1, true);
g.drawRoundRect(0.5, 0.5, 99, 23, 12, 12);