earlygrey / shapedrawer Goto Github PK
View Code? Open in Web Editor NEWA library for libGDX that draws simple shapes using a batch.
License: MIT License
A library for libGDX that draws simple shapes using a batch.
License: MIT License
Any plans for dotted line support? Dotted polygons?
I have an Image
that I'm using ShapeDrawerDrawable
as the Drawable
and it doesn't seem to be applying the rotation on the image when it renders. This works fine if the Drawable
is a Texture
.
Hello. I'm largely putting this issue up so I can remember to make a PR in the future. Basically, I think it would be a great idea if ShapeDrawer can plot a given Interpolation. See https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/math/Interpolation.java.
This will be great for level editors that want to visualize a movement or tween for example. The method would look something like drawInterpolationPlot(Interpolation interpolation, float width, float height, int samples).
I don't think it would take me a lot of effort to make the PR, so long as you think it's worth doing. I'm going to do something like that with SceneComposer anyway. What are your thoughts?
I have successfully compiled my project with 'shapedrawer' and generated the apk file.
When run the application it gives error "No implementation found for java.nio.ByteBuffer ".
E/art: No implementation found for java.nio.ByteBuffer com.badlogic.gdx.graphics.g2d.Gdx2DPixmap.newPixmap(long[], int, int, int) (tried Java_com_badlogic_gdx_graphics_g2d_Gdx2DPixmap_newPixmap and Java_com_badlogic_gdx_graphics_g2d_Gdx2DPixmap_newPixmap___3JIII)
No matter which variable i use "com.badlogic.gdx.graphics.Pixmap", "com.badlogic.gdx.graphics.Texture" , "com.badlogic.gdx.graphics.g2d.Batch" it crashes giving the "No implementation found"
How do i resolve this? Please help.
Just remove the last word ("the") on this line ?
I've noticed that ShapeDrawer
has issues with the recently released libGDX 1.9.12. The tests in this repo breaks as well.
Tests I've noticed which fail are ellipse()
, polygon()
with JoinType Smooth, arc()
, path()
and graph()
with JoinType Smooth.
Here's a screenshot showing the issue:
(Left is using libGDX 1.9.10 and Right is using libGDX 1.9.12)
Hey,
I did not find a possibility to unset the texture region. Is there such an option?
In my game I only have one Batch used across multiple screens, so I'd also like to have only one ShapeDrawer.
Not every screen uses the shapedrawer and I load/unload the texture atlases for every screen on change.
I.e. I need to unset the texture region of the BatchManager somehow for the screens that do not use it, so it does not hold a reference to an old "unloaded" texture altas.
If I use BatchManager.setTextureRegion(null), there is a Nullpointer exception in this code obviously:
public TextureRegion setTextureRegion(TextureRegion region) {
TextureRegion oldRegion = this.r;
this.r = region;
float u = 0.5f * (r.getU() + r.getU2());
float v = 0.5f * (r.getV() + r.getV2());
for (int i = 0; i < verts.length; i+=VERTEX_SIZE) {
verts[i + SpriteBatch.U1] = u;
verts[i + SpriteBatch.V1] = v;
}
return oldRegion;
}
Do you have a solution to my problem or should I create a PR? (Do you want a PR for this at all?)
Thank you very much in advance!
I'm trying to find a way to draw a mitered open path with a starting line width different from the ending line width. I'm thinking the approach is likely to involve interpolating between the two line widths at the point of the join (in relation to the entire path length) and using that line width (halved) as halfLineWidth
in drawPathWithJoin
. That might be enough, if lucky?
I was wondering if there was already a way to do this and I'm just not seeing it, or if you had a different approach in mind that might work better.
https://github.com/playn/playn has amazing Shape support. You basically can draw/fill everything SVG supports. Quad curves etc.
One simple interface. Works on all platforms. Many perks like Antialias, etc.
Under the hood PlayN uses https://github.com/threerings/tripleplay which has this Shape handling. Same feature rich platform-independent support for real TTF Fonts. Not bitmap fonts.
I still can't wrap my head around the fact that libgdx isn't copying this. At least as part of a third-party library that takes out all the useful parts of https://github.com/threerings/tripleplay
I wanna draw the POINTs ) How ?
Reproducible behavior with this basic code (L55-63 the most relevant): https://pastebin.com/DjgGAXaM
When an arc rotates, it seems like we can't expect the sides to be "constant".
The current quick-fix I've found is to increase the precision of the ShapeDrawer:
sd = new ShapeDrawer(batch, skin.getRegion("white")) {
@Override
protected int estimateSidesRequired(float radiusX, float radiusY) {
return 4*super.estimateSidesRequired(radiusX, radiusY);
}
};
It would be nice to allow users to draw, say, a circle whose points "fade out" (i.e. with an alpha gradient) the further they are from the center. This would apply to any filled shape, and could even be applied to things such as lines.
Using LibGDX's Interpolation class might be interesting to allow more control on the function for the alpha according to distance.
If you want to go crazy on it, inputting any function that takes distance as a parameter could work too. Even a sin(distance)
could be fun to play with.
Hello! I'm wondering to know if, in this library, is viable to implement fill path behavior. For example, in standard Java we have the class Path2d (in float or double format) and we can easly choose between drawer.drawPath()
and drawer.fillPath()
.
This should help a lot in some personal projects, once I saw that is very hard get a result for a filled custom shape in LibGDX.
I'll try to draft something here in my fork, anyway, let me know what do you think.
Thanks in advance!
android studio has error: Could not resolve space.earlygrey:shapedrawer:2.5.0.
All the ellipses I draw in my projects need more polygon sides to look smooth. This is because I use units, so ShapeDrawer might think a circle has a radius of 4 pixels when it's actually 80 pixels. (PPU (pixels per unit) being 20 in this case)
As it is, sectors will be completely filled, from their center, all the way up their radius.
It would be very cool if one could input an "inner radius" which basically dictates how far from the center should the drawing begin from.
To have a bit more of a visualization in your head, think of a circle, with an empty hole right in its middle.
Imagine all the doughnuts the LibGDX community could benefit from!!
Version: 2.5.0
libgdx: 1.10.0
lwjgl: 3.2.3
When using shape drawer in combination with orthographic camera it does not use the projection matrix for the first 125 objects.
With the example code below it draws 124 rectangles on the bottom left hand corner of the screen and draws one rectangle on the center of the screen.
public void setup() {
camera = new OrthographicCamera();
camera.setToOrtho(false, Gdx.graphics.getWidth(), Gdx.graphics.getHeight());
camera.translate(-Gdx.graphics.getWidth() / 2f, -Gdx.graphics.getHeight() / 2f);
batch = new PolygonSpriteBatch();
Pixmap pixmap = new Pixmap(1, 1, Pixmap.Format.RGB888);
pixmap.setColor(Color.WHITE);
pixmap.drawPixel(0, 0);
shapeTexture = new Texture(pixmap);
pixmap.dispose();
TextureRegion region = new TextureRegion(shapeTexture, 0, 0, 1, 1);
shapeDrawer = new ShapeDrawer(batch, region);
}
public void render() {
ScreenUtils.clear(0, 0, 0.0f, 1);
camera.update();
batch.setProjectionMatrix(camera.combined);
shapeDrawer.update();
batch.begin();
for (int i = 0; i < 126; i++) {
shapeDrawer.rectangle(10, 10, 10, 10);
}
batch.end();
}
From debugging it looks like projection is not applied in first 125 objects than some sort of cache is flushed which applies the projection matrix to the next draws.
The expected result should be either none of the draw calls use the projection matrix or all calls use the projection matrix.
Happy to help debug / fix this issue if someone can help me pinpoint the cause.
The first time the PolygonBatchManager is hitting the vertex-cache-limit and increaseCacheSize is called (drawing the outline and then the filling of a really big circle in my case), the PolygonBatchManager stops drawing anything. When I set the texture region again, it starts working again.
I tried to find the issue but I was not able to locate the bug.
This problem does not occur with SpriteBatch/BatchManager, it only happens with PolygonSpriteBatch/PolygonBatchManager .
Any help would be very appreciated. Thanks you in advance!
Is there a way to get all the coordinates a shape is made of?
Using the rectangle()
calls with the rotation parameter produces incorrect results. The cause is presumably the following incorrect usage of the polygon()
method (the variables passed to the method don't match with the parameters):
Setting the correct scale is not super straightforward, because the rotation is applied after the scale. Something like the following could work:
float scaleFactor = (float) (0.5 / Math.sin(rotation + ShapeUtils.PI_4));
polygon(x + 0.5f*width, y + 0.5f*height, 4, width * scaleFactor, height * scaleFactor, rotation + ShapeUtils.PI_4, lineWidth, joinType);
If you want to avoid the transcendental functions, you could also use the float[]
version of polygon()
, but then you would have to create a Polygon
object beforehand to apply the rotation.
I'm porting a game from java 2d to libgdx. For lines I'm missing some parts of https://docs.oracle.com/javase/7/docs/api/java/awt/BasicStroke.html
As a workaround I draw lines a half a linewith longer on each side for CAP_SQUARE and draw filled circles on each side for CAP_ROUND.
For JOIN_ROUND I also draw circles on the points of the polygon.
I would be nice if I could set the the line end cap and the joins on the Shapedrawer object and have the line and path drawings use them automatically.
Would it be possible to add ring segments to Shapedrawer?
I have just created a custom function for myself to draw this. Maybe someone else also finds it helpful if it is in ShapeDrawer.
fun ringSegmentPolygon(): Pair<FloatArray, ShortArray> {
if (polygon != null) return polygon!!
val deltaAngle = (ang2.radian + MathUtils.PI2 - ang1.radian) % MathUtils.PI2 //ang2 might be smaller than ang1, see below explanation
val sides = max(3, ceil(deltaAngle / MathUtils.HALF_PI * 12))
val dAnglePerSide = deltaAngle / sides
// 2 points, 2 numbers (x,y) per segment
val vertex = FloatArray((sides + 1) * 2 * 2)
val triang = ShortArray(sides * 2 * 3)
var angle = ang1.radian
for (i in 0..sides) {
val cos = cos(angle)
val sin = sin(angle)
angle += dAnglePerSide
vertex[i * 4 + 0] = center.x + cos * rIn
vertex[i * 4 + 1] = center.y + sin * rIn
vertex[i * 4 + 2] = center.x + cos * rOut
vertex[i * 4 + 3] = center.y + sin * rOut
if (i < sides) {
triang[i * 6 + 0] = (i * 2 + 0).toShort()
triang[i * 6 + 1] = (i * 2 + 1).toShort()
triang[i * 6 + 2] = (i * 2 + 2).toShort()
triang[i * 6 + 3] = (i * 2 + 1).toShort()
triang[i * 6 + 4] = (i * 2 + 2).toShort()
triang[i * 6 + 5] = (i * 2 + 3).toShort()
}
}
polygon = Pair(vertex, triang)
return polygon!!
}
Explanation of the variables:
ang1.radian: starting angle in radian in range [ 0, 2PI ]
ang2.radian: end angle in radian in range [ 0, 2PI ], Note: if the segment spans from e.g. 350° (start) to 10° (end) then the end angle (10° = 0.17 radian) is smaller than starting angle (350° = 6.10 radian)
center: Point with x,y floats (center of the full circle)
rIn: radius of the inner circle
rOut: radius of the outer circle
Code is in Kotlin, let me know if you want to add it and if you need any help with the code!
Cheers, judos
Is it possible to draw a rectangle/line segment/path with rounded corners? For example, having a path of waypoints where the start and end don't have sharp corners.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.