Rounded Triangle?

Anyone know how to make a triangle with curved edges?

yes: use a mesh with 1 triangle, and create the texture as i did for the rounded rectangle example i’ve posted some months ago.

@YoloSwag I’m not sure what you are looking for, but I just tweaked the RoundRect class found in SoundPlus (one of Codea’s example projects) and came up with this:

-- Round Triangle

function setup()
    print("Adjust the size parameter to change the roundness of the triangle")
    parameter.integer("size",5,25)
end

function draw()
    background(40, 40, 50)

    strokeWidth(5)

    roundTri(WIDTH/2,HEIGHT/2,100,100,size)
end

function roundTri(x,y,w,h,r)
    pushStyle()
    
    insetPos = vec2(x+r,y+r)
    insetSize = vec2(w-2*r,h-2*r)
    
    --Copy fill into stroke
    local red,green,blue,a = fill()
    stroke(red,green,blue,a)
    
    if r > 0 then
        smooth()
        lineCapMode(ROUND)
        strokeWidth(r*2)

        line(insetPos.x, insetPos.y, 
             insetPos.x + insetSize.x, insetPos.y)
        line(insetPos.x, insetPos.y,
             insetPos.x+insetSize.x/2, insetPos.y + insetSize.y)
        line(insetPos.x+insetSize.x/2, insetPos.y + insetSize.y,
             insetPos.x + insetSize.x, insetPos.y)      
    end
    popStyle()
end

Hope it helps!

I have a way that works, but only for a triangle with points (0,0), (1,0) and (0.5, 1)

I will need to tweak it more to make it work better.

If you don’t need it to have a fill, then it is easier because you just draw three lines.

@JakAttak My code works by drawing 3 lines with a round cap mode. I’m curious on how you create a triangle with a fill and why it would only work on a scalene triangle. Mind posting your code?

To fill a triangle you can use a mesh

@Staples, i fill it using a normal (no rounded edges) triangle mesh slightly smaller than the rounded one so it only fills the inside. Your code also only draws scalene triangle, no?

@JakAttak It can draw any triangle. The one I shared draws an equilateral triangle. By the way, as I’m still a beginner, I was wondering if you could give an example of your code. I’m still trying to learn about meshes and I can only use them for rectangles.

Here’s code to draw a filled polygon that uses fill, stroke and strokewidth:

function polygon(...)
    local points={...}
    local verts={}
    if math.floor(#points/2)~=math.ceil(#points/2)then return end
    for i=1,#points-1,2 do
        table.insert(verts,vec2(points[i],points[i+1]))
    end
    local poly=mesh()
    poly.vertices=triangulate(verts)
    poly:setColors(fill())
    poly:draw()
    for i=1,#verts-1 do
        line(verts[i].x,verts[i].y,verts[i+1].x,verts[i+1].y)
    end
    line(verts[#verts].x,verts[#verts].y,verts[1].x,verts[1].y)
end

Use it like rect:

polygon(x1,y1,x2,y2,x3,y3)

It has an unlimited amount of edges

Draw a rounded triangle like so:

function draw()
    background(0)
    fill(255,0,0)
    stroke(255)
    strokeWidth(10)
    polygon(100,100,200,100,150,300)
end

@Staples, @YoloSwag, here is my code to draw a rounded triangle (i fixed it so you can draw any kind of triangle). you pass it three points, a fill color, and a corner radius.

--# Main
-- Rounded Triangle

function setup()
    -- roundedTrinagle(point1, point2, point3, fill color, corner radius
    tri = RoundedTriangle(vec2(100, 100), vec2(300, 200), vec2(400, 600), color(0, 127, 255), 10)
end

function draw()
    background(255, 255, 255, 255)

    tri:draw()
end

--# RoundedTriangle
RoundedTriangle = class()

function RoundedTriangle:init(p1, p2, p3, col, st)
    local bl = vec2( math.min(math.min(p1.x, p2.x), p3.x), math.min(math.min(p1.y, p2.y), p3.y) )
    local rt = vec2( math.max(math.max(p1.x, p2.x), p3.x), math.max(math.max(p1.y, p2.y), p3.y) )
    
    local w = rt.x - bl.x
    local h = rt.y - bl.y
    
    local s = st or 50
    strokeWidth(s)

    local pmesh = mesh()
    pmesh.vertices = { p1, p2, p3 }
    pmesh:setColors(color(255))
    
    local tex = image(w + s, h + s) setContext(tex)
    pushMatrix() translate(-bl.x + s / 2, -bl.y + s / 2)
    pmesh:draw()
    stroke(255)
    line(p1.x, p1.y, p2.x, p2.y) line(p2.x, p2.y, p3.x, p3.y) line(p3.x, p3.y, p1.x, p1.y)
    popMatrix()
    setContext()
    
    self.mesh = mesh()
    self.mesh.texture = tex
    self.mesh:addRect(bl.x + w / 2, bl.y + h / 2, w + s, h + s)
    self.mesh:setColors(col)
end

function RoundedTriangle:draw()
    self.mesh:draw()
end

@Coder, wow nice code! Works similar to mine but on a greater scale. Isn’t it wasteful to remake a mesh every draw though? Could be made into a class fairly easily.

Yeah it is but this was a quick attempt at a function that could be used like rect . Maybe i create one mesh in setup and then clear and re-add vertices? But that wouldn’t work with different z levels. A class it is then

@Coder Keep a local mesh, and change the vertices? Local table of meshes? Something can be done.