Drawing 2D rectangles with rounded corners

I am working on translating this prototype I built in HTML into Unity, but I cannot figure out how to draw the 2D rectangles that are the blocks. In HTML this was very simple: I would create an element, set its width/height, set it’s border radius (rounded corners), set its fill and stroke. I know Unity uses meshes, but is there any way I can create and manipulate them to get this effect? Maybe I need to use something other than meshes? I have been playing with the idea of making them cubes instead of 2D planes, would this be easier?

Why? It looks like all you need are some textures with alpha channel.

2 Answers

2

If your app is strictly 2d, don’t make your assets into cubes. Try to recreate your prototype with squares in Unity first. I recommend using the sprite pipeline. Then, with the textured squares, use the alpha channel to hide the curved corners.

If you are having trouble making a 2d app in Unity, post a new question about your specific issues.

So just make another texture for half a block... Or make separate corner, edge, and center tiles, then you can assemble them in any configuration you like. You're not going to run out of texture space, you can make the faces separate from the outlines and use a vertex colored shader to tint it all the different colors.

Currently Unity doesn't do 2d vector graphics out of the box; only sprites. You may want to look into RageSpline: http://u3d.as/content/freakow-/rage-spline/1DK However, you could also create a corner sprite and edge sprites, then scale the edges to fill the gaps between corners. It's not as elegant as simply specifying roundness and size, and it's not as flexible, but that's a way you could do it without spending money.

you can use this plugin to draw round rect, circle, tringle, polygon, curve in uGUI like image