Bug 59213 - rounded corners don't looks smooth when background-image is a gradient
Summary: rounded corners don't looks smooth when background-image is a gradient
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: 528+ (Nightly build)
Hardware: Macintosh OS X 10.6
: P2 Normal
Assignee: Simon Fraser (smfr)
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2011-04-22 11:20 PDT by Vicki Murley
Modified: 2011-04-22 12:54 PDT (History)
2 users (show)

See Also:


Attachments
test cases for buttons with gradients as background images (160.42 KB, application/zip)
2011-04-22 11:20 PDT, Vicki Murley
no flags Details
Reduction (359 bytes, text/html)
2011-04-22 11:23 PDT, Simon Fraser (smfr)
no flags Details
Patch (14.35 KB, patch)
2011-04-22 11:59 PDT, Simon Fraser (smfr)
mitz: review+
Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Vicki Murley 2011-04-22 11:20:50 PDT
Created attachment 90729 [details]
test cases for buttons with gradients as background images

Follow up to https://bugs.webkit.org/show_bug.cgi?id=21819

When an element has rounded corners and the uses a gradient as the background image, the rounded edges don't look smooth.  Some color, from the gradient or the background color, is bleeding through the edges.

Attached two examples.  The first is the same example attached to https://bugs.webkit.org/show_bug.cgi?id=21819, plus a gradient.  The second is a slightly more complicated mock-up of iPhone-style buttons.
Comment 1 Simon Fraser (smfr) 2011-04-22 11:23:17 PDT
Created attachment 90730 [details]
Reduction
Comment 2 Simon Fraser (smfr) 2011-04-22 11:59:04 PDT
Created attachment 90736 [details]
Patch
Comment 3 mitz 2011-04-22 12:06:43 PDT
Comment on attachment 90736 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=90736&action=review

> Source/WebCore/rendering/RenderBoxModelObject.cpp:584
> +    adjustedRect.inflateX(-ceilf(1.0f / contextScale.width()));
> +    adjustedRect.inflateY(-ceilf(1.0f / contextScale.height()));

Drop the .0f
Comment 4 Simon Fraser (smfr) 2011-04-22 12:54:47 PDT
http://trac.webkit.org/changeset/84664