Rounded Rectangles

Rounded Rectangles

Today design tends to use rounded rectangles, since they are softer than normal rectangles and less obstrusive. So does Material-Design, which specifies a 2px radius, for the corners of cards and buttons.

To do this Material-Love provides a function that helps you on this task.

Usage

Require roundrect.lua into your project

roundrect = require "material-love.libs.roundrect"

Create a new roundrect

roundedpolygon = roundrect (x,y,w,h,xr,yr,pre,t)

• x, y: The x and y coordinates of the rectangle
• w, h: The width and height of the rectangle
• xr, yr: The radius on the x axis and in the y axis
• pre: The number of segments used to draw each corner (defaults to xr + yr)
• t: This is a table with fours booleans, that tells the function which corners it should round (defaults to {true, true, true, true})

The value returned by roundrect is a table with all the points of a polygon.

You should now draw it using love.graphics.polygon, to do this you need to unpack all the points with unpack

love.draw = function ()
    love.graphics.polygon ("fill", unpack(roundedpolygon))
    love.graphics.polygon ("line", unpack(roundedpolygon))
end

Files

The only needed file is libs/roundrect.lua