Графический интерфейс GDI в Microsoft Windows

3.2. Выбор цвета без использования палитры

Приложения, которые не хотят ничего знать про палитры, могут указывать логический цвет изображений, составляя его из RGB-компонент, указывая их количественный состав. Однако, если видеоконтроллер не работает в режиме True Color, для вывода на экран будут использованы только статические цвета или смешанные цвета, состоящие из статических цветов. В результате полученный на экране физический цвет может не соответствовать запрошенному логическому цвету.

Как указать цвет

Многие функции программного интерфейса GDI (например, функции, создающие перья и кисти) требуют в качестве одного из своих параметров ссылку на используемый цвет. Цвет указывается при помощи переменной, имеющей тип COLORREF :

Тип COLORREF определен в файле windows.h следующим образом:

В простейшем случае цвет можно определить с помощью макрокоманды RGB , комбинирующей цвет из отдельных компонент:

Эта макрокоманда упаковывает отдельные цветовые компоненты в двойное слово, причем (что важно) старший байт этого слова должен быть равен нулю (рис. 3.2).

Рис. 3.2. Представление цвета, полученное с помощью макрокоманды RGB

В файле windows.h определены также макрокоманды, извлекающие из переменной типа COLORREF, упакованной с помощью макрокоманды RGB, отдельные цветовые компоненты:

Как мы уже говорили, в зависимости от текущего цветового разрешения Windows может предоставить приложению приближенный цвет, который максимально соответствует запрошенному логическому цвету. Функция GetNearestColor возвращает для запрошенного логического цвета clrref физический цвет, составленный только из компонент чистого цвета:

Через параметр hdc необходимо передать идентификатор контекста отображения.

Системные цвета

Как выбрать цвета для объектов приложения?

Самый простой (и самый плохой) способ заключается в том, что в исходном тексте приложения вы указываете цвета как комбинации RGB-компонент. Очевидный недостаток этого способа заключается в том, что пользователь не сможет изменить эти цвета. Даже если у вас идеальный вкус и вы сможете подобрать превосходную цветовую гамму, следует учитывать, что ваше приложение может быть запущено на монохромном мониторе, где отдельные цвета преобразуются в градации серого цвета. В результате некоторые элементы изображения могут стать плохо различимыми или пропадут вовсе.

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

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

Для того чтобы узнать цвет той или иной системной компоненты экрана Windows, вы можете вызвать функцию GetSysColor :

В качестве единственного параметра следует передать этой функции идентификатор компоненты:

Идентификатор	Описание
COLOR_ACTIVEBORDER	Рамка вокруг активного окна
COLOR_ACTIVECAPTION	Заголовок активного окна
COLOR_APPWORKSPACE	Фон окна приложения MDI (приложение, использующее многооконный интерфейс)
COLOR_BACKGROUND	Окно Desktop
COLOR_BTNFACE	Кнопка
COLOR_BTNHIGHLIGHT	Выбранная кнопка
COLOR_BTNSHADOW	Тень, «отбрасываемой» кнопкой
COLOR_BTNTEXT	Текст надписи на поверхности кнопки
COLOR_CAPTIONTEXT	Текст заголовка окна, кнопки изменения размера, кнопки полосы просмотра
COLOR_GRAYTEXT	Текст серого цвета
COLOR_HIGHLIGHT	Фон выбранного элемента в органе управления
COLOR_HIGHLIGHTTEXT	Текст для выбранного органа управления
COLOR_INACTIVEBORDER	Рамка вокруг неактивного окна
COLOR_INACTIVECAPTION	Заголовок неактивного окна
COLOR_INACTIVECAPTIONTEXT	Текст заголовка для неактивного окна
COLOR_MENU	Фон меню
COLOR_MENUTEXT	Текст меню
COLOR_SCROLLBAR	Полоса просмотра
COLOR_WINDOW	Фон окна
COLOR_WINDOWFRAME	Рамка окна
COLOR_WINDOWTEXT	Текст в окне

Ваше приложение может выбрать для использования некоторые из системных цветов, при этом пользователь сможет влиять на внешний вид вашего приложения с помощью Control Panel, настраивая цвета на свой вкус.

Вы можете создать приложение, изменяющее системные цвета. Для этого обратите внимание на функцию SetSysColors :

Параметр cDspElements определяет количество элементов, для которых изменяются цвета.

Параметр lpnDspElements представляет собой указатель на массив идентификаторов элементов изображения, список которых приведен выше.

Перед вызовом функции вам надо подготовить также массив из cDspElements элементов, содержащих новые значения для цветов, передав функции адрес этого массива через параметр lpdwRgbValues.

Внесенные изменения сохраняются только до очередного перезапуска операционной системы Windows.

После вызова этой функции все запущенные приложения получают сообщение WM_SYSCOLORCHANGE , которое информирует их об изменении системных цветов. Windows также перерисовывает на экране все видимые окна.

Сообщение WM_SYSCOLORCHANGE

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

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

Сообщение WM_SYSCOLORCHANGE не имеет параметров, поэтому значения, передаваемые через wParam и lParam следует проигнорировать.

Функция ChooseColor

В составе DLL-библиотеки commdlg.dll есть функция ChooseColor , которая предназначена для выбора цвета . Эта функция выводит на экран диалоговую панель (рис. 3.3), с помощью которой пользователь может выбрать цвет из основного набора цветов «Basic Color» и дополнительного «Custom Colors». Возможность использования цветовых палитр при выборе не обеспечивается, так что с помощью этой функции можно выбирать только чистые статические или смешанные цвета.

Рис. 3.3. Диалоговая панель для выбора цвета

Если нажать на кнопку «Define Custom Colors. «, внешний вид диалоговой панели изменится (рис. 3.4).

Рис. 3.4. Расширенная диалоговая панель

Пользуясь правой половиной диалоговой панели, пользователь сможет добавить новый цвет в набор «Custom Colors» и затем выбрать его из этого набора.

Функция ChooseColor описана в файле commdlg.h:

Перед вызовом функции следует заполнить структуру CHOOSECOLOR, передав функции ее адрес через параметр lpcc.

В случае успешного выбора цвета функция возвращает TRUE. Если пользователь отказался от выбора или, если произошла ошибка, возвращается значение FALSE.

Структура CHOOSECOLOR и указатель на нее описаны в файле commdlg.h:

Опишем назначение и правила использования отдельных полей этой структуры.

Поле lStructSize заполняется перед вызовом функции. Оно должно содержать размер структуры в байтах.

Поле Flags также заполняется до вызова функции. В него следует записать флаги инициализации, влияющие на использование других полей этой структуры.

Флаг	Описание
CC_RGBINIT	Для цвета, выбранного по умолчанию, используется цвет, указанный в поле rgbResult
CC_FULLOPEN	Если указан этот флаг, на экране появляется полный вариант диалоговой панели, обеспечивающий возможность определения произвольного цвета. Если этот флаг не указан, для определения произвольного цвета пользователь должен нажать на кнопку «Define Custom Color»
CC_PREVENTFULLOPEN	Кнопка «Define Custom Color» блокируется, таким образом, при использовании этого флага пользователь не может определить произвольный цвет
CC_SHOWHELP	Флаг разрешает отображение кнопки «Help». Если указан этот флаг, в поле нельзя указывать значение hwndOwner
CC_ENABLEHOOK	Если указан этот флаг, используется функция фильтра, адрес которой указан в поле lpfnHook. С помощью этой функции можно организовать дополнительную обработку сообщений от диалоговой панели
CC_ENABLETEMPLATE	Используется шаблон диалоговой панели, определяемый содержимым поля hInstance. Адрес строки, содержащей имя шаблона, должен быть указан в поле lpTemplateName
CC_ENABLETEMPLATEHANDLE	Используется шаблон диалоговой панели, идентификатор которого записан в поле hInstance. Содержимое поля lpTemplateName игнорируется

В поле hwndOwner перед вызовом функции следует записать идентификатор окна, создавшего диалоговую панель, или NULL. В последнем случае нельзя использовать флаг CC_SHOWHELP.

Поле hInstance заполняется в тех случаях, когда приложение использует свой собственный шаблон диалоговой панели (вместо стандартного шаблона, расположенного в ресурсах DLL-библиотеки). В этом случае перед вызовом функции в это поле следует записать идентификатор модуля, содержащего шаблон диалоговой панели. В поле Flags необходимо указать флаги CC_ENABLETEMPLATE или CC_ENABLETEMPLATEHANDLE.

В поле lpTemplateName следует записать адрес текстовой строки идентификатора ресурса шаблона диалоговой панели (если этот шаблон используется).

Поле rgbResult предназначено для передачи приложению цвета, выбранного пользователем. Если записать в это поле значение NULL, сразу после вывода диалоговой панели выбора цвета по умолчанию будет выбран черный цвет. Вы, однако, можете использовать для начального выбора любой другой цвет, записав его в это поле и указав флаг CC_RGBINIT.

Перед вызовом функции вы должны подготовить массив из 16 двойных слов, содержащих цвета для использования в меню «Custom Colors». Адрес этого массива следует передать через параметр lpCustColors.

Поле lCustData используется для передачи данных функции фильтра (если она определена).

Адрес функции фильтра передается через параметр lpfnHook. Для использования функции фильтра следует указать флаг CC_ENABLEHOOK.

Безопасная палитра web, системные цвета Windows

Безопасная палитра (browser-safe palette)

Безопасная палитра, системные цвета Windows и прочая фигня

При создании изображений или подборе цветов для фона, физуалов и текста одной из проблем является правильная цветопередача на разных платформах. Броузеры вынуждены при выводе графических файлов на экран изменять их палитру. Им приходится приводить к общему знаменателю палитру всех файлов, включенных в одну страницу, а в некоторых случаях броузеру приходится также приспосабливать палитру файла к фиксированной системной палитре.

Чтобы эти неизбежные преобразования не приводили к совсем уж неприемлемым результатам, все современные броузеры пользуются при замещении палитры диффузией. Когда броузер не может правильно передать какой-либо оттенок, он подбирает похожий или смешивает несколько ближайших цветов.

Обычно это происходит при попытках видеоадаптера в режиме 256 цветов показать оттенок High Color (16 бит) или True Color (24 бита). Кроме того, каждая операционная система резервирует и переопределяет эти цвета по-своему. Да еще это зависит от модели монитора, видеокарты и степени их старости.

Короче, чтобы небыло никаких проблем с правильным визуальным восприятием картинки НЕ ПОЛЬЗУЙТЕСЬ ДОИСТОРИЧЕСКИМ ЖЕЛЕЗОМ И СОФТОМ!

На самом деле мало кто сейчас использует только эти цвета в оформлении Web-проектов, потому как на одних безопасных цветах далеко не уедешь. А уж если пользуетесь видюхами на 256 цветов, то сами виноваты.

Формирование цвета на мониторе

Аддитивным способ представления цвета (основанный на сложении): смешиваются три луча √ красный (Red), зеленый (Green), синий (Blue). Сочетание всех лучей дает белый, а их отсутствие — черный цвета. Палитра RGB используется в Web-дизайне.
Сочетание только двух из трех лучей приводит к образованию одного из трех цветов субтрактивного (основанного на вычитании) способа представления — голубой (Cyan), пурпурный (Magenta) и желтый (Yellow). Палитра CMYK используется в цветной полиграфии.

Но есть цвета, передающиеся одинаково навсем и вся (кроме старинных мониторов) — это так называемая безопасная палитра. Безопасная палитра состоит из всех возможных сочетаний 6 оттенков красного, зеленого и синего (RGB) с равномерным шагом. Таких оттенков 6х6х6=216 (остальные 40 используются в качестве системных). При использовании цветов этой палитры можно быть уверенным в том, что каждый цвет будет передан без искажений и может быть использован для графики, текста и фонов.
Для обозначения цветов безопасной палитры используются 00, 33, 66, 99, CC,. FF — для шестнадцатеричного обозначения в html и 0, 51, 102, 153, 204, 255 — для графических редакторов. Правда, некоторые графические редакторы для указания цвета используют проценты. В этом случае ряд значений выглядит как 0%, 20%, 40%, 60%, 80%, 100%. При обозначении цветов в html-документах вначале ставят знак номера #.
Красный будет обозначаться как 255, 0, 0 в Photoshop-e и #FF0000 в html.

Цвета расположены в соответствии с каталогом Pantone Colorweb. Над каждым цветом даны два значения RGB — DEC (для создания цвета в графическом редакторе) и HEX (для обозначения цвета в HTML)

255.255.204	255.255.153	255.255.102	255.255.51	255.255.0	204.204.0
FFFFCC	FFFF99	FFFF66	FFFF33	FFFF00	CCCC00

255.204.102	255.204.0	255.204.51	204.153.0	204.153.51	153.102.0
FFCC66	FFCC00	FFCC33	CC9900	CC9933	996600

255.153.0	255.153.51	204.153.102	204.102.0	153.102.51	102.51.0
FF9900	FF9933	CC9966	CC6600	996633	663300

255.204.153	255.153.102	255.102.0	204.102.51	153.51.0	102.0.0
FFCC99	FF9966	FF6600	CC6633	993300	660000

255.102.51	204.51.0	255.51.0	255.0.0	204.0.0	153.0.0
FF6633	CC3300	FF3300	FF0000	CC0000	990000

255.204.204	255.153.153	255.102.102	255.51.51	255.0.51	204.0.51
FFCCCC	FF9999	FF6666	FF3333	FF0033	CC0033

204.153.153	204.102.102	204.51.51	153.51.51	153.0.51	51.0.0
CC9999	CC6666	CC3333	993333	990033	330000

255.102.153	255.51.102	255.0.102	204.51.102	153.102.102	102.51.51
FF6699	FF3366	FF0066	CC3366	996666	663333

255.153.204	255.51.153	255.0.153	204.0.102	153.51.102	102.0.51
FF99CC	FF3399	FF0099	CC0066	993366	660033

255.102.204	255.0.204	255.51.204	204.102.153	204.0.153	153.0.102
FF66CC	FF00CC	FF33CC	CC6699	CC0099	990066

255.204.255	255.153.255	255.102.255	255.51.255	255.0.255	204.51.153
FFCCFF	FF99FF	FF66FF	FF33FF	FF00FF	CC3399

204.153.204	204.102.204	204.0.204	204.51.204	153.0.153	153.51.153
CC99CC	CC66CC	CC00CC	CC33CC	990099	993399

204.102.255	204.51.255	204.0.255	153.0.204	153.102.153	102.0.102
CC66FF	CC33FF	CC00FF	9900CC	996699	660066

204.153.255	153.51.204	153.51.255	153.0.255	102.0.153	102.51.102
CC99FF	9933CC	9933FF	9900FF	660099	663366

153.102.204	153.102.255	102.0.204	102.51.204	102.51.153	51.0.51
9966CC	9966FF	6600CC	6633CC	663399	330033

204.204.255	153.153.255	102.51.255	102.0.255	51.0.153	51.0.102
CCCCFF	9999FF	6633FF	6600FF	330099	330066

153.153.204	102.102.255	102.102.204	102.102.153	51.51.153	51.51.102
9999CC	6666FF	6666CC	666699	333399	333366

51.51.255	51.0.255	51.0.204	51.51.204	0.0.153	0.0.102
3333FF	3300FF	3300CC	3333CC	000099	000066

102.153.255	51.102.255	0.0.255	0.0.204	0.51.204	0.0.51
6699FF	3366FF	0000FF	0000CC	0033CC	000033

0.102.255	0.102.204	51.102.204	0.51.255	0.51.153	0.51.102
0066FF	0066CC	3366CC	0033FF	003399	003366

153.204.255	51.153.255	0.153.255	102.153.204	51.102.153	0.102.153
99CCFF	3399FF	0099FF	6699CC	336699	006699

102.204.255	51.204.255	0.204.255	51.153.204	0.153.204	0.51.51
66CCFF	33CCFF	00CCFF	3399CC	0099CC	003333

153.204.204	102.204.204	51.153.153	102.153.153	0.102.102	51.102.102
99CCCC	66CCCC	339999	669999	006666	336666

204.255.255	153.255.255	102.255.255	51.255.255	0.255.255	0.204.204
CCFFFF	99FFFF	66FFFF	33FFFF	00FFFF	00CCCC

153.255.204	102.255.204	51.255.204	0.255.204	51.204.204	0.153.153
99FFCC	66FFCC	33FFCC	00FFCC	33CCCC	009999

102.204.153	51.204.153	0.204.153	51.153.102	0.153.102	0.102.51
66CC99	33CC99	00CC99	339966	009966	006633

102.255.153	51.255.153	0.255.153	51.204.102	0.204.102	0.153.51
66FF99	33FF99	00FF99	33CC66	00CC66	009933

153.255.153	102.255.102	51.255.102	0.255.102	51.153.51	0.102.0
99FF99	66FF66	33FF66	00FF66	339933	006600

204.255.204	153.204.153	102.204.102	102.153.102	51.102.51	0.51.0
CCFFCC	99CC99	66CC66	669966	336633	003300

51.255.51	0.255.51	0.255.0	0.204.0	51.204.51	0.204.51
33FF33	00FF33	00FF00	00CC00	33CC33	00CC33

102.255.0	102.255.51	51.255.0	51.204.0	51.153.0	0.153.0
66FF00	66FF33	33FF00	33CC00	339900	009900

204.255.153	153.255.102	102.204.0	102.204.51	102.153.51	51.102.0
CCFF99	99FF66	66CC00	66CC33	669933	336600

153.255.0	153.255.51	153.204.102	153.204.0	153.204.51	102.153.0
99FF00	99FF33	99CC66	99CC00	99CC33	669900

204.255.102	204.255.0	204.255.51	204.204.153	102.102.51	51.51.0
CCFF66	CCFF00	CCFF33	CCCC99	666633	333300

204.204.102	204.204.51	153.153.51	153.153.102	153.153.0	102.102.0
CCCC66	CCCC33	999966	999933	999900	666600

255.255.255	204.204.204	153.153.153	102.102.102	51.51.51	0.0.0
FFFFFF	CCCCCC	999999	666666	333333	000000

Системные цвета Windows

В операционной системе Windows зарезервировано 16 цветов VGA плюс четыре цвета SVGA — светло желтый, светло зеленый, светло синий и средне серый. Остальные 236 переопределяются системой или прикладными программами.
Таким образом, если вычесть 216 цветов безопасной палитры, остается еще 20 которые могут использоваться системой для отображения «небезопасных» оттенков. Например, цветов, содержащихся в GIFе, сохраненном с адаптивной палитрой. Эти оттенки не становятся безопасными, они могут быть искажены на других платформах, но иногда могут использоваться в среде Windows.

Чтобы убедиться в отсутствии искажений, просматривайте созданный htmlL-документ, переключив видеоадаптер в режим 256 цветов. А лучше делайте красивый визуал, наплевав на досадные ограничения и все будет OK, потому как научно -технический прогресс не стоит на месте и все больше людей пользуются его достижениями, а значит увидят вашу работу так, как она задумана. Кроме того, желателен просмотр хотя бы в двух распространенных броузерах — Internet Explorer-e и Netscape Navigator-e. Но на Netscape Navigator тоже можно наплевать, так как это сделали все продвинутые web-студии 🙂 Потому, что это очень капризная программка и с ней каши не сваришь.

48 системных цветов установки «по умолчанию». Они расположены в том же порядке, что и в настройках (например, при выборе цветов фона и текста для окон и заголовков Windows). Каждый цвет описан в шестнадцати- и десятиричном виде для выбора сочетаний красного, зеленого или синего (R, G, B). Первый способ используется для указания цвета или оттенка в документах html. Второй — в графических редакторах, задающих оттенки значениями от 0 до 255 (Photoshop, CoreDraw и др.)

FF8080 R: 255 G: 128 B: 128	FFFF80 R: 255 G: 255 B: 128	80FF80 R: 128 G: 255 B: 128	00FF80 R: 000 G: 255 B: 128	80FFFF R: 128 G: 255 B: 255	0080FF R: 000 G: 128 B: 255	FF80C0 R: 255 G: 128 B: 192	FF80FF R: 255 G: 128 B: 255
FF8080 R: 255 G: 000 B: 000	FFFF00 R: 255 G: 255 B: 000	80FF00 R: 128 G: 255 B: 000	00FF40 R: 000 G: 255 B: 064	00FFFF R: 000 G: 255 B: 255	0080C0 R: 000 G: 128 B: 192	8080C0 R: 128 G: 128 B: 192	FF00FF R: 255 G: 000 B: 255
804080 R: 128 G: 064 B: 064	FF8040 R: 255 G: 128 B: 064	00FF00 R: 000 G: 255 B: 000	008080 R: 000 G: 128 B: 128	004080 R: 000 G: 064 B: 128	8080FF R: 128 G: 128 B: 255	800040 R: 128 G: 000 B: 064	FF0080 R: 255 G: 000 B: 128
800000 R: 128 G: 000 B: 000	FF8000 R: 255 G: 128 B: 000	00FF00 R: 000 G: 128 B: 000	008040 R: 000 G: 128 B: 064	0000FF R: 000 G: 000 B: 255	0000A0 R: 000 G: 000 B: 160	800080 R: 128 G: 000 B: 128	8000FF R: 128 G: 000 B: 255
400000 R: 064 G: 000 B: 000	804000 R: 128 G: 064 B: 000	004000 R: 000 G: 064 B: 000	004040 R: 000 G: 064 B: 064	000080 R: 000 G: 000 B: 128	000040 R: 000 G: 000 B: 064	400040 R: 064 G: 000 B: 064	400080 R: 064 G: 000 B: 128
000000 R: 000 G: 000 B: 000	808000 R: 128 G: 128 B: 000	808040 R: 128 G: 128 B: 064	808080 R: 128 G: 128 B: 128	408080 R: 064 G: 128 B: 128	C0C0C0 R: 192 G: 192 B: 192	400040 R: 064 G: 000 B: 064	FFFFFF R: 255 G: 255 B: 255

Смотри также:
Колористика
Компьютерная графика (теория)
Компьютерная графика (практика)
Web-дизайн — практические работы (проекты, ролики, баннеры, пиктограммы, кнопочки)