Уроки SilverLight

Опубликовано 31 Октябрь | Автор admin
Ключевые слова:,

Вот для того, чтобы не расслабляться, небольшая подборка уроков по SilverLight, так что качаем и учишься работать с новой технологией:

Popularity: 82% [?]

Добавить в закладки:
1 комментарий | Новости | Вся статья

SilverLight и JavaScript

Опубликовано 5 Октябрь | Автор admin
Ключевые слова:, , , ,

Сегодня мы с вами рассмотрим взаимодействие SilverLight и JavaScript. Рассмотрим это на простом примере, мы создадим просто текстовое поле и текстовый блок. При нажатии будет вызываться функция JavaScript и выскакивать сообщение, что мы в данный момент нажали.
Итак заходим сново уже в привычный для нас интерфейс Expression Blend, создаем новый проект. Затем создаем текстовый блок и прямоугольник ввиде окантовки к нашему тексту… В итоге xaml должен выглядеть следующим образом:

<canvas>
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="300" Height="80"
Background="White"
x:Name="Page"&gt;</canvas>

<rectangle width="300" height="80" stroke="Black" strokethickness="2">
cursor="Hand" mouseleftbuttonup="MouseClicked"&gt;
<textblock fontsize="22" canvas.left="113.21" canvas.top="26">
foreground="Blue" text="SilverlightRU.net" cursor="Hand"
mouseleftbuttonup="MouseClicked";
</textblock></rectangle>

Параметры прямоугольника состоят из следующих значений:

  • Width и Height, соотвественно длина и высота прямоугольника;
  • Stroke - тут выставляем цвет контура прямоугольника, в примере - Черный;
  • StrokeThickness - тут выставляем значение толщины линии;
  • Fill - тут задаем значение цвета заливки, в нашем примере данный параметр отсутствует, так как нам нужно чтоб был виден текстовый блок;
  • Canvas.Left и Canvas.Top - положение прямоугольника на рабочей области, по умолчанию оба значения имеют координаты (0;0).

Текстовый блок состоит из следующих значений:

  • FontSize - размер нашей гарнитуры;
  • Foreground - цвет текста;
  • Text - текстовое содержание нашего блока;
  • Canvas.Left и Canvas.Top - положение текстового на рабочей области, по умолчанию оба значения имеют координаты (0;0).
  • MouseLeftButtonUp - в обоих случаях событие по нажатию левой клавиши мыши.

Все что нам осталось добавить, это в нашем html файле следующий код :

<script type="text/javascript">
function MouseClicked(sender, args){
   alert("Sender: " + sender.toString());
}
</script>

Все тестируем.. и в очередной раз хвалим себя, какие мы молодцы)
Смотреть пример.

Popularity: 88% [?]

Добавить в закладки:
Нет Комментариев | Новости, Примеры | Вся статья

Знакомство с анимацией Microsoft SilverLights

Опубликовано 30 Сентябрь | Автор admin

Ну что продолжим с вами знакомиться с практической частью создания Silverlight. И так как я отношусь по большой части к дизайнером, то больше всего меня интересует создание анимации, чем сегодня с вами и займемся. Так как мы только знакомимся с вами с этой программой, то сегодня попробуем сделать с вами очень простую анимацию в буквально несколько кадров.
Запускаем наш Expression Blend 2, создаем новый проект (кто не занеет как, смотрим тут). Выбираем инструмент - Перо, и рисуем кривую похожую на морскую волну
Animation SilverLight

Затем откройте вкладку Properties, и выберите для заливки соответствующий синий цвет, у нас же все-таки волна должна получиться.
Animation SilverLight

Сейчас перейдем непосредственно к анимации, для этого в панели Object and TimeLine выбираем Create new Storyboard, нажав для этого “+”. В появившемся окне вводим название нашей шкалы,снимаем галочку с пункта Create as a Resource и нажимаем кнопку ОК.
Animation SilverLight

В панели Object and TimeLine мы видим, что появилась временная шкала (напоминает шкалу во Flash). Выбираем инструмент Direct Selection, перетягиваем ползунок на 1, и деформируем нашу волну, после этого опять перетягиваем, ползунок на значение 0, и нажимаем кнопку Record Keyframe, видим что появилось два кадра.
Animation SilverLight

Выделяем нулевой кадр копируем его и перетягивает шкалу на значение - 2, и вставляем туда первый кадр, можем сейчас попробывать проиграть анимацию. Однако у нас анимация прогрывается только один раз, чтоб поставить ее на зацикливание кликаем по наше шкале (на название шкалы - в нашем случае Wave), выделив ее, и в закладке Properties в поле RepeatBehavior вписываем значение Forever.
Animation SilverLight

Просматриваем нашу анимацию в браузере, чтобы сделать анимацию более реальной, можно выделить все ваши кадры и в окне Easing перетянуть ползунки, так чтоб анимация выглядела более реально.
Animation SilverLight

Ну вот и произошло наше первое знакомстов с анимацией в SilverLights, с чем собственно всех и поздравляю)

Popularity: 100% [?]

Добавить в закладки:
Нет Комментариев | Новости, Примеры | Вся статья

Новые возможности Expression Blend 2 September Preview

Опубликовано 30 Сентябрь | Автор admin
Ключевые слова:,

Знакомимся с новыми возможностями Expression Blend 2 September Preview, для этого идем и смотрим 4 видеоролика демонстрирующих нам эти возможности…

Popularity: 74% [?]

Добавить в закладки:
Нет Комментариев | Новости | Вся статья

SilverLight или Flash?!

Опубликовано 27 Сентябрь | Автор admin
Ключевые слова:, ,

SilverLight или Flash
Появление Microsoft Silverlight вызывало массу неоднозначных мнений, и в принципе самый главный вопрос, чем оно сможем покарить своих пользователей, что в ней такого особенного, чем отличается от конкурентов???
Что б выяснить основные отличия SilverLight, давайте просто сравним ее с основным конкурентом - Adobe Flash (уже Adobe), итак чем они отличаются друг от друга:

1. SilverLight не требует установки видео кодека для проигрывания видео формата .WMF
Flash требует наличие кодека для проигрывания .WMF видео. Также есть ограничения по проигрыванию других форматов видео.

2. Silverlight поддерживает полноэкранное видео.
Flash не поддерживает масштабируемое полноэкранное видео.

3. Silverlight использует анимационную модель - WPF, которая основывается на времени а не на кадровой анимации.
Flash использует покадровую анимацию.

4. Silverlight не поддерживает GIF и BMP форматы. Поддерживаются только JPG и PNG форматы графических файлов.
Flash на сегодняшний день поддерживает все графические форматы.

5. Silverlight позволяет встраивать текст в свой проект, и устанавливать его с загрузкой объекта.
Во Flash работь со шрифтами довольно сложно.

6. Silverlight использует XAML, и он пока декларативный.
Flash - ActionScript

7. Silverlight не позволяет пока работать с пиксельной графикой, и использовать различные эффекты и фильтры.
Flash позволяет это делать уже с 8 версии

8. Silverlight использует XAML который основывается на текстовой информации, и может быть леко изменен используя простые XML объекты.
Flash использует бинарные (двоичные) формы записи.

9. Silverlight позволяет использовать различные технологии при создании проекта - JavaScript, C#.
Flash позволяет использовать только программные возможности ActionScript.

10. Используя Silverlight Streaming вы можете создать полноценный видеой cайт, используя бесплатный сервис.
Ни один потоковый сервис не доступен бесплатно во Flash.

Оригинал статьи

Popularity: 78% [?]

Добавить в закладки:
1 комментарий | Новости | Вся статья

Перспективы Microsoft Silverlight

Опубликовано 25 Сентябрь | Автор admin

Многие относятся скептически к появлению Microsoft Silverlight на рынке интернет приложений, думаю что она врядли сможет завоевать достойное положение. Многие думают, зачем нам что-то новое, когда мы можем вполне пользоваться старыми методами разработки. Но я считаю, что мы не стоим на месте, и новое будет всегда, и мы должны постоянно двигаться вперед и совершенствоваться, использую более новые и мощные возможности. И у Silverlight, я считаю, вполне достойное будущее.. Именно поэтому я решил перевести для вас статью довольно авторитетного аналитика компьютерной индустрии, к мнению которого надо внимательно прислушаться - Нельсона Кинга (Nelson King). Оригинал статьи читаем тут - The Road Ahead for Microsoft Silverlight.

Нельсон Кинг был разработчиком программного обеспечения в течение больше чем двадцати пяти лет. В дальнейшем стал аналитиком компьютерной промышленности, рецензентом изделий и автором девяти книг по программированию базы данных. Он писал для Intelligent Enterprise (и его предшественников) в течение больше чем десяти лет.

Вот что он пишет о технологии Microsoft Silverlight:
Я не уверен, что это значит для эпохи Интернет, но, проще говоря, информация привлекает наше внимание так же быстро, как и перестаёт нас интересовать. Например, в среду, 5 сентября, было сделано рекламное объявление электронной почты Microsoft, выпускающем версию Silverlight 1.0. Я не знаю, сколько менеджеров IT и разработчиков используют Silverlight. Возможно не многие. Конечно выпуск первой версии чего-нибудь, даже от Microsoft, редко привлекает много внимания. Я не собираюсь тянуться за микрофоном и кричать об этом событии, но небольшой комментарий мог бы стать полезным.
Silverlight – это технология, предназначенная для создания Rich Internet Applications (RIA) особенно тех, которые сосредоточены на потоковом мультимедиа или векторной графике. Например, CBS, телевизионные станции будут использовать Silverlight, чтобы управлять и представлять воспроизведение видео на Вебсайтах телевизионных станций. Чтобы сделать это, Silverlight требует наличие графического приложения на компьютере клиента, которое может быть установлено или поставленного вместе с ОС. Silverlight включают средства для написания кода, который набирает клиент, различные кодеки и перенос данных с одного носителя на другой. Это схоже с Adobe’s Flash, Flex, и Dreamweaver line-up. Silverlight - это конкуренция.
Я знаю, что для многих корпораций и их IT магазинов, Web-приложения, которые сочетают потоковое мультимедиа, или даже графику высокого качества - является все еще экзотической разновидностью. Однако, как многие из новых звезд Web 2.0 показывают (YouTube, Google Maps), инкорпорация насыщенной графики, и даже мультимедиа в приложениях становится требуемым этикетом, и это означает, что рано или поздно всё это будет использоваться бизнес – предприятиями.
IT должно знать к настоящему времени, всю продукцию разработки программного обеспечения Microsoft (один из основных стержней его собственной торговли). Больше чем все другие многочисленные технологии подобного рода, Silverlight представляет яркое и светлое будущее для Microsoft. Сравним. .Net- это основополагающая технология, конечно же, важная, но не яркая и светлая. Silverlight - это мост между технологией представления ( UI and all the plumbing underneath) и потоковым управлением контента. Это - одно из мест, где поселилась самая большая мечта Билла Гейтса.
Вернёмся назад в середину 1990-ых, Гейтс и Крэйг Маккоу мечтали о глобальной спутниковой сети, Teledesic, части Gates’ Grande Vision о соединении компьютеров с телесвязью. Той частью мечты была также и Grande, но Silverlight –это мечта – в которой работа в Интернете ведется с изображением, видео, кино, аудио, и музыкой - и GUI, чтобы это всё сочетать вместе. Microsoft вложит любые ресурсы, которые потребуется, чтобы сделать Silverlight игроком, не только на рынке развития RIA, но также и среди больших производств СМИ (подобно CBS).
Microsoft несется с большой скоростью особенно там, где г. Гэйтс видит успешное будущее (и пусть даже не очень хорошо).
Так, что друзья делайте выводы сами…

Popularity: 68% [?]

Добавить в закладки:
Нет Комментариев | Новости | Вся статья

Ну вот и пришло время практики.. Сегодня мы немного потренируемся и попробуем сотворить чего Silverlight-оского ;)
Начало статьи тут….
Итак начнемс, вы уже должны были скачать и установить Expression Blend, если Вы этого не сделали, то смотрим тут, что и как необходима скачать и установить.
Запускаем Microsoft Expression Blend, кликаем New Project, и конечно выбираем SilverLight Application, указав папку в которой будут храниться исходники.
Screen SilverLight Expression Blend
Выберите ОК, и новый проект будет создан.
Структура вполне стандартная, и думаю кто работал с различными графическими редакторами, как Flash, разобраться будет не сложно. Единственное в верхнем углу расположено меню доступа к основным файлам проекта.
Screen SilverLight Expression Blend
Т.е. проект содержит по умолчанию HTML страницу, код JavaScript содержащейся на этой странице, XAML документ.
Silverlight.js содержит код загрузки и иллустрирует пример управления SilverLight. Он представлен как часть Silverlight SDK.
Default.html - стандартная Web страница. Она содержит три ссылки на JavaScript, указывающие на Silverlight.js, Default.html.js , и Scene.xaml.js (который содержит обработчик событий определенных в XAML).
Итак мы займемся с вами созданием UI для Video Player.
Добавьте любой видео файл к вашему проекту. Чтобы сделать это, щелкните правой кнопкой мышки на Project Files в верху экрана, и выберите Add Existing Item… Выбираем любой видеофайл (Добавляем WMF и версия Microsoft Windows Player должна быть не ниже 10) и нажимаем ОК
Screen SilverLight Expression Blend
Файл появится в Project Explorer, и, Медиа элемент будет добавлен на главную страницу. Вы можете теперь просмотреть ваш проект в браузере, который воспроизведет ваше видео! Также можно остановить автоматическое воспроизведение видео, редактируя XAML. Выберите XAML (из двух:Design&XAML) таблицу, откроется окно редактирования XAML. Просто нужно лишь отредактировать тег MediaElement, и установите атрибут AutoPlay=False.
Screen SilverLight Expression Blend
Запускаем - смотрим, все работает!
Добавьте два текстовых блока на поле с текстом Play и соответственно Stop и назовите их Play_txt и Stop_txt, после этого ваш XAML файл дожен выглядеть следующим образом (что самое удобное, ошибки видны сразу на панели Errors).

<canvas>
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="640" Height="480"
Background="White"
x:Name="Page";
<mediaelement x:name="You_Roll_wmv" width="352">
Height="288" Source="You Roll.wmv"
Stretch="Fill" Canvas.Left="134"
Canvas.Top="94" AutoPlay="False";
<textblock x:name="Play_txt" width="40" height="25" canvas.left="106">
 canvas.top="411" text="Play" textwrapping="Wrap";
<textblock x:name="Stop_txt" width="38" height="25" canvas.left="167">
canvas.top="411" text="Stop" textwrapping="Wrap";
</textblock></textblock></mediaelement>
</canvas>

Затем добавьте описание обработчика событий для блоков текста в XAML. Для этого используется свойство MouseLeftButtonDown (интуитивно понятно, что действует по нажатию левой клавиши мыши).
Итак для Play_txt добавляем действие DoPlay, для Stop_txt - DoStop, и соответственно участок с текстом в XAML выглядет следующим образом:

<textblock x:name="Play_txt" width="40" height="25">
canvas.left="106" canvas.top="411" text="Play" textwrapping="Wrap"
MouseLeftButtonDown="DoPlay"&gt;;
<textblock x:name="Stop_txt" width="38" height="25" canvas.left="167">
canvas.top="411" text="Stop" textwrapping="Wrap"
MouseLeftButtonDown="DoStop"&gt;;
</textblock></textblock>

Теперь когда пользаватель щелкнет мышкой по одному из текстовых блоков, мы сможем обработать это событие при помощи JavaScript. Обработка Событий в JavaScript записывается здесь Page.xaml.js.
Так как мы определили функции по нажатию, как DoPlay и DoStop, запишим их соответсвенно в Page.xaml.js. Код должен выгдедеть следующим образом:

function DoPlay(sender, eventArgs)
{
var theHost = document.getElementById("SilverlightControl");
var theMedia = theHost.content.findName("YouRoll_wmv");
theMedia.Play();
}

function DoStop(sender, eventArgs)
{
var theHost = document.getElementById("SilverlightControl");
var theMedia = theHost.content.findName("YouRoll_wmv");
theMedia.Stop();
}

Screen SilverLight Expression Blend
Все можем тестировать. Нажимаем на текстовый блок Play - ролик начинает проигрываться, нажимаем на Stop - останавливается. Поздравляю мы сделали первый проект при помощи Silverlight!!!

Popularity: 86% [?]

Добавить в закладки:
1 комментарий | Примеры | Вся статья

Вот небольшая инструкция как поставить среду разработки для приложений SilverLight.
Так как нам пока необходимы только основы работы с SilverLight, то достаточно будет поставить:
1) .NET Framework 3.0, после того как он распакуется, установите его в online режиме.
2) после установки .NET Framework 3.0, скачайте и установите Expression Blend 2 September Preview, весит данный архив около 25Мб.
Все можно приступить к работе….

Popularity: 53% [?]

Добавить в закладки:
Нет Комментариев | Новости | Вся статья

Ну что ж, как и обещал, продолжаю публиковать статью о “Введении в SilverLight”.
Начало статьи Здесь….
Ну сегодня нас с Вами ждет немного истории, итак не будем разглагольствовать и начнем.
Когда Tim Berners-Lee в CERN изобрел современную Сеть Интернет, она была предназначена как система, которая позволяла сохранять статические документы, и связывала их в сети. За эти годы наука не стояла на месте, а уверенно шла вперёд. Активные документы можно было создавать по запросу с учетом пользовательской информации или временных параметров. Технологии CGI позволяли это делать. Через какое-то время, возможность создавать документы в Сети получила первостепенную важность, а технология прошла путь от CGI через Java и ASP к ASP.NET..
ASP.NET была средствов, которое позволяло разработчикам создавать быстро и качество Web приложения на стороне сервера и оптимально подобранных инструментов серии Visual Studio.
Самым большим барьером для веб-приложений стал интерфейс пользователя, где технические ограничения помешали предоставить то же удобство, что и клиентские приложения для ПК, работающие с локальными данными.
XMLHttpRequest объект , выпущенный Microsoft как часть Internet Explorer 5 в 2000, открыл дорогу для технологии Asynchronous JavaScript и XML (AJAX), которая позволяла веб-приложениям Сети, обеспечить более динамическую реакцию на пользовательские действия, обновляя лишь небольшие части WEB страниц, не требуя полной перезагрузки контента. Инновационные решения, основанные на AJAX, типа карт Windows Live Local, приблизили веб-приложения к уровню удобства обычных клиентских программ.
Silverlight является следующим шагом в развитии потенциального богатства пользовательского интерфейса, благодаря которому разработчики и ДИЗАЙНЕРЫ могут сделать свои проекты профессиональными, и представить потребителям. Silverlight работает, позволяя ДИЗАЙНЕРАМ выразить свой творческий потенциал и сохранить работу в формате, который будет готов уже непосредственно для работы Интернете. В прошлом дизайнер проектировал сайт, используя средства, которые предоставляли богатые возможности пользователю, но при этом программисты сталкивался с ограничениями работоспособности на различных WEB платформах. В модели Silverlight, дизайнеры могут воплащать свои идеи и оно автоматически сохраняется в виде XAML. XAML впоследствии автоматически встраивается в веб-страницу с помощью среды выполнения Silverlight. В результате дизайнер и программист могут работать над конечным результатом более слаженно, чем когда-либо ранее.
XAML - это XML, является текстовым, не вызывает конфликтов с брандмауэрами, легко проверяемым языком, и при этом описывает различное содержимое. В то время как другие технологии - типа Java Applets, ActiveX, и существующий Flash который может использоваться, чтобы представить более интересно и красочнее содержание сайта, - но они все посылают двоичный запрос браузеру. Из-за этого трудно поддерживать безопасность, не говоря уже о трудности модернизировать, поскольку любые изменения требуют, чтобы все приложение было повторно переустановленно, что неудобно для пользователя и зачастую приводит к торможению веб-страниц. Когда используется Silverlight для того чтобы измененить контент, необходимо сгенерировать новый XAML файл на стороне сервера. В следующий раз, когда пользователь будет просматривать данную страницу, этот новый XAML загрузится, и содержание обновиться без какой-либо переустановки.
В основе Silverlight - расширенный модуль, который обрабатывает XAML и отображает графику в браузере. Плеер для воспроизведения приложений SIlverlight, весит менее чем 2 МБ, и может быть установлен, когда пользователь попадает на сайт, содержащий контент Silverlight. Модуль предоставляет разработчикам доступ к функциям XAML-страницы на языке JavaScript, таким образом, становится возможным взаимодействие с содержимым на уровне страницы и разработчик может, например, создать обработчики событий или управлять содержимым XAML-страницы с помощью JavaScript-кода.
Продолжение следует….

Popularity: 51% [?]

Добавить в закладки:
1 комментарий | Новости | Вся статья

Что такое Silverlight?

Опубликовано 18 Сентябрь | Автор admin
Ключевые слова:, , ,

Так как мы вместе с Вами начинаем изучать Silverlight, то я решил перевести статью Laurence Moroney, для того чтобы помочь новичкам (к которым я и сам отношусь) в этом нелегком деле :)
Ну для начало нам необходимо выяснить что же за зверь такой этот Silverlight…
Silverlight - новая Web технология, которая создана, чтобы использоваться на всем разнообразие Web платформ. Это позволяет создавать богатые, визуально ошеломляющие и интерактивные проекты, которые могут использоваться везде: в пределах браузеров, на сложных устройствах и рабочем столе OC (типа Apple Macintosh). WPF (Windows Presentation Foundation), технологии Microsoft . NET Framework 3.0 ( Windows programming infrastructure), XAML (eXtensible Application Markup Language) – всё это основа представления о Silverlight.
Данный доклад ознакомит вас с основами Silverlight и расскажет как Вы можете использовать стек инструментов Microsoft , включая Microsoft Expression Blend, Microsoft Visual Studio 2005, и XAML, чтобы создавать графические сайты.
Продолжение следует…

Popularity: 73% [?]

Добавить в закладки:
1 комментарий | Новости | Вся статья