Карта сайта Хакер в RSS Энциклопедия Хакера PDA версия сайта Почтовые рассылки Хакера    Хакер в ЖЖ Хакер в Twitter
Журналы Новости Форум Видео Life Xakep
Bugtrack Статьи Блог Поиск English
Антенна для WiMAX и Wi-Fi АНТЕННА ДЛЯ WIMAX И WI-FI
15.03.2010

Сегодня мы хотим тебе предложить конструкцию простой, недорогой и надежной антенны, которую можно собрать практически из подножного хлама!...
Конкурс Radmin КОНКУРС RADMIN
09.03.2010

Правильно ответь на предлагаемые вопросы и выиграй лицензию!...

XAML: умерщвление flash-а

Введение

Грядёт эра новой ОС от Microsoft - Windows Vista. Ни для кого не секрет, что в ней множество новшеств, фич и наворотов. Одна из самых важных и значимых для программера - это новомодная технология .NET. Что она из себя представляет? Это, по сути дела, виртуальная машина, подобно SUNовской, которая призвана решить множество проблем, с которыми сталкивается большинство программеров. В эту новую платформу вошли несколько языков, и каждый может найти для себя то, что ему по душе. Я не буду перечислять их названия, а расскажу об одном из них - это XAML. Вообще, весь этот замес вокруг языка назвали Windows Presentation Foundation (WPF). Всё это реализовано в третьей версии пакета Microsoft Framework (не путать с Metasploit Framework от H D Moore) и, проще говоря, представляет собой мега-улучшенный HTML+XML, если можно так выразиться. С его помощью теперь легко и просто можно создавать динамичные объекты, не прибегая к всякого рода графическим функциям. Многие обвиняют Microsoft, что, мол, опять создают свои собственные гибриды популярных технологий и пытаются навязать своё. Я скажу вот что - Microsoft, проделав громадную работу, совершенствует старые технологии и существенно тем самым облегчает жизнь программерам и дизайнерам. Использовать её либо нет, решать только тебе, и скажу сразу, игра стоит свеч. Чтобы не быть многословным, предложу посетить следующий урлик http://channel9.msdn.com/playground/wpfe/PageTurn/default.html.

Не поленись и загрузи метровый рантайм, для того чтобы увидеть лишь ту малу часть, на что способна WPF. Кстати, некоторые уже называют WPF "убийцей Flash'а". Честно говоря, технологии настолько разные в реализации, что я бы не стал их сравнивать, но с виду действительно можно подумать, что это флеш. Итак, я заинтересовал тебя, и мы едем дальше.

Что нужно?

В Windows Vista все необходимые компоненты для работы (но не разработки) уже присутствуют, но если ты, как и я, не любишь быстро перебираться на сырые и непроверенные продукты, то мы всё будем настраивать под ХР. Хотя сама Microsoft настоятельно рекомендует всё проектировать именно из-под Висты и, если это веб-ориентированное приложение, то непременно использовать седьмого осла. Но не во всём же потакать мелкомягким. Для того чтобы WPF приложения успешно работали у тебя на машине, необходимо установить Microsoft Framework 3. После установки должна появиться новая служба Windows Presentation Foundation Font Cache 3.0.0.0, так что не пугайся при виде нового процесса PresentationFontCache.exe в диспетчере задач :). Но для разработки приложений этого будет недостаточно. Если же у тебя уже стоит Microsoft Visual Studio 2005 Team Suit, то достаточно поставить Visual Studio 2005 extensions for .NET Framework 3.0 (WCF & WPF), November 2006 CTP, и при создании нового проекта в ветках дотнетовских языков (С#, VB) можно увидеть новый компонент Framework 3. Как раз в нём и будут доступны приложения WPF. Если же Microsoft Visual Studio 2005 не наблюдается у тебя на компе и ты не хочешь её ставить, могу предложить Microsoft Expression Web, Expression Blend, Expression Design, либо Expression Media (http://www.microsoft.com/products/expression/en/default.mspx). Каждая из них заточена под определённые задачи. Что интересно, сами эти продукты написаны с использованием технологии WPF. Но я бы рекомендовал использовать именно студию. Для полноценной проверки работоспособности приложения не помешало бы в самом начале установить IIS и сделать это перед установкой студии (это важно, иначе потом могут возникнуть трудности с регистрацией веб-сервера в студии), но это необязательно, всё будет работать посредством броузера.

Создаём проект

Итак, у тебя всё установлено, и ты готов приступить. Я буду использовать студию, так что запускаем её, создаём новый проект, выбираем язык программирования по вкусу (поддерживающий платформу .NET), в нём ветку .NET Framework 3 и тип проекта - XAML Browser Application (WPF). У нас будет веб-приложение, т.е. оно будет исполняться в броузере. Кстати говоря, в большинстве случаев написанный код на XAML можно приспособить и для Desktop-приложений. Портирование нашего проекта на Windows Application (WPF) будет твоим домашним заданием, к тому же это не так уж и сложно. Так, что там ещё? Ах да, даём имя своему проекту, указываем произвольный путь, где он будет храниться, и давим ОК.

Студия сгенерит кучу всяких файликов, но нам пока будет необходим только Page1.xaml-файл. В файле Page1.xaml.cs (если ты выбрал C#) будет размещаться шарповый сопроводительный код - его пока не трогаем. В самом начале будет открыт только readme.txt, смело закрывай его и открывай Page1.xaml. Это можно сделать во вкладке справа - Solution Explorer, двойной клик по нему. Откроется окно, разделённое на две части. Вверху будет превью нашего проекта, внизу сам XAML-код, собственно. Если сделать какое-либо изменение в коде и нажать кнопку "Design", то студия моментально протранслирует код, и в случае ошибки непременно сообщит :).

Так что корректность кода можно определить без компиляции. Тем, кто программировал на ASP.NET, знакомо такое положение дел. Итак, вместо тегов (нодов, кому как удобней) <Grid> </Grid> помещаем следующий код:

<TextBlock TextAlignment="Center" FontSize="16pt" Foreground="#CCCCFF"
RenderTransformOrigin="0.5,0.5">
<TextBlock.RenderTransform>
<RotateTransform x:Name="MyAnimatedRotateTransform" Angle="0" />
</TextBlock.RenderTransform>
Hello World!
</TextBlock>

Очень напоминает XML, не так ли? Но возможности будут намного круче, хотя пока это - не более чем статическая строка. Чтобы получше понять, что к чему, просто поэкспериментируй со значениями в блоке TextBlock. Далее переходим в режим "Design", убеждаемся, что нет серьёзных нарушений в грамматике, т.е. выкрика "Whoops!" не наблюдается, и компилируем (F5). Запуститься браузер и отобразит нам нашу строку. Обрати внимание, что просмотреть исходный код через браузер нельзя. Почему? Думаю будет понятно после публикации проекта. Теперь придадим нашей паге простенькую динамику. Ниже, между нашим кодом и закрывающим тегом </Page> , добавляем следующий код:

<Page.Triggers>
<EventTrigger RoutedEvent="Page.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="MyAnimatedRotateTransform"
Storyboard.TargetProperty="Angle"
From="0" To="360" Duration="0:0:5" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Page.Triggers>

Снова компилим. Ну вот, уже кое-что. Всё простенько_ и ничего сложного. Если ты уже проектировал веб-приложения, то подумай, сколько бы понадобилось HTML- и JavaScript-кода, чтобы создать такое. На флеше тоже быстро, но сколько он сожрёт трафа? А наши либы и обработчики графики уже на винте. И не нужно ставить никакие плагины-плееры к браузеру, он тесно координирует свои действия с фреймвёрком. Кстати, игры, просмотр видео и создание мультов - всё это подвластно WPF.

Добавим ещу парочку компонентов для наглядности. Чтобы не запутаться в коде, предлагаю удалить весь вставленный текст и заменить его следующим:

<StackPanel>
<Canvas Width="700" Height="400" HorizontalAlignment="Center">
<TextBlock Canvas.Top="100" Canvas.Left="50"
TextAlignment="Center" FontSize="30pt" Foreground="#CCCCFF"
RenderTransformOrigin="0.5,0.5">
<TextBlock.RenderTransform>
<RotateTransform x:Name="MyAnimatedRotateTransform" Angle="0" />
</TextBlock.RenderTransform>
По кругу
</TextBlock>

<TextBlock Canvas.Top="100" Canvas.Left="300" Name="scaledText"
TextAlignment="Center" FontSize="30pt" Foreground="Gray"
RenderTransformOrigin="0.5,0.5">
<TextBlock.RenderTransform>
<ScaleTransform x:Name="MyAnimatedScaleTransform" ScaleX="1" ScaleY="1" />
</TextBlock.RenderTransform>
Ближе - Дальше
</TextBlock>

<TextBlock Canvas.Top="250" Canvas.Left="150"
TextAlignment="Center" FontSize="30pt" Foreground="Orange"
RenderTransformOrigin="0.5,0.5">
<TextBlock.RenderTransform>
<SkewTransform x:Name="MyAnimatedSkewTransform" AngleX="0" AngleY="0" />
</TextBlock.RenderTransform>
Вращение
</TextBlock>

<TextBlock Canvas.Top="30" Canvas.Left="300" Name="translatedText"
FontSize="30pt">
<TextBlock.RenderTransform>
<TranslateTransform x:Name="MyAnimatedTranslateTransform" X="0" Y="0" />
</TextBlock.RenderTransform>
Движение
</TextBlock>

</Canvas>
</StackPanel>


<Page.Triggers>
<EventTrigger RoutedEvent="Page.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="MyAnimatedRotateTransform"
Storyboard.TargetProperty="Angle"
From="0" To="360" Duration="0:0:5" RepeatBehavior="Forever" />
<ParallelTimeline RepeatBehavior="Forever" AutoReverse="True">
<DoubleAnimation
Storyboard.TargetName="MyAnimatedScaleTransform"
Storyboard.TargetProperty="ScaleX"
From="0" To="3" Duration="0:0:7" />
<DoubleAnimation
Storyboard.TargetName="MyAnimatedScaleTransform"
Storyboard.TargetProperty="ScaleY"
From="0" To="3" Duration="0:0:7" />
</ParallelTimeline>
<ParallelTimeline RepeatBehavior="Forever" AutoReverse="True">
<DoubleAnimation
Storyboard.TargetName="MyAnimatedSkewTransform"
Storyboard.TargetProperty="AngleX"
From="-45" To="70" Duration="0:0:10" />
<DoubleAnimation
Storyboard.TargetName="MyAnimatedSkewTransform"
Storyboard.TargetProperty="AngleY"
From="-45" To="70" Duration="0:0:10" />
</ParallelTimeline>
<ParallelTimeline RepeatBehavior="Forever" AutoReverse="True">
<DoubleAnimation
Storyboard.TargetName="MyAnimatedTranslateTransform"
Storyboard.TargetProperty="X"
From="0" To="100" Duration="0:0:5" />
<DoubleAnimation
Storyboard.TargetName="MyAnimatedTranslateTransform"
Storyboard.TargetProperty="Y"
From="0" To="200" Duration="0:0:5" />
</ParallelTimeline>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Page.Triggers>

Компилим, и теперь в браузере уже несколько динамичных объектов. Если ты всё же не поленился и установил IIS, то теперь можно сделать публикацию, и уже через него лицезреть плоды творчества. Лезем в Build -> Publish имя_проекта, в открывшемся окне давим на кнопку "Brose" и в новом окне выбираем Local IIS, давим на кнопку "Create New Web Application" и в созданную папочку помещаем наш проект. Next->Next->Finish. Всё, теперь наше приложение доступно через веб-сервер. Также его можно залить и на удалённый веб-сервант, FTP-сервер, либо просто сохранить на файловой системе, в том числе и на удалённой машине. Обрати внимание, что если посмотреть, что получилось в результате публикации, то можно заметить, что от XAML-инструкций и следов не осталось :) , тем самым в некотором роде защищаются исходники, но это не основная цель, главное, что программить паги стало намного легче и мы получили неплохую возможность этим пользоваться.

ЗЫ. Подробнее о технологии на сайте Microsoft: http://msdn2.microsoft.com/en-us/asp.net/bb187401.aspx



Теги: Microsoft, программирование



СЛЕДУЮЩИЕ СТАТЬИ
Подслушиваем Skype: хакерский подход к резервному копированию VoIP-разговоров
Кодинг для Maemo 5: пишем Bluetooth-сканнер для Nokia N900
Delphi 2010
Геймдев для iPhone: как чужой движок помогает сделать свою игру
Упаковка сложных типов данных в Delphi
KIS 2010: версия новая, баги старые
Windows 7 для разработчика: технологические нововведения в новой ОСи
Global Positioning Trojan: следим за местоположением жертв продвинутого телефона
Термальная угроза: мифы и реальность №2
Разработка виджетов в Windows Mobile 6.5
ПРЕДЫДУЩИЕ СТАТЬИ
История пропавшей DLL
ASProtect: практическое использование
Хардкорная отладка с Linice: учимся работать в консольном отладчике ядра
Оптимизация вложенных циклов №1
Спам-боты: вскрытие и борьба
Выполнение разделяемых библиотек в Linux
Джентльменский набор сюрпризов
Технология AJAX для создания современных веб-сайтов
Библия программиста
Визуальные среды программирования для Linux
ОБСУЖДЕНИЕ СТАТЬИ
Логин:
Пароль:
Регистрации на сервере не требуется, вы можете использовать гостевой доступ.
Если у вас есть форумный логин, вы можете использовать его.
Если нет, то вы можете зарегистрироваться на forum.xakep.ru
Обсуждение этой статьи на forum.xakep.ru
ВСЕ ПОСТЫ ПРОХОДЯТ ПРЕМОДЕРАЦИЮ, не ждите их мгновенного появления в списке комментариев.
Для отправки сообщения введите код, указанный на картинке
Заголовок
Сообщение

Guest Отправлено: 15.02.2007 12:11:56
RE: XAML: умерщвление flash-а
мастдай
Guest Отправлено: 15.02.2007 23:51:20
RE: XAML: умерщвление flash-а
Нет - вроде здорово все.Толька при загрузке урлика http://channel9.msdn.com/playground/wpfe/PageTurn/default.html
Белая и чистая как слеза страничка.Или это так и должно быть?В принципе... черный квадрат есть а чем белый хуже?
Похоже ее могут видеть только разработчики WPF и возможно!автор статьи  :( А это уже большооой минус
Guest Отправлено: 16.02.2007 0:26:14
RE: XAML: умерщвление flash-а
У меня при загрузке на эту страничку (http://channel9.msdn.com/playground/wpfe/PageTurn/default.html) появляется сообщение "Install WPF/E", но не белая страничка.

PS
виндовс может и мастдай, но эта технология мне несколько даже нравится, хотя и не все =)
Guest Отправлено: 16.02.2007 0:29:11
RE: XAML: умерщвление flash-а
Немножко поправлюсь: Я погорячился :( приношу извинения.Там нужно установить WPF/E ?
Иксы его знают что это такое....Но после этого
вашему взру представится -"Красный квадрат" с "ругательной" табличкой Что чего-то нехватет и надо качнуть - хере.После нажатия на хере -"Красный квадрат" станет абсолютно красным и чистым.Немного ожиданий и.....Ваш firefox падает! с сообщением об ошибке.Настоящий эксплойт! :) Это чудо!Они стали эксплойтить браузеры!И еще не известно что там впарили.После рестарта страничка стала грузиться минут 7 прошло после этого оказалось что все висит намертво и страничка так не загрузилась.
Guest Отправлено: 16.02.2007 0:31:15
RE: XAML: умерщвление flash-а
Про масдай -это не я!И не использую его в лексике
Guest Отправлено: 16.02.2007 0:52:41
RE: XAML: умерщвление flash-а
Так кто бы спорил - технология даже очень нужная.
А я как раз интересуюсь ВебТехно для странички.И вот статья кстати.Но каков эффект!Это только отпугнет потенциальных пользователей.
Нее явно рано еще такую использовать.
Да и как видишь неудачная "пользовательская"попытка.
И про масдай - это не я!
Мои два поста после..
Guest Отправлено: 16.02.2007 16:21:28
RE: XAML: умерщвление flash-а
Страници когда их переварачивал, у меня лагали. А так ничего .. вроде понравилось .. тока с флешь при такой загрузке проца им не тегаться..
Guest Отправлено: 18.02.2007 23:59:25
RE: XAML: умерщвление flash-а
этот замес только под винду. в реальной жизни он бесполезен.
Guest Отправлено: 19.02.2007 10:34:49
RE: XAML: умерщвление flash-а
хорошая технология.. имхо скоро она станет такой же привычной как и все остальные.
Страницы: < 1 2 3 >






Keywords: zPOSTz zSOFTz, zHOWz, zINFOz, zYANDEXz z36719z
Для Авторов: edit Lock delete Lock



    Rambler's Top100