New issue
Advanced search Search tips

Issue 887971 link

Starred by 1 user
Status: Assigned
Owner:
fmalita@chromium.org
Cc:
michaelludwig@google.com
f...@opera.com
schenney@chromium.org
vmp...@chromium.org
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Android , Windows , Chrome , Mac
Pri: 3
Type: Bug



Sign in to add a comment

Background-image gradient hard edges are blurry in certain conditions

Project Member Reported by fmalita@chromium.org, Sep 21 
Chrome Version: ToT

What steps will reproduce the problem?
(1) huge div
(2) non-opaque border
(3) gradient background-image with hard stops (and default background-origin: padding-box;)

E.g. http://jsfiddle.net/Lmugv3ac/1/

What is the expected result?

The gradient hard edge should stay sharp.

What happens instead?

The gradient hard edge is blurry (see attached).

This affects both the software and GPU backends.
blurry_edge.png
759 bytes View Download

Comment 1 by fmalita@chromium.org, Sep 21

Cc: f...@opera.com
Splitting this specific problem from  issue 543625 .

What's going on:

  * the non-opaque border triggers background-image tiling
  * the gradient is wrapped in a SkPictureShader
  * internally, SkPictureShader limits the tile size to ~4 million pixels
  * if the actual tile size exceeds that limit, the tile resolution no longer matches the device resolution and hard edges get softened due to resampling



One thing we could investigate is detect degenerate cases like these (small number of huge tiles) and issue explicit draw commands for each tile (instead of relying on a shader for tiling).  Assuming the tiles are pixel aligned -- otherwise we'd get seaming artifacts.

Comment 2 by fmalita@chromium.org, Sep 21

Components: Internals>Skia
►

Sign in to add a comment