A user account is required in order to edit this wiki, but we've had to disable public user registrations due to spam.

To request an account, ask an autoconfirmed user on Chat (such as one of these permanent autoconfirmed members).

CanvasRoundRect

From WHATWG Wiki
Jump to navigation Jump to search

Proposal to add roundRect() to Path2D.

Abstract

Roundrects are everywhere, a single call in Path2D to create a round rect can be accelerated as it lets the underlying platform know of the intent to draw a round rect, as opposed to merely composing a round rect from a series of individual paths.

Description

Follow http://dev.w3.org/csswg/css-backgrounds/#border-radius the rules for css border radius.

Motivation

  • Speed. TODO - Add some perf measurements against either native skia, or a patch against blink showing the perf increase.
  • Ease of use.
  • TODO find examples of roundrect in other apis.


WebIDL

[
    NoInterfaceObject, // Always used on target of 'implements'
] interface CanvasPathMethods {
    ...
    [RaisesException] void roundRect(unrestricted float x, unrestricted float y, unrestricted float width, unrestricted float height, 
        unrestricted float radius);
    [RaisesException] void roundRect(unrestricted float x, unrestricted float y, unrestricted float width, unrestricted float height,
        unrestricted float rh, unrestricted float rv);
    [RaisesException] void roundRect(unrestricted float x, unrestricted float y, unrestricted float width, unrestricted float height,
        unrestricted float rtl, unrestricted float rtr, unrestricted float rbr, unrestricted float rbl);
    [RaisesException] void roundRect(unrestricted float x, unrestricted float y, unrestricted float width, unrestricted float height,
        unrestricted float rtlh, unrestricted float rtlv,
        unrestricted float rtrh, unrestricted float rtrv,
        unrestricted float rbrh, unrestricted float rbrv,
        unrestricted float rblh, unrestricted float rblv);
    ...
};

Details

 roundRect(x, y, width, height, radius)
 roundRect(x, y, width, height, radius, rh, rv);
 roundRect(x, y, width, height, radius, rtl, rtr, rbr, rbl);
 roundRect(x, y, width, height, radius, rh, rv, rtlh, rtlv, rtrh, rtrv, rbrh, rbrv, rblh, rblv);


Open Questions

  • Should these calls be RaisesException? Alternatively they could do nothing for invalid inputs, i.e. negative radii.