Создание линейного градиента
GDI+ позволяет создавать горизонтальные, вертикальные и диагональные линейные градиенты. По умолчанию цвет в линейном градиенте изменяется равномерно. Однако можно настроить линейный градиент таким образом, чтобы цвет меняется неоднородно.
Горизонтальные линейные градиенты
В следующем примере используется горизонтальная линейная градиентная кисть для заполнения линии, эллипса и прямоугольника:
LinearGradientBrush linGrBrush(
Point(0, 10),
Point(200, 10),
Color(255, 255, 0, 0), // opaque red
Color(255, 0, 0, 255)); // opaque blue
Pen pen(&linGrBrush);
graphics.DrawLine(&pen, 0, 10, 200, 10);
graphics.FillEllipse(&linGrBrush, 0, 30, 200, 100);
graphics.FillRectangle(&linGrBrush, 0, 155, 500, 30);
Конструктор LinearGradientBrush получает четыре аргумента: две точки и два цвета. Первая точка (0, 10) связана с первым цветом (красным), а со второй точкой (200, 10) связан второй цвет (синий). Как можно догадаться, линия, нарисованная от (0, 10) до (200, 10), постепенно меняется с красного на синий.
10s в точках (50, 10) и (200, 10) не важны. Важно то, что две точки имеют одну и ту же вторую координату — линия, соединяющая их, является горизонтальной. Эллипс и прямоугольник также постепенно меняют цвет с красного на синий в процессе перехода по горизонтальной координате от 0 до 200.
На следующем рисунке показаны линия, эллипс и прямоугольник. Обратите внимание, что градиент цвета повторяется по мере увеличения горизонтальной координаты после 200.
Настройка линейных градиентов
В предыдущем примере компоненты цвета изменяются линейно при движении с горизонтальной координаты 0 на горизонтальную координату 200. Например, точка, первая координата которой находится на полпути между 0 и 200, будет иметь синий компонент со значением на полпути от 0 до 255.
GDI+ позволяет настроить способ изменения цвета от одного края градиента к другому. Предположим, что вы хотите создать кисть градиента, цвет которой изменяется с черного на красный в соответствии со следующей таблицей.
| Горизонтальная координата | Компоненты RGB |
|---|---|
| 0 | (0, 0, 0) |
| 40 | (128, 0, 0) |
| 200 | (255, 0, 0) |
Обратите внимание, что показатель интенсивности красного компонента уменьшился наполовину, в то время как горизонтальная координата составляет всего 20 процентов пути от 0 до 200.
В следующем примере вызывается метод LinearGradientBrush::SetBlend объекта LinearGradientBrush , чтобы связать три относительные интенсивности с тремя относительными позициями. Как показано в предыдущей таблице, относительная интенсивность 0,5 связана с относительной позицией 0,2. Код заполняет эллипс и прямоугольник кистью градиента.
LinearGradientBrush linGrBrush(
Point(0, 10),
Point(200, 10),
Color(255, 0, 0, 0), // opaque black
Color(255, 255, 0, 0)); // opaque red
REAL relativeIntensities[] = {0.0f, 0.5f, 1.0f};
REAL relativePositions[] = {0.0f, 0.2f, 1.0f};
linGrBrush.SetBlend(relativeIntensities, relativePositions, 3);
graphics.FillEllipse(&linGrBrush, 0, 30, 200, 100);
graphics.FillRectangle(&linGrBrush, 0, 155, 500, 30);
На следующем рисунке показаны итоговые эллипс и прямоугольник.
Линейные градиенты по диагонали
Градиенты в предыдущих примерах были горизонтальными. Это означает, что цвет изменяется постепенно по мере перемещения по любой горизонтальной линии. Можно также определять как вертикальные градиенты, так и диагональные градиенты. Следующий код передает точки (0, 0) и (200, 100) конструктору LinearGradientBrush . Синий цвет связан с точкой (0, 0), а цвет зеленый — с (200, 100). Линия (с шириной пера 10) и эллипс заполняются линейной кистью градиента.
LinearGradientBrush linGrBrush(
Point(0, 0),
Point(200, 100),
Color(255, 0, 0, 255), // opaque blue
Color(255, 0, 255, 0)); // opaque green
Pen pen(&linGrBrush, 10);
graphics.DrawLine(&pen, 0, 0, 600, 300);
graphics.FillEllipse(&linGrBrush, 10, 100, 200, 100);
На следующем рисунке показаны линия и эллипс. Обратите внимание, что цвет эллипса изменяется постепенно по мере перемещения по любой линии, параллельной линии, проходящей через (0, 0) и (200, 100).
