- Home /
Low quality on Sprite and Line Renderer - not sharp enough
Hi there! Looking for advices and help here:
I put you in context: I'm developing a 2D game and I'm at the point of trying to show a simple "drop" animation, using a sprite of a circle made in Photoshop. I simply scale the sprite, here the example: https://gyazo.com/1b55f9f4737ee20a457e0b215e1dc5ee
If you can notice it, you will see that when it's at its smallest size (scale 1, 1, 1), it isn't sharp enough and the quality is really poor. The used sprite is a 1048x1048 PNG, so it's quite big. I've tried changing everything on the imported settings:
Changing the wrap mode, the filter mode to Point or Bilinear, etc, doesn't give any results at all. The animation is a simple scaling from 1 to 50 with a constant radius of 50. The bigger the scale, the better quality the sprite seems to have. If I use a sprite with a thicker arc, I get a smoother result, but it's not what I'm looking for. Of course, in my Project Settings I have anti-aliasing activated.
Sooo, in order to fix this sharpness problem, I tried drawing the circle using Line Renderer. This is the result:
And this is my script:
public override void UpdateShape(Vector2 newVertex) {
if (_vertices.Count < 2) {
return;
}
_vertices[_vertices.Count - 1] = newVertex;
transform.position = _vertices[0];
var v0Relative = Vector2.zero;
var v1Relative = _vertices[1] - _vertices[0];
_meshFilter.mesh = CircleMesh(v0Relative, v1Relative, FillColor);
_circleCollider2D.radius = Vector2.Distance(_vertices[0], _vertices[1]);
_lineRenderer.positionCount = _meshFilter.mesh.vertices.Length;
_lineRenderer.SetPositions(_meshFilter.mesh.vertices);
}
private static Mesh CircleMesh(Vector2 v0, Vector2 v1, Color fillColor) {
var radius = Vector2.Distance(v0, v1);
const float segmentOffset = 40f;
const float segmentMultiplier = 5f;
var numSegments = (int) (radius * segmentMultiplier + segmentOffset);
var circleVertices = Enumerable.Range(0, numSegments)
.Select(i => {
var theta = 2 * Mathf.PI * i / numSegments;
return new Vector2(Mathf.Cos(theta), Mathf.Sin(theta)) * radius;
})
.ToArray();
var triangles = new Triangulator(circleVertices).Triangulate();
var colors = Enumerable.Repeat(fillColor, circleVertices.Length).ToArray();
var mesh = new Mesh {
name = "Circle",
vertices = circleVertices.ToVector3(),
triangles = triangles,
colors = colors
};
mesh.RecalculateNormals();
mesh.RecalculateBounds();
mesh.RecalculateTangents();
return mesh;
}
As you can see, I still get 0 sharpness on my drawn circles using Line Renderer! Got to mention that I have tried modifiying the number of capVertices and cornerVertices, but still no results. Maybe there are special shaders to resolve this problem? I have no idea.
I'm open to any solutions and happy to hear about your advices! Thanks a lot in advance :D
Can you please edit your post and reupload you pictures? They are not present for me.
Hm that's weird, I can see them. Try these links:
· Image 1 (settings): https://answers.unity.com/storage/temp/117767-project-settings.png · Image 2 (result): https://answers.unity.com/storage/temp/117768-line-renderer.png
Just updated the post! I think now they should be visible :D
Sounds like a pixel-perfection problem. Try the recommendations from the first reply in this thread, and/or this Unity blog post.
Answer by Ennaxor · May 28, 2018 at 12:03 PM
Hey guys! Got the solution, in case someone is interested. I followed Harinezumi's answer and made the folllowing changes in my scene:
1) "Generate Mip Maps" on sprite import settings if you zoom in / out a lot.
2) Pixel perfect orthographic camera size: (Vert Resolution/Pixels per Unit) 0.5. For example: given a sprite imported with 64 Pixels per Unit, and a 1280x720 game resolution the camera size should be (720/64) 0.5 = 5.625
This was enough, phew!
Your answer
![](https://koobas.hobune.stream/wayback/20220612163548im_/https://answers.unity.com/themes/thub/images/avi.jpg)