[cairo] Antialiasing and round, bevelled widgets (was: Cairo developers conference call...)

[Carl Worth]

On Sun, 17 Oct 2004 21:31:37 -0400, Andrew Johnson wrote:
> > Users (developers) are not stupid.  If the user (developer) wants something,
> > it is Cairo's job to provide it---not question their need.
> 
> I definitely agree with this, and that has been my primary concern with
> this several times repeated topic, too presume there is no use
> whatsoever for aliased lines is to also limit what MIGHT be done with
> them, simply because you can't think of any good reason yourself.

I agree that cairo should let users draw what they want to, but it is
important to find out what the user really wants which might be
different than what she thinks she wants.

> I can think of one good example of the flaws in Cairo always
> anti-aliasing simply with toolkits and themes - widget edges.

What's the flaw here?

> A radio button in a traditional theme is an inset beveled circle of some
> sort, produced by alternating arcs. Usually you have 4 arcs of
> alternating colours. With Cairo this means you have to draw arc 1, set
> colour/line thickness, stroke, draw arc 2, set colour/line thickness
> stroke. etc. What this produces is overlapping Anti-Aliasing which
> causes a loss of definition which instead of creating a sharply defined
> edge, causes a soft subtler edge.

Have you actually tried this and found it objectionable?

I will admit that there is some error accumulation as multiple objects
pile up on the same pixels with each object being antialiased
independently. But that kind of error is much, much smaller than the
errors from not performing antialiasing at all.

I just augmented cairo-demo/png/bevels.c to include round objects
similar to the previous squares. I've attached the resulting image.

I won't bother attaching the code again. The only interesting part is
carefully computing the circle centers and radii. As before, the value
0.5 figures prominently.

But, take a look at the attached figure. Do you find it objectionably
soft? To my eye, the circular bevels match the rectangular ones quite
nicely. The rectangular versions are pixel-precise with respect to the
corresponding non-antialiased versions. And I think the circular
versions here look quite a bit better than their corresponding
non-antialiased versions.

> Sure these issues might be partly avoided with far more advanced
> programming, but traditionally, if you want simple lines on screen, you
> draw simple lines on screen, no transforms, no matrices, no filters, no
> advanced calculations. Having to deal with such potential complexities
> for such a traditionally simple task is imo a step backwards in terms of
> usable screen rendering API.

I don't think that the code I wrote today used any "advanced
programming". I just used a little graph paper to count out the
adjustments I needed. Someone smarter than me could have put the 0.5's
in the right places with less work.

That said, I do want to consider ways to do this kind of pixel alignment
within cairo. The huge advantage that would bring is that the graphics
would work at arbitrary scales.

And, as I said before, I don't think that widget styles as in the
attached screenshot are an interesting way forward. Rather than drawing
two, pixel-wide lines in opaque paint, a much more interesting bevel
should be possible by blending a translucent gradient over a
background. That style would work over arbitrary backgrounds, would be
more naturally scalable, and could help free UI designers from
artificial rectilinear constraints.

-Carl

-------------- next part --------------
A non-text attachment was scrubbed...
Name: bevels.png
Type: image/png
Size: 1514 bytes
Desc: not available
Url : http://lists.freedesktop.org/archives/cairo/attachments/20041018/c5bbfb42/bevels.png