вторник, 31 марта 2009 г.

True-color иконки в тулбарах

Для любого GUI-приложения не последнее значение имеет внешний вид – дизайн интерфейса.  Мысль не новая. Но далеко не каждое приложение имеет не то, что достойный, а хотя бы минимально приемлемый дизайн. И полагаю, причина тут кроется не только в том, что разработчики не самые замечательные дизайнеры [пользовательских интерфейсов]… Но иногда дизайн-то может быть и есть, но вот интегрировать его в приложение не так-то просто.
- “У вас дизайн еззь?
- Езззь!
- За?ебизззь!” (© )
Но на этом собственно всё: дизайн, конечно, “езь”! Но интегрировать его в приложение никто не спешит.

Почти в каждом приложении есть тулбар (toolbar). И причем занимает он весьма значительное место на экране, и поэтому во многом именно он и определяет внешний вид приложения. Так что, уж если редизайнить, то начиная с тулбаров.

Первым делом, при таком раскладе хочется сменить иконки в тулбарах на truecolor. Вот об этом и пойдет речь. Недавно Begemot выдал мега-полезный пост “Где брать бесплатные иконки”, и это только сподвигнуло к давно откладываемому редизайну иконок в Aml Pages.

Но тут же нарисовалось маленькое, но весьма существенное препятствие. Тулбары в Aml Pages набиты кнопками под завязку, просто в силу того, что и возможностей в Aml Pages немало. А посему перетасовываются кнопки тулбаров у меня чуть-ли не каждую версию – регулярный такой  в общем редизайн GUI.

В Visual Studio я постоянно пользуюсь встроенным редактором тулбаров . И отказываться от этой привычки нет ни малейшего желания – несмотря на всю ограниченность этого редактора, создавать в нем кнопки, перемещать их, редактировать подписи ну и так далее достаточно просто, быстро и удобно. Но есть одно “но”. Даже в не самой старой VS 2005, и уж тем более в моей любимой VS6 сам редактор иконок поддерживает всего 16 (шестнадцать!!!) цветов. Это означает, что редактировать сами изображения нельзя, в противном случае при первом же сохранении измененного изображения вместо кульной true-color иконки получите “кастрированный” вариант в “шашнадцать” цветов.

Ну лиха беда начало – айда в Google в поисках более продвинутого редактора тулбаров. Гуглящий да обрящет! В первых же строках  нашелся искомый редактор для 7-ой студии. Но и он был не лишен недостатков: частенько привирал с фоновыми цветами, не всегда корректно импортировал тулбары из RC-файла, да и нацелен он был все-таки на то, что каждый тулбар переделывается полностью.

А при моем числе кнопок переделывать весь тулбар - работа немалая. А при том, что мои тулбары частенько и меняются, работа эта еще и будет регулярная. И еще важный для меня аспект: все-таки подавляющее большинство уже сделанных кнопок, меня устраивают более чем, и хотелось бы лишь некоторые изменить “на лету”.

Собственно было найдено следующее решение. Редактор изображений в Visual Studio из-за своей намертво-прошитой 16-цветности отпадает как класс . Но тем не менее, сам компилятор ресурсов абсолютно корректно собирает в конечный exe-шник иконки из ico-файлов, не изменяя при этом сами изображения.

ОК! То, что нужно.

  1. Глубину цвета “модных” иконок не нарушаем. Т.к. иконки расположены в отдельных ico-файлах.
  2. Можем на лету заменить только некоторые кнопки тулбаров, ручками загрузив изображение из ресурсов (через LoadImage).
  3. Ничто не заставляет редактировать весь тулбар, да причем еще “ах раз, да еще раз, еще много, много раз” в каждой новой версии.

Дизайнеры, вероятно возмутятся, читая про эти “художества”. Что ж – вы правы! Но я не дизайнер. У меня несколько иная задача: заменить только некоторые иконки в кнопках на лету, причем чтобы не приходилось править код и иконки при малейшем изменении исходников, ресурсов, расположения кнопок и.т.д. Чтоб мухи отдельно, котлеты отдельно.

Сам алгоритм решения прост до неприличия: после загрузки стандартного ресурса тулбара, наш код создает новый ImageList с более “глубокими” цветами. После чего копируют все иконки из старого ImageList`а в новый, заменяя нужные более симпатишными из включенных в ресурсы ico-файлов. И наконец, этот новый ImageList просто-напросто назначается тулбару. Упс! Всё готово! Этот код примерно выглядит так:

tb_icons_code

Пожалуй стоит сказать и о недостатках такой схемы.  Несколько неприглядно выглядят иконки “дизейбленных” кнопок.

tb_badgray

Но это уже на вкус и на цвет. Google легко выдает несколько примеров преобразования иконки в градации серого – как этот или этот. Но  эксперименты показали, что при использовании этих примеров в реальном коде, получается все равно далеко не идеально. Код примеров еще дотачивать и дотачивать до идеала напильником . Но,  хозяева-барины: можно сяк, а можно эдак, в конце концов можно вообще создать отдельный Disabled ImageList из модных иконок… Вовсе не обязательно переделывать весь тулбар снова и снова, как только понадобится улучшить всего лишь пару иконок на кнопках.

1 комментарий:

  1. Привет.

    Нужны картинки, для дизайна программок?
    Нужно подтянуть дизайн сайта? Могу иногда подключаться.

    ОтветитьУдалить