Нарисуйте линейный градиент под определенным углом

Я пытаюсь рисовать линейные градиенты с помощью libpixman, используя функцию pixman_image_create_linear_gradient(). Он отлично работает для рисования градиентов слева направо и сверху вниз, но я не понимаю, как я могу рисовать градиенты под определенным углом (0-360 градусов), как это возможно в CSS. Например, линейный градиент, повернутый на 45 градусов.

Я думаю, что для этого нужно использовать аргументы p1 и p2, потому что они определяют направление градиента, но документации нет вообще, и я не могу понять, как использовать эти два параметра для поворота градиента.

Для вертикальных градиентов я просто установил их на

p1.x = 0; p1.y = 0;
p2.x = 0; p2.y = height - 1;

А для горизонтальных градиентов я использую

p1.x = 0; p1.y = 0;
p2.x = width - 1; p2.y = 0;

Но какие значения я должен использовать для произвольного вращения? Простое применение 2D-матрицы вращения к точкам выглядит неправильно, например. при рисовании градиента 640x480 и повороте его на 45 градусов я получаю точки

p1.x = 81; p1.y = 560;
p2.x = 559; p2.y = 559;

который рисует градиент в правильном направлении, но по обе стороны от градиента есть около 80 пикселей пустого пространства, поэтому я, должно быть, делаю что-то не так.

Может ли кто-нибудь сказать мне, как сделать это правильно?

Спасибо!


person Andreas    schedule 21.02.2016    source источник


Ответы (1)


Я предполагаю, что Pixman реализует линейные градиенты так же, как это делает Cairo, учитывая, что серверная часть изображения Cairo использует Pixman, поэтому посмотрите некоторые документы для Cairo. Например, на странице http://www.cairographics.org/tutorial/ в разделе "Рисование с Cairo", подраздел "Подготовка и выбор источника" есть объяснение линейных градиентов.

Для вашего поворота на 45 градусов я бы попробовал следующее (одна точка в верхнем левом углу, другая в правом нижнем углу):

p1.x = 0; p1.y = 0;
p2.x = width - 1; p2.y = height - 1;

P.S.: Нет, я не знаю, как в CSS задаются градиенты с углом.

person Uli Schlachter    schedule 21.02.2016
comment
Верно, действительно похоже. У меня сейчас работает. Большое спасибо! - person Andreas; 21.02.2016