{"id":464,"date":"2012-01-05T01:29:07","date_gmt":"2012-01-05T09:29:07","guid":{"rendered":"http:\/\/new.joyofprocessing.com\/blog\/?p=464"},"modified":"2012-01-03T17:35:26","modified_gmt":"2012-01-04T01:35:26","slug":"secret-round-rects","status":"publish","type":"post","link":"https:\/\/joyofprocessing.com\/blog\/2012\/01\/secret-round-rects\/","title":{"rendered":"Secret Round Rects"},"content":{"rendered":"<p><script type=\"application\/processing\">\/\/ RoundRect Demo - Jim Bumgardner\n\nsize(500,500);\nsmooth();\nbackground(255);\n\nfor (int i = 0; i < 40; ++i) \n{\n  \/\/ Random Stroke Weight\n  strokeWeight(random(1,4));\n\n  \/\/ 50% Transparent Light Fill Color\n  fill( random(128,255), random(128,255), random(128,255), 128 );\n\n  \/\/ 50% Transparent Dark Stroke Color\n  stroke( random(0,64), random(0,64), random(0,64), 128 );\n\n  \/\/ Random corner radius\n  float r = random(8,32);\n\n  \/\/ Random dimensions and positioning\n  float w = random(64,300);\n  float h = random(64,300);\n  float x = random(2, width-(w+2));\n  float y = random(2, height-(h+2));\n\n  \/\/ Draw a roundrect\n  rect(x,y,w,h, r,r,r,r);\n}\n\n<\/script><\/p>\n<div class=\"ps_cap\"><a href=\"\/showexample.php?ex=roundrect_demo\">source<\/a><\/div>\n<p>Did you know Processing has a secret feature to draw round rects, or rectangles with rounded corners?  I say <i>secret<\/i> because the feature isn&#8217;t documented on the main reference page for the rect routine.  <\/p>\n<p>The <a href=\"http:\/\/processing.googlecode.com\/svn\/trunk\/processing\/build\/javadoc\/core\/processing\/core\/PApplet.html\">JavaDoc page for PApplet<\/a>, however, briefly mentions, without explaining, two alternate versions of the rect routine:<\/p>\n<p>rect(float a, float b, float c, float d, float hr, float vr) <\/p>\n<p>rect(float a, float b, float c, float d, float tl, float tr, float bl, float br) <\/p>\n<p>Both of these routines draw rounded rectangles.  In the first, you specify the horizontal and vertical radii of the corners, this allows you to have non-circular corners that are constructed from elliptical arcs.  In the second version, which draws only circular corners, you specify the radius of each corner individually, starting with the top-left.  You can use this second routine to create unusual shapes in which not all the corners are rounded.<\/p>\n<p>This is one of a handful of hidden gems which can be found by taking a closer look at the Processing JavaDoc.  I&#8217;ll highlight others in future posts.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>source Did you know Processing has a secret feature to draw round rects, or rectangles with rounded corners? I say secret because the feature isn&#8217;t documented on the main reference page for the rect routine. The JavaDoc page for PApplet, however, briefly mentions, without explaining, two alternate versions of the rect routine: rect(float a, float [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[7,5,32],"class_list":["post-464","post","type-post","status-publish","format-standard","hentry","category-uncategorized","tag-beginner","tag-easy","tag-secret"],"_links":{"self":[{"href":"https:\/\/joyofprocessing.com\/blog\/wp-json\/wp\/v2\/posts\/464","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/joyofprocessing.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/joyofprocessing.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/joyofprocessing.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/joyofprocessing.com\/blog\/wp-json\/wp\/v2\/comments?post=464"}],"version-history":[{"count":3,"href":"https:\/\/joyofprocessing.com\/blog\/wp-json\/wp\/v2\/posts\/464\/revisions"}],"predecessor-version":[{"id":467,"href":"https:\/\/joyofprocessing.com\/blog\/wp-json\/wp\/v2\/posts\/464\/revisions\/467"}],"wp:attachment":[{"href":"https:\/\/joyofprocessing.com\/blog\/wp-json\/wp\/v2\/media?parent=464"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/joyofprocessing.com\/blog\/wp-json\/wp\/v2\/categories?post=464"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/joyofprocessing.com\/blog\/wp-json\/wp\/v2\/tags?post=464"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}