Линейный градиент с углом & amp; Прочность

Я хочу реализовать функцию в C ++ / RealBasic для создания цветового градиента по параметрам:

  1. Ширина и высота изображения
  2. 2 цвета градиента
  3. Угол (направление) градиента
  4. Сила градиента

Следующие ссылки показывают некоторые примеры желаемого выходного изображения:
http://www.artima.com/articles/linear_gradients_in_flex_4.html, http://i.stack.imgur.com/4ssfj.png

Я нашел несколько примеров, но они дают мне только вертикальные и горизонтальные градиенты, хотя я также хочу указать угол и силу.

Может кто-то помочь мне, пожалуйста?

П.С .: Я мало что знаю о геометрии !! 🙁

0

Решение

Ваш вопрос очень широк и, как есть, это довольно сложное упражнение с большим количеством кода, включая рендеринг изображений, обработку форматов изображений, запись файлов на диск и т. Д. Это не вопрос одной функции. Из-за этого я сосредотачиваюсь на создании произвольного линейного цветового градиента из 2 цветов.

Линейный цветовой градиент

Вы можете создать линейный цвет «градиент» линейная интерполяция между 2 цветами. Однако простая линейная интерполяция делает действительно резкие переходы. Для визуально более привлекательных результатов я рекомендую использовать S-образный интерполяционная кривая, как на основе интерполяции Эрмита smoothstep.

Линейный цветовой градиент

Что касается угла, вы можете определить отрезок линии по началу (p0) и конец (p1) точки цветового градиента. Давайте назовем расстояние между ними d01, так d01 = distance(p0, p1), Тогда для каждой точки пикселя p изображения, вы должны рассчитать ближайшую точку p2 на этом сегменте. Вот пример как это сделать. Затем вычислите t = distance(p0, p2) / d01, Это будет лерп параметр t в диапазоне [0, 1].
Интерполировать между 2 градиентным цветом этим t и вы получили цвет для данной точки p,

Это может быть реализовано несколькими способами. Вы можете использовать OpenGL для рендеринга изображения, а затем прочитать буфер пикселей обратно в оперативную память. Если вы не знакомы с OpenGL или процессом рендеринга, вы можете написать функцию, которая берет точку (2D-координаты пикселя) и возвращает цвет RGB — так что вы можете вычислить все пиксели изображения. Наконец, вы можете записать изображение на диск, используя формат изображения, но это уже другая история.


Ниже приведены примеры реализации C ++ 14 некоторых функций, упомянутых выше.

Простая линейная интерполяция:

template <typename T, typename U>
T lerp(const T &a, const T &b, const U &t)
{
return (U(1) - t)*a + t*b;
}

, где a а также b два значения (в данном случае цвета), которые вы хотите интерполировать, и t параметр интерполяции в диапазоне [0, 1], представляющий переход между a а также b,

Конечно, вышеупомянутая функция требует типа T который поддерживает умножение на скаляр. Вы можете просто использовать любой 3D-векторный тип для этой цели, поскольку цвета на самом деле являются координатами в цветовом пространстве.

Расстояние между двумя 2D точками:

#include <cmath>

auto length(const Point2 &p)
{
return std::sqrt(p.x*p.x + p.y*p.y);
}

auto distance(const Point2 &a, const Point2 &b)
{
Point delta = b - a;
return length(delta);
}

Изображение из https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient

0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]