Для будущего любительского проекта мне понадобился такой контрол как термометр. Создав собственный я решил поделиться с Вами своими «познаниями». Может кому-нибудь пригодится данный «труд».

Задача. Нужен графический элемент управления, который бы в динамике отображал изменения температуры. В самом начале я решил, что мне необходимо найти нормальный рисунок термометра в Интернете. Я долго занимался поиском подходящей картинки, уделяя внимание тому, чтобы это был рисунок, который бы не составило труда изменять в своих целях. Просмотрев существующие я понял, что найти бесплатный будет непросто. После этого пришлось самому нарисовать жалкое подобие в Paint.Net. Но суть не в том. Суть в том, что данный контрол может изменить любой, кто имеет доступ к проекту по его созданию (который я любезно и безвозмездно отдаю Вам).

Решение. Алгоритм создания собственного графического элемента управления следующий:

  • создать проект «Windows Control Library«;
  • описать  поведение только что созданного контрола;
  • скомпилировать проект.

В результате должен получиться библиотечный файл «dll» который станет возможно использовать уже в других проектах.

Вернемся к разработке. Идея такова…  При получении нового значения температуры будем очищать предыдущее изображение, потом заливать определённую часть рисунка, после чего наверх полученного рисунка будем рисовать сам рисунок термометра. Рисунок термометра должен иметь некую хитрость, а именно прозрачность только той области, которая отвечает за колбочку, в которой расширяется жидкость. Для этих целей хорошо подходит контейнер хранения изображений «.png» который позволяет хранить прозрачность. Моя художественная «.png» стряпня выглядит следующим образом:

Thermometer

Напомню, сама колбочка должна быть прозрачной (кто посмышлёней догадается, что на данном рисунке там, где колбочка, Вы видите фон моего блога). Поскольку шкала термометра есть линейной, установить прямоугольник заливки для разных не составит проблем. Я воспользовался уравнением прямой на плоскости и в результате получил следующее:

1
float yTcurr = (yTmax*(T - m_Tmin) + yTmin*(m_Tmax - T))/(m_Tmax - m_Tmin);

Тут:

  • yTmax — координата Y которой соответствует максимальное значение m_Tmax (это значение подстраивается создателем контрола под конкретное изображение термометра!);
  • yTmin — координата Y которой соответствует минимальное значение m_Tmax (это значение подстраивается создателем контрола под конкретное изображение термометра!);
  • T — это значение температуры, уоторое необходимо отобразить на термометре;
  • yTcurr — координата Y к значению которого необходимо произвести заливку изображения начиная снизу.

Рассказывать о деталях, наверное, нет необходимости. По сему перейдем к сладкому:).

Загрузка

Загрузить готовый проект контрола можно по ОТСЮДА!

P.S.

В следующей статье хочу прикрутить к созданному контролу внешний датчик температуры, с которым буду «общаться» по интерфейсу 1-Wire (кстати посредством UART или же последовательного COM порта). Думаю читателю будет интересно!