Re: [css3-images] Repeating oblique gradients

On Tue, Nov 30, 2010 at 9:06 AM, Leif Arne Storset <lstorset@opera.com> wrote:
>> On Nov 28, 2010, at 11:38 PM, Rik Cabanier wrote:
>>
>>> Yes, for tiling rotated gradients, there's a need to have a
>>> 'background-rotate' keyword which doesn't seem to exist.
>
> In the gradient implementation I'm working on at the moment, I've solved
> this by adding an optional spread argument to the gradient function, like
> so:
>
> linear-gradient(left top, repeat, orange 0%, white, blue 50%);
>
> The spread argument can be 'repeat', 'reflect' or 'extend' (default if not
> given). I called the default "extend" since it seemed more intuitive than
> "clamp", the internal name for it. See the attached image for a
> demonstration.
>
> I'm not formally proposing it yet, but if we want to repeat along the
> gradient line I think this is a more elegant way to express it than using
> 'background-repeat': what concerns only gradients can stay in the gradient
> function. It does require 'background-repeat: extend' in order to have
> visible effects.

For what it's worth, I'm trying to keep discrete values out of the
gradient function, because they can't be interpolated well.  You can't
do the specialized gradient interpolation between a normal and
repeating gradient, for example.  As such, if we decide we want
repeating gradients, I'd prefer Mozilla's current treatment, which is
to define a pair of repeating-*-gradient() functions.  That way we can
stick with "you can interpolate if they're the same function" (and
color-stops match).

So far, though, I don't have much evidence that this is actually
needed.  Any evidence to the contrary showing that repeating gradients
are used in practice would be appreciated - I've already got the
appropriate section of the spec written, it's just commented out.


> Rik Cabanier <cabanier@adobe.com> skreiv Mon, 29 Nov 2010 20:27:42 +0100
>
>> If a browser creator has to implement this complicated tiling for
>> gradients, he might as well implement it for all images...
>
> Supporting various spread methods is not necessarily complicated; a graphics
> library may even support it out of the box. In that case rotating raster
> images could be a bit more work, especially considering background images is
> a very old CSS feature. As mentioned by Brad Kemper, performance could be an
> issue too.

Rotating raster images is indeed relatively expensive - this is why
the image-orientation property only accepts multiples of 90deg.

~TJ

Received on Tuesday, 30 November 2010 17:26:23 UTC