Draw rounded rectangles with GdiPlusX

this post is just to answer a question from mr. reed.

bob powell, in his great website site says: "the trick here is to use a graphicspath object to assemble a collection of  lines and arcs that make up the rounded rectangle shape.

arcs are used to round off the corners, so you have to position the lines 1 radius, whatever that may be, from the actual corner."


the code below shows bob's function converted to vfp and gdiplusx, to obtain this result:


local lobmp as xfcbitmap, logfx as xfcgraphics
with _screen.system.drawing as
   * create a new bitmap
   lobmp = .bitmap
   * get a graphics object for drawing
   logfx = .graphics.fromimage(lobmp)
   * clear the drawing canvas
   * draw the rounded rectangle
   =drawroundrect(logfx, .pens.blue, 20, 30, 150, 100, 20)
   * save image to file
("roundedrect.png", .imaging.imageformat.png)
/n explorer.exe roundedrect
function drawroundrect(togfx as xfcgraphics, topen as
xfcpen, ;
      tnx, tny, tnwidth, tnheight, tnradius)
   * adapted by cesar from bob powell's sample taken from

   local logpath as xfcgraphicspath
   logpath =

   with logpath
      .addline(tnx + tnradius, tny, tnx + tnwidth - (tnradius*2), tny)
      .addarc(tnx + tnwidth - (tnradius*2), tny, tnradius*2, tnradius*2, 270, 90)
      .addline(tnx + tnwidth, tny + tnradius, tnx + tnwidth, tny + tnheight - (tnradius*2))
      .addarc(tnx + tnwidth - (tnradius*2), tny + tnheight - (tnradius*2), tnradius*2, tnradius*2,0,90)
      .addline(tnx + tnwidth - (tnradius*2), tny + tnheight, tnx + tnradius, tny + tnheight)
      .addarc(tnx, tny + tnheight - (tnradius*2), tnradius*2, tnradius*2, 90, 90)
      .addline(tnx, tny + tnheight - (tnradius*2), tnx, tny + tnradius)
      .addarc(tnx, tny, tnradius*2, tnradius*2, 180, 90)
   togfx.drawpath(topen, logpath)

notice that the above function receives a xfcpen object to draw the rounded rectangle. in order to draw a filled rounded rectangle, all we need is to add a small tweak in the above function to use a brush object instead a pen, and call the fillpath function instead of drawpath.

i leave this easy exercise to you :-d








No comments:

Post a Comment