Еще один подход к созданию интерфейса «Умного дома»
Доброго времени суток, сегодня я хочу рассказать вам сказку
про умный домJ
Точнее сказать про скромную фирму Incendo Technology и ее скромный, не особо
разрекламированный продукт – Vectir. В этой статье я не стану рассказывать как
устроен у меня «умный дом», я хочу вам рассказать о том как с помощью данной программки
сделать легко то, что вообще говоря сделать сложно – красивый интерфейс для
умного домаJ И
так, кому интересно прошу под кат!
P.S. осторожно много буков\картинок\мегабайтовJ
Для начала лирическое отступление. Почему я назвал
разработчиков скромными, потому как Vectir отличный продукт, весь функционал
которого помещается в бесплатной версии. А его платная версия с пожизненными
обновлениями стоит 180 вечно деревянных рублейJ.
К тому же особенность этой программки, о
которой я расскажу в статье вообще не расписана в рекламе как что то особенное,
но это не такJ
И так, посмотрим из чего устроен данный продукт, в нем есть:
·
Клиент – приложение на Android, Windows Phone 8,
BlackBerry. И даJ
IPhone
ты слишком много знал – не поддерживаетсяJ
·
Сервер – приложение на Windows (питается от .net 4)
Тут Линуксоводов статья может наверняка остановить, но к
сожалению сервер только для Windows.
Как мы видим ничего особенного тут нет, посмотрим как
работает приложение. Сам клиент не хранит в себе никакой информации, всю
информацию о том как и чем рулить он спрашивает у сервера по Bluetooth или WiFi, кому что больше
нравитсяJ (Вопреки
мнению что Bluetooth тормоз – медленно работает в данном случае это не так, все
грузится за доли секунды)
Вся суть приложения основана на так называемых профилях,
точнее сказать настраиваемых профилях и плагинах. Профиль – это реализация
интерфейса и описание логики, как на что реагировать. Плагины – это модули,
которые выполняют сами действия – нажимают кнопки, двигают мышкой и т.п.
В стандартном наборе у нас несколько профилей на управление
плеерами, управление питанием и просто некоторые системные функции + аналог
тачпада и можно вывести изображение с ПК в интерфейс, хотя в контексте нашей
задачи это не нужноJ
Все еще не видно ничего особенного скажет читатель,
особенность здесь в том, что каждый профиль полностью 100% изменяем, и мы можем
бесконечно (в бесплатной бесконечность = 10) много профилей сделать сами. Что
это нам дает, это дает возможность создавать интерфейс таким каким хотим самиJ
Возьмем любой профиль и войдем в меню «Edit».
Мы видим что в левой части интерфейса у нас редактор аналогичный
Windows Forms
!
Конечно тут нет такого разнообразия компонентов, но тех что
есть достаточно чтобы сделать любой красивый интерфейсJ
Что же в нем особенного, рассмотрим каждый элемент по
отдельности:
·
Panel – этот просто панель, она является контейнером, в ней можно
настроить фоновый рисунок и это будет своего рода слой.
·
TextBox – в него можно вывести любой текст или связать его с каким
либо источником данных – к примеру системное время в ПК
·
ProgressBar – так же может при определенных условиях превращаться в TrackBar
·
Button – самый полезный элементJ
Поддерживает 2 состояния – нажато и отжато, в каждом из которых задается свое
изображение, к нему привязывается потом само действие. Изображения которые
использует кнопка поддерживают Alpha прозрачность в самом лучшем смысле.
·
Imagebox – в него можно поместить изображение, в том числе полученное
от компьютера, к примеру если захочется вывести график температуры.
·
TouchPad – панелька эмулирующая мышь на ПК
·
Диалоги:
o
TextViewDialog – Этакий MessageBox в разрезе приложения
o
KeyboardDialog – Вызывает показ клавиатуры в приложении (системной)
На этом список компанентов заканчивается, и что же мы имеем:
·
Нерезиновый интерфейс – это минус. В этот момент
толпа дизайнеров пойдет на меня с виламиJ
Но легкость настройки компенсирует этот недостаток, тем более, что каждый умный
дом по своему индивидуален и создает дизайн как правило свойJ
·
Нерезиновый интерфейс – это плюс J. Дизайнер может просто
нарисовать свой красивый интерфейс в фотошопе, экспортировать каждый слой в
отдельный файл и просто разместить все слои в редакторе. В таком случае
сохранится вся прозрачность и разделение по слоям, что позволит изменять дизайн
не заходя в фотошоп, при чем использовать каждый объект\слой сколько угодно
раз.
·
Многослойность – когда мы размещаем любой объект,
к примеру ImageBox он становится контейнером, размещая в нем другие элементы мы
можем потом переносить исходный объект со всем что в нем находится, это очень
помогает при разработке сложных интерфейсов. В каждом слое сохраняется
прозрачность сколько бы слоев не было на экране, все обрисовываются идеальноJ
·
В кнопке 2 состояния, поэтому можно настроить 2
изображения, элементы станут динамичными а не просто картинки.
Имеем кажется не так много, но этого достаточно, чтобы
портировать любой дизайн с сохранением разбивки на слои из любой картинки в
фотошопе с минимальными трудозатратами.
Картинки честно украдены с других сайтов, но подобное вполне
укладывается в вышеперечисленную концепцию.
Дизайн своего «творенья» я пока размещать не готовJ
На данном этапе нетерпеливый читатель уже скачал себе
приложение, набросал пару кнопок и попытался связать это с своим «Умным домом»,
но вместо это произнес много матов в адрес автораJ
И что же тут не так, дело в том, что разработчик позиционирует свое чадо как
инструмент автоматизации неких процессов в ОС, все остальное он честно отдал на
растерзание разработчикам:)
Как именно себе это представляют авторы – использование
плагинов.
Плагин это некая библиотека написанная на C# (до .net 4 включительно), которая сделает все
на что хватит знаний программистаJ
Для тех кто знаком с C# нет сложности разобраться в SDK для разработчиков, она написана так просто. Я расскажу подробнее,
что необходимо чтобы создать плагин в следующей статье, если читателю окажется
интересной данная тема и помогу в реализации плагина, если возникнут сложностиJ
Тут я заметил, что это уже 5 страница в вордеJ Если читатель заинтересуется
данной темой я продолжу рассказывать об данном способе реализации интерфейса,
расскажу о создании плагина, о возможности обратной связи от приложения в
интерфейс (температура, графики и другая информация) и много другом в цикле
статей.
Комментарии