(495) 925-0049, ITShop интернет-магазин 229-0436, Учебный Центр 925-0049
  Главная страница Карта сайта Контакты
Поиск
Вход
Регистрация
Рассылки сайта
 
 
 
 
 

Delphi XE2. Знакомство с FireMonkey.

Vlad

Вот сегодня WPF мне и вспомнился при работе c FireMonkey. И пусть меня простят сторонники WPF, но FireMonkey лично для меня показалась более простой и удобной использовании. Есть, конечно, и проблемы, но о проблемах мы ещё поговорить успеем, а пока просто познакомимся с тем, какие возможности открываются перед нами при использовании FireMonkey.

В принципе о том, что FireMonkey - это потомок библиотеки VGScene от KSDev, думаю, многие уже знают. Если нет, то можете почитать сообщение на сайте KSDev где сообщается о том, что интеллектуальная собственность KSDev приобретена Embarcadero. Что тут можно сказать? Наверное то, что я искренне рад тому, что разработки нашего соотечественника нашли такое мощное применение в Embarcadero и были воплощены в виде FireMonkey.

Что касается Delphi XE2, то теперь помимо простых приложений VCL Application нам стали доступны следующие виды приложений:

  • FireMonkey HD Application - 2D-приложение
  • FireMonkey 3D Application  - приложение с 3D-графикой
  • FireMonkey HD iOS Application - 2D-приложение приложение для iOS
  • FireMonkey 3D iOS Application - 3D-приложение приложение для iOS

Следуя простому правилу "Не знаешь как работать с 2D-графикой - не суйся в 3D" я решил вначале посмотреть, что представляет из себя HD Application. А раз у меня нет iPad'а (я на него только коплю =)), то приложение будем создавать для Windows.
Итак, запускаем Delphi XE2, создаем новый проект: "File -> New -> FireMonkey HD Application". Всё, что можно заметить сразу после создания нового проекта - это немного изменившийся вид главного окна в дизайнере и, на первый взгляд, чуть-чуть другой состав палитры компонентов. То есть при создании VCL Application IDE выглядит так:

 
А при создании FireMonkey HD Application - вот так:
 
 
Но это только на первый взгляд. В действительности же все намного сложнее, если копать глубже. Например, если посмотреть модуль в котором содержится класс TButton для VCL-приложения, то мы увидим Vcl.StdCtrls (или просто StdCtrls для Delphi XE и ниже), а описание того же TButton для FireMonkey содержится уже в FMX.Controls. И всё, что роднит две казалось бы одинаковые кнопки - это только родительский класс TComponent - дальше всё другое. И эти отличия Вы почувствуете сразу же как только бросите кнопку на форму и посмотрите в Object Inspector.
 
FireMonkey по сравнению со старой доброй VCL дает нам на порядок больше возможностей для разработки красивых интерфейсов, создания анимации и т.д.
Вот, к примеру, возьмем туже кнопку TButton и прикинем сколько нам надо написать кода, чтобы при наведении курсора мыши на кнопку она меняла свою высоту, а после того как курсор будет убран высота бы возвращалась к своему первоначальному значению и при этом анимация была бы плавной, с небольшой задержкой? Задача, на самом деле простенькая, но как говориться,  "время - деньги" и хотелось бы сделать такую анимацию максимально быстро. С FireMonkey для решения этой задачи Вам даже не придется писать для этого какой-либо код - всё можно сделать, используя Object Inspector. Смотрите.
1 . Бросаем на форму кнопку TButton.
2. Переходим в Object Inspector и находим свойство Height. Можете заметить, что по-мимо того, что рядом с этим свойством появился новый значок, показывающий, что для свойства можно определить какой-либо эффект, также в Object Inspector'e появился и список выбора в котором можно выбрать вид анимации:
 
 
3. Выбираем в списке первый тип анимации - "Create New TFloatAnimation" и задаем в Object Inspector следующие значения свойств анимации:
Duration = 0,5
Enabled = True
Inverse = True
StartValue = 22
StopValue = 50
Trigger = IsMouseOver=true
TriggerInverse = IsMouseOver=false
4. Жмем F9 и любуемся только что созданной анимацией. При наведении курсора мыши на кнопку высота кнопки плавно изменяется пока не достигнет значения 50 пикселей, а после того как курсор убран высота кнопки с той же задержкой возвращается в первоначальное значение. И никакого кода. В запущенном приложение кнопка будет вести себя вот так:
 
 

На создание такой анимации у меня ушло чуть больше времени, чем длится выше представленный видео-ролик. Теперь разберемся, что мы сделали.

Во-первых, стоит отметить, что все элементы управления в FireMonkey (FMX) - это контейнеры, т.е. в любой компонент FMX можно встроить другой. И эту особенность FireMonkey Вы могли легко заметить, когда создавали свою "живую" кнопку:

 

Здесь мы создали для TButton новый дочерний компонент - анимацию. Никто вам не запретит, если захотите, взять и встроить в кнопку TButton вторую надпись в виде TLabel или хоть TPaenel. Такая вот интересная особенность.

Во-вторых, что касается свойств анимации. Для анимации TFloatAnimation можно использовать следующие свойства:

  • AnimationType - определяет тип воспроизведения анимации.
  • AutoReverse - определяет будет ли анимация воспроизводится автоматически в обратную сторону, когда значение свойства достигнет своего конечного значения (StopValue)
  • Delay - задержка в секундах после которой начнется воспроизведение анимации
  • Duration - продолжительность анимации в секундах.
  • Interpolation - тип интерполяции, используемой для расчёта промежуточных значений свойства. Для простых анимаций достаточно линейной интерполяции (itLinear)
  • Inverse - определяет будет ли анимация воспроизводиться в обратном направлении
  • Loop - определяет будет ли анимация зациклена.
  • PropertyName - имя свойства для которого применяется анимация
    StartFromCurrent - определяет будет ли анимация воспроизводиться с текущего значения свойства или от заданного в StartValue
  • StartValue и StopValue - начальное и конечное значение свойства.
  • Trigger - событие после которого запустится процесс анимации
  • TriggerInverse - событие после которого анимация пройдет в обратном направлении.
  • TFloatAnimation - это самый широко используемый в FireMonkey тип анимации.

Достаточно посмотреть на другие свойства элементов управления, поддающиеся анимации, чтобы убедиться в этом. Однако этот тип анимации не единственный. На вкладке Animations палитры компонентов Вы можете найти ещё несколько типов анимации для Ваших приложений. Например, можно сделать плавное изменение цвета какого-либо элемента на форме, используя TColorAnimation. Ниже представлен небольшой видео-ролик, демонстрирующий применение TColorAnimation для компонента TCalloutRectangle:

 
Анимацию для цвета я задал зацикленную, т.е. свойство Loop выставлено в значение True, а свойства Trigger и TriggerInverse оставил пустыми.
Кроме анимаций Вы также можете применять также для своих элементов на форме различные эффекты типа размытия, тени и т.д. Например, на рисунке ниже показан элемент TCalloutRectangle с наложенным на него эффектом тени:
 
И даже более того - для эффектов Вы также можете создавать различные информации =) В общем возможностей создать красивый и интерфейс приложения - масса.
Ну и в заключении пара слов про стили. Как вы могли заметить, в представленных выше роликах форма приложения выглядит ровно так какой мы её видели в VCL. В Delphi XE2 для приложений VCL Applications стали доступны стили оформления, которые можно настроить, например, выбрав в меню Project - Options - Application - Apperance. Выбор стиля выглядит так:
 
Так вот, FireMonkey дает намного больше возможностей по изменению стиля приложения, чем при использовании обычной VCL. В силу того, что каждый элемент в FireMonkey - это контейнер, мы в силах самостоятельно изменить стиль отрисовки любой части элемента - бордюра, заднего фона, выбрать толщину рамки и т.д. Всё это можно сделать, используя, опять же визуальный редактор. Для примера изменим задний фон для формы.  Наши бействия будут следующими:
1. Кидаем на форму компонент TStyleBook
2. В свойства формы StyleBook указываем StyleBook1.
3. Дважды кликаем по компоненты в результате чего откроется окно дизайнера:
 
 
Чтобы загрузить стиль по умолчанию необходимо нажать кнопку Load Default. Теперь самое интересное. Каждый элемент в дереве стиля определят стиль для какой-либо части компонента. Например, за стиль кнопки отвечает элемент buttonstyle за задний фон элемента - backgroundstyle и т.д.
4. Для цвета формы выбираем в дереве backgroundstyle и в Object Inspector изменяем цвет, например, на красный.
5. Жмем кнопку Apply и смотрим на форму в дизайнере:
 
 
Чтобы указать какому-либо элементу его уникальный стиль, ему необходимо указать значение свойства StyleLookup. К примеру, Вы можете применить тот же стиль backgroundstyle  для кнопки или вообще создать свою уникальную кнопку используя элементы с вкладок Shapes, Layouts, Animations и Effects палитры компонентов.
   
 Резюмируя все вышесказанное, можно сказать, что FireMonkey - это достаточно удобный фрейморк для создания красивых, информативных и удобных приложений - хотите создавайте элементы управления с анимацией, хотите - с эффетами, срабатывающими по какому-либо событию, полностью перерисовывайте стиль оформления компонентов и т.д. На ряду с этим FireMonkey достаточно прост в использовании - можно строить красивый интерфейс приложения не написав ни одной строчки кода (хотя никто не запрещает вам, если необходимо - делать тоже самое в коде приложения).
 
    Не буду лукавить и скажу, что по ходу написания статьи я также столкнулся и с некоторыми проблемами в работе. Например, не всегда удавалось с первого раза открыть дизайнер стиля у TStyleBook. Мелочь, но тем не менее присутствует. Или в случае с анимацией мне так и не удалось повесить нормально на эффект TShadow анимацию TFloatAnimation - вроде бы и срабатывает анимация, но только не по событию, а только в зацикленом режиме. Были найдены и другие проблемы о которых разработчики писали в своих блогах и на форумах. Однако не стоит забывать, что FireMonkey ещё не исполнилось и 1 месяца и, если эта платформа приживется (а я очень на это надеюсь), то в ближайшем будущем мы увидим обновления и платформа станет ещё мощнее и удобнее в использовании.

Ссылки по теме


 Распечатать »
 Правила публикации »
  Обсудить материал в конференции Embarcadero »
Написать редактору 
 Рекомендовать » Дата публикации: 11.11.2011 
 

Магазин программного обеспечения   WWW.ITSHOP.RU
Enterprise Connectors (1 Year term)
Delphi Professional Named User
Enterprise Connectors (1 Year term)
Stimulsoft Reports.Ultimate Single License Includes one year subscription
SmartBear AQtime Pro - Node-Locked License (Includes 1 Year Maintenance)
 
Другие предложения...
 
Курсы обучения   WWW.ITSHOP.RU
 
Другие предложения...
 
Магазин сертификационных экзаменов   WWW.ITSHOP.RU
 
Другие предложения...
 
3D Принтеры | 3D Печать   WWW.ITSHOP.RU
 
Другие предложения...
 
Новости по теме
 
Рассылки Subscribe.ru
Информационные технологии: CASE, RAD, ERP, OLAP
Новости ITShop.ru - ПО, книги, документация, курсы обучения
Программирование на Microsoft Access
CASE-технологии
OS Linux для начинающих. Новости + статьи + обзоры + ссылки
СУБД Oracle "с нуля"
eManual - электронные книги и техническая документация
 
Статьи по теме
 
Новинки каталога Download
 
Исходники
 
Документация
 
Обсуждения в форумах
Слот Биг Бэнг (6)
Большой взрыв как правящая теория сотворения мира. Теперь вы можете поиграть слот Big Bang в...
 
Отличается ли ДрифтКазино от беттинга? (57)
Друзья, давно заметил, что на Дрифте уже несколько месяцев во всю рекламируется и предлагается...
 
Подскажите лучшее онлайн казино (8)
Вот нашёл интересную игровую площадку, и это онлайн казино Вавада. Может кто что подсказать по...
 
Помощь по MS Access (345)
Доброе время суток. Случайно оказался на этом сайте, искал статьи по OLAP. Вижу, что...
 
Требуется Краснодар: Java -разрабочик (2)
Обязанности: Разработка корпоративных backend-приложений для автоматизации розничных продаж...
 
 
 



    
rambler's top100 Rambler's Top100