Создание динамического градиента для палитры цветов HSB

Я хочу создать палитру цветов в WPF/C#, аналогичную той, что я вижу в Photoshop.

альтернативный текст

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

Вышеупомянутое может быть сложнее реализовать, поскольку градиент состоит из

  • Белый - Красный
  • Белый черный
  • Черный Красный

Я могу легко создавать отдельные градиенты, но как я могу создать такой «составной» градиент?

Более простой альтернативой является наличие 3 ползунков для значений HSB.

альтернативный текст

Когда я перемещаю один ползунок, цвета на двух других ползунках должны обновляться. Любые ссылки или советы, чтобы я начал? Мне нужно найти способ вычислить цвета на двух других ползунках, когда я перемещаю один. Например. когда я перемещаю ползунок оттенка с красного на синий, насыщенность и яркость должны обновляться, скажем, от ненасыщенного до насыщенного красного до синего и от темного до светло-красного до синего.


colors c# wpf
person Jiew Meng    schedule 05.11.2010    source источник

Ответы (3)


arrow_upward
1
arrow_downward

Насчет градиента, я думаю, вы должны нарисовать его сами. Взгляните на WriteableBitmap.

Три ползунка могут быть реализованы следующим образом:

  • Реализуйте абстрактный IMultivalueConverter, который преобразует два значения цветовых компонентов в градиентную кисть. Преобразователь просто берет значения двух компонентов цвета, создает градиент третьего неизвестного значения компонента и возвращает его.
  • Выведите три конкретных преобразователя: HSToBGradientConverter, SBToHGradientConverter, BHToSGradientConverter.
  • Привязка фона дорожек слайдера с мультипривязкой на соответствующих цветовых компонентах и ​​конвертере.
person Nicolas Repiquet    schedule 05.11.2010

arrow_upward
1
arrow_downward

http://blogs.msdn.com/b/wpfsdk/archive/2006/10/26/uncommon-dialogs--font-chooser-and-color-picker-dialogs.aspx

Проверьте диалоговое окно выбора цвета. Это должно быть хорошим местом для начала.

Надеюсь, поможет!

person Eric Smith    schedule 05.11.2010

arrow_upward
0
arrow_downward

Обратите внимание, что градиент на самом деле не состоит из трех перечисленных вами вещей. Ваша проблема в том, что вы все еще думаете о цветовом пространстве RGB, на которое это похоже. На самом деле весь смысл этого квадрата в том, что он представляет собой градиент от 0 насыщенности до 100% насыщенности слева направо и от 0 яркости до 100% яркости сверху вниз.

Я бы создал квадратное изображение, а затем для каждого пикселя определил, какой насыщенности и яркости он соответствует, а затем вставил этот цвет (конечно, с информацией об оттенке).

Я предполагаю, что у вас уже есть возможность конвертировать цвета HSB в цвета RGB. Если нет, это должно быть первой точкой вызова, и алгоритмы для этого должны быть легко найдены (если не кричать, и я могу их откопать).

person Chris    schedule 05.11.2010
comment
Хм, как я могу реализовать часть по созданию квадратного изображения, а затем для каждого пикселя определить, какая насыщенность и яркость, я думаю, мне понадобится более 1 градиента. Я тоже понимаю, что коробка, как вы сказали, градиент от 0 насыщенности до 100% насыщенности слева направо и от 0 яркости до 100% яркости сверху вниз. - person Jiew Meng; 13.11.2010
comment
Предполагая, что насыщенность и яркость изменяются от 0 до 1, тогда если у вас есть квадрат размером 100 на 100, то каждый сдвинутый пиксель вправо увеличивает насыщенность на 0,01, а каждый пиксель вниз увеличивает яркость на 0,01. Таким образом, каждый пиксель будет иметь оттенок H, насыщенность 0.01*x и яркость 0.01*y. затем у вас есть цвет, полностью специфичный в пространстве HSB, и, если вам нужно, чтобы это было в RGB для рендеринга, вы просто используете функцию преобразования для этого. Возможно, я что-то упускаю из-за путаницы в этом... - person Chris; 18.11.2010