Бюллетень Сильверлайтера. Выпуск №1.

Syndication

Последние комментарии

  • В блоге нет новых записей
  • Работа

    • Вы не писали сообщения и не оставляли комментариев.
    • Не опубликовано ни одного предложения о работе.

    9 Апреля 2009 года.

    Хочется сообщить Вам новость от Российского сообщества пользователей Silverlight – мы начинаем выпускать информационный бюллетень. Бюллетень будет выходить регулярно. Сейчас планируется делать два выпуска в месяц. Если Вы хотите написать статью, скринкаст или заметку для бюллетеня, задать вопрос, предложить идею или просто поговорить про RIA технологии – можете писать на e-mail: spugachev@gmail.com или в форум на нашем сайте: http://silverlighter.ru/forums/.

    Silverlight 3. Обзор некоторых новых возможностей.

    Введение

    В конце марта вышла бета версия третьего Сильверлайта. Она предназначена, прежде всего, для разработчиков и энтузиастов, а не для конечных пользователей. Релиз же выйдет до конца этого года. Тем разработчикам, кто сомневается, ставить ли данную версию или нет, скажу лишь, что в Silverlight 3 поддерживается полная обратная совместимость с Silverlight 2 и 1. То есть все существующие приложения работают и с новой версией без изменений.

    Кроме того есть очень хороша новость - размер инсталлятора для Silverlight 3 не будет превышать аналогичный размер для Silverlight 2. Бета версия Silverlight 3 весит даже на 40кб меньше релиза второй версии. Что, учитывая обилие новых возможностей, не может не радовать.

    Вместе с Silverlight 3 Beta вышли и Visual Studio Tools for Silverlight 3. Но, к сожалению, на данный момент нет поддержки мультитаргетинга для Silverlight проектов, поэтому установив Visual Studio Tools for Silverlight 3, Вы не сможете параллельно разрабатывать Silverlight 2 приложения. Но такое поведение в будущем, конечно же, будет исправлено.

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

    Ещё одной не менее приятной новостью является улучшенная компрессия .xap файлов (файлов Silverlight приложений). Размер типичного приложения просто при перекомпиляции в новой версии уменьшается на 10-30%.

    Появилась поддержка кэширования сборок (assemblies), не входящих в базовую поставку Silverlight. Благодаря этому пользователь теперь может не скачивать такие сборки вмести с каждым приложением использующем их. К примеру, если разработчик приложения подключит сборку System.Windows.Controls.Data (включив предварительно возможность кэширования таких сборок в свойствах проекта), то внутри .xap файла мы её не найдём. Размер .xap файла также почти не изменится. А в AppManifest.xaml мы увидим следующее:

    <Deployment.ExternalParts>
    <ExtensionPart Source="http://go.microsoft.com/fwlink/?LinkID= " />
    </Deployment.ExternalParts>


    * This source code was highlighted with Source Code Highlighter.

    Где «XXXXXX» обозначает код сборки. При загрузке приложения сборка скачивается с сайта Microsoft и кэшируется. Это даёт возможность разработчикам сделать свои приложения ещё меньше.

    Однако обратите внимание, что кэширование по умолчанию не включено и включается оно для каждого конкретного приложения в свойствах проекта в Visual Studio установкой галочки «Reduce Xap size by caching framework extension assemblies».

    Visual Studio 2010 будет содержать мощный интерактивный дизайнер для XAML кода Silverlight приложений. Будет улучшен также и IntelliSense. Но сейчас Вы можете только посмотреть демонстрацию на английском про то, как это будет выглядеть и работать. В текущей же версии такого дизайнера нет. Пока визуально редактировать Silverlight приложения в Visual Studio нельзя.

    Для тех, кто предпочитает работать не в Visual Studio, а в Eclipse, есть отличная новость. Анонсирована поддержка разработки Silverlight приложений с помощью Eclipse на платформе Apple Macintosh (http://eclipse4sl.org/download/mac/). Но не забывайте, что Вы можете использовать Eclipse уже сейчас и для разработки Silverlight-приложений на платформе Windows .

    И, конечно, дизайнеры будут рады выходу Expression Blend 3 Preview. В этой версии доступно огромное количество новых интересных и захватывающих возможностей, о которых Вы сможете прочитать в следующих выпусках данного бюллетеня.

    Элементы управления

    Многие разработчики с нетерпением ждали расширения списка доступных элементов управления, и это произошло. Было добавлено много элементов управления. В том числе, некоторые были перенесены из Silverlight Toolkit в runtime. Вот их список:

    • DockPanel
    • WrapPanel
    • Label
    • ViewBox
    • AutoCompleteBox
    • DataGrid
    • TreeView
    • Expander
    • HeaderedItemsControl
    • HeaderedContentControl

    Все они уже достаточно хорошо знакомы. Однако в Silverlight 3 есть и абсолютно новые элементы управления:

    • DataForm. Настраиваемый элемент управления, отображающий одновременно одну сущность данных (объект, таблицу и.т.д.). Поддерживается удобное отображение, редактирование и навигация по источникам данных.
    • DataPager. Название данного элемента управления говорит само за себя. Поддерживается постраничный просмотр, для источников данных, реализующих интерфейс IPagedViewCollection. При работе с .NET RIA Services (ObjectDataSource поддерживает интерфейс IPagedViewCollection), DataPager позволяет быстро и эффективно постранично просматривать данные без необходимости загружать все страницы сразу на клиент.
    • Navigation Framework. Данный framework содержит два элемента управления: Frame и Page. Используя их, Вы сможете легко добавить постраничную навигацию (это похоже на то, как приходит навигация между HTML страницами) внутрь Вашего Silverlight приложения. Поддерживаются кнопки «Вперёд» и «Назад», а также журнал браузера. Кроме того теперь при переходе между страницами внутри Silverlight приложений адрес в адресной строке браузера также меняется. И благодаря этому теперь Вы можете дать пользователю ссылку, указывающую на какой-либо ресурс глубоко внутри Silverlight приложения. Что раньше было сделать затруднительно. Для тех, кто занимается поисковой оптимизацией (SEO), это является большим преимуществом новой версии.

    Ну и, конечно же, новинки появились и в Silverlight Toolkit. Добавлены следующие замечательные элементы управления:

    • DomainUpDown
    • TimePicker
    • Accordion
    • ChildWindow (модальное диалоговое окно). Позволяет создать всплывающее диалоговое окно, блокирующее интерфейс приложения. Создать ChildWindow достаточно просто. Для этого в Visual Studio правой кнопкой мыши нажмите на проекте Silverlight приложения и выберете Add->New Item-> Silverlight Child Window. Присвойте окну имя и нажмите кнопку «OK». Будет создан XAML файл, содержащий примерно такой код:
    <controls:ChildWindow
    x:Class="SilverlightApplication3.ChildWindow1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
    Width="400" Height="300" Title="ChildWindow1">
    <Grid x:Name="LayoutRoot" Margin="2">
    <Grid.RowDefinitions>
    <RowDefinition />
    <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    <Button x:Name="CancelButton" Content="Cancel" Click="CancelButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,12,0,0" Grid.Row="1" />
    <Button x:Name="OKButton" Content="OK" Click="OKButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Margin="0,12,79,0" Grid.Row="1" />
    </Grid>
    </controls:ChildWindow>


    * This source code was highlighted with Source Code Highlighter.
    Использовать диалоговое окно можно следующим образом:
    ChildWindow1 cw = new ChildWindow1();
    cw.Show();


    * This source code was highlighted with Source Code Highlighter.
    img01

    Важной возможностью, относящейся к элементам управления, в Silverlight 3 является поддержка связывания свойств различных элементов напрямую (Element-to-Element Binding). Например:

    <Grid x:Name="LayoutRoot" Background="White">
    <StackPanel Orientation="Vertical">
    <Slider x:Name="myslider" Minimum="0" Maximum="100" />
    <TextBlock Text="{Binding Value, ElementName=myslider}" />
    </StackPanel>
    </Grid>

    * This source code was highlighted with Source Code Highlighter.

    Можно связать текст текстового блока со значением ползунка (Slider). Это происходит благодаря данной конструкции: {Binding Value, ElementName=myslider}.

    img02

    И каждый раз, когда пользователь будет, двигая ползунок, изменять его значение, текст в тестовом блоке тоже будет меняться. При этом ни строчки кода писать не требуется.

    Есть ещё одно нововведение, которое мне кажется потрясающе полезным. Я говорю про SaveFileDialog. Диалог сохранения файлов. В Silverlight 2 был только OpenFileDialog, теперь же у нас есть и второй участник дуэта. Благодаря SaveFileDialog, появляется возможность записать что-то на компьютер пользователя (конечно, с его согласия) за пределами изолированного хранилища. Ниже приведён пример использования SaveFileDialog:

    SaveFileDialog dialog = new SaveFileDialog();
    dialog.DefaultExt = ".txt";
    dialog.Filter = "Text Files|*.txt|Log Files|*.log|All Files|*.*";
    dialog.FilterIndex = 2;
    bool? dialogResult = dialog.ShowDialog();
    if (dialogResult == true)
    {
      using (Stream fs = (Stream)dialog.OpenFile())
      {
        using (StreamWriter sw = new StreamWriter(fs))
        {
          sw.WriteLine("Привет SaveFileDialog!");
          sw.Close();
        }
        fs.Close();
      } 


    * This source code was highlighted with Source Code Highlighter.

    Поддержка 3D

    Попробуйте 3D возможности третьего Сильверлайта на примере приложения:

    Одной из самых захватывающих возможностей третьего Сильверлайта являются 3D-проекции. Естественно, учитывая, что плагин Silverlight весит достаточно мало, полноценную поддержку 3D реализовать затруднительно. Поэтому поддерживаются так называемые «Perspective transforms». То есть некоторые трехмерные трансформации, которые могут быть применены к визуальным элементам, скажем, в XAML коде, для имитирования вращения в трёхмерном пространстве. Ещё раз хочу отметить, что это не та трёхмерная графика, о которой мы говорим применительно к DirectX. Не поддерживаются 3D модели, отсечение и другие возможности. Но существующих возможностей вполне достаточно для добавления потрясающих 3D эффектов в Ваши приложения.

    В коде за трёхмерные трансформации отвечает элемент PlaneProjection. И давайте посмотрим, как применить трансформацию к визуальному элементу, наследуемому от UIElement. В нашем случае таким элементом будет картинка.

    Важно запомнить, что ось X проходит слева направо, ось Y сверху вниз, а ось Z перпендикулярно поверхности. Задавая какое-либо вращение, мы вращаем саму ось на определённое число градусов. К примеру, повернуть картинку на 45 градусов по оси X можно следующим кодом:

    <Image x:Name="mainImg" Width="400"
    HorizontalAlignment="Center" VerticalAlignment="Center" 
    Source="nature.jpg">
      <Image.Projection>
        <PlaneProjection RotationX="45"></PlaneProjection>
      </Image.Projection>
    </Image>


    * This source code was highlighted with Source Code Highlighter.
    img03
    Если мы хотим повернуть картинку по оси Y, то надо задать RotationY:
    <Image.Projection>
      <PlaneProjection RotationY="45"></PlaneProjection>
    </Image.Projection>

    * This source code was highlighted with Source Code Highlighter.
    img04
    В случае вращения по оси Z код будет почти идентичен:
    <Image.Projection>
      <PlaneProjection RotationZ="45"></PlaneProjection>
    </Image.Projection>

    * This source code was highlighted with Source Code Highlighter.
    img05
    И, конечно же, мы можем комбинировать вращения по осям координат, к примеру,
    <Image.Projection>
      <PlaneProjection RotationX="45" RotationY="45" RotationZ="10"></PlaneProjection>
    </Image.Projection>

    * This source code was highlighted with Source Code Highlighter.
    мы можем получить следующий результат: 

    img06

    Вы можете анимировать вращение осей, создавая интересные эффекты. Пример такой анимации приведён ниже. Анимация повторяется бесконечное число раз благодаря свойству RepeatBehavior="Forever". А также, повернувшись от 45 до -45 градусов, картинка совершает обратный поворот благодаря свойству анимации AutoReverse="True".

    <UserControl x:Class="SilverlightApplication5.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    MinWidth="400" MinHeight="300">
    <Grid x:Name="LayoutRoot" Background="White">
    <Grid.Resources>
    <Storyboard x:Name="sbRotateImage">
    <DoubleAnimation BeginTime="00:00:00"
    Storyboard.TargetName="mainImg"
    Storyboard.TargetProperty="(UIElement.Projection).(RotationX)"
    RepeatBehavior="Forever" AutoReverse="True"
    From="45" To="-45">
    </DoubleAnimation>
    </Storyboard>
    </Grid.Resources>
    <Image x:Name="mainImg" Width="400"
    HorizontalAlignment="Center" VerticalAlignment="Center" 
    Source="nature.jpg">
    <Image.Projection>
    <PlaneProjection RotationX="45"></PlaneProjection>
    </Image.Projection>
    </Image>
    </Grid>
    </UserControl>

    * This source code was highlighted with Source Code Highlighter.

    Кроме того требуется запустить анимацию. Давайте сделаем это в C# коде конструктора страницы, добавив строку sbRotateImage.Begin();.

    public MainPage()
    {
      InitializeComponent();
      sbRotateImage.Begin(); 
    }

    * This source code was highlighted with Source Code Highlighter.

    Запустите приложение, и наслаждайтесь красивой трёхмерной анимацией.

    У PlaneProjection есть ещё некоторые параметры. Например, параметры, позволяющие задать точку, вокруг которой происходит вращение:

    • CenterOfRotationX
    • CenterOfRotationY
    • CenterOfRotationZ

    Значения первых двух параметров задаются от 0 до 1 и привязаны к длине и ширине графического элемента. Последний параметр имеет абсолютную размерность. Значением по умолчанию для CenterOfRotationX и CenterOfRotationY является 0.5, а для CenterOfRotationZ – 0.

    Также можно задать локальное или глобальное смещение:
    • LocalOffsetX
    • LocalOffsetY
    • LocalOffsetZ
    • GlobalOffsetX
    • GlobalOffsetY
    • GlobalOffsetZ

    Смещения позволяют изменить положение графического элемента в трёхмерном пространстве. Например, один объект можно разместить на определенном удалении от другого. Отличаются смещения тем, что локальное смещение задаётся относительно контейнера, содержащего элемент, а глобальное относительно всего Silverlight приложения.

    Поддержка работы Silverlight приложений вне браузера (внебраузерные, Offline Silverlight приложения)

    Silverlight 3 приложения теперь можно устанавливать на локальный компьютер (если того захочет разработчик и пользователь, конечно). Они будут работать в своём окне, как и традиционные Windows приложения. Хранятся такие приложения физически на машине у пользователя. Для них можно автоматически создавать ярлык в меню «Пуск» и на рабочем столе. Они безопасны, так как работают в изолированной «песочнице», как и любые другие Silverlight приложения. Внебраузерные приложения поддерживают прозрачное автообновление, так что Вам не придётся заботиться об этом. Кроме того поддерживается интеграция с Windows 7. Но при этом такие приложения отлично работают и на MacOS X. Ещё одной важной особенностью является то, что Silverlight приложения теперь могут определять наличие соединения с интернетом и изменять своё поведение в зависимости от того, есть доступ к серверу или нет.

    Для того чтобы Ваше Silverlight приложение смогло работать вне браузера, требуется совершить несколько простых действий.

    Откройте в проекте файл Properties->AppManifest.xml и раскомментируйте следующие строки:
    <Deployment.ApplicationIdentity>
     <ApplicationIdentity
       ShortName="Out of Browser Silverlight Application"
       Title="Window Title of Your Silverlight Application">
      <ApplicationIdentity.Blurb>Description of your Silverlight application</ApplicationIdentity.Blurb>
     </ApplicationIdentity>
    </Deployment.ApplicationIdentity>

    * This source code was highlighted with Source Code Highlighter.
    Свойства тэга ApplicationIdentity означают следующее:
    • ShortName – Имя приложения, отображаемое в названии ярлыка на рабочем столе и в меню «Пуск». Также данное имя отображается в контекстом меню, отображаемом при нажатии правой кнопкой мыши на Silverlight приложении как часть сообщения, предлагающего произвести установку.
    • Title – заголовок окна Silverlight приложения, когда оно работает вне браузера.
    • Blurb – данный текст отображается в секции «Comment» в свойствах ярлыка приложения.

    Далее, когда Вы запустите Silverlight приложение, щёлкните по нему правой кнопкой мыши и в контекстом меню выберите «Install XXX onto this computer…», где XXX – ShortName Вашего приложения.

    img07

    Обратите внимание, что если в файле AppManifest.xml не прописана нужная конфигурация, опция «Install XXX onto this computer…» будет недоступна. После нажатия на данный пункт меню появляется диалоговое окно.

    img08

    Вы можете выбрать, куда разместить ярлык приложения, и после нажатия кнопки «OK» приложение установится на компьютер пользователя и запустится.

    img09

    Вы можете удалить приложение, щёлкнув по нему во время работы и выбрав в контекстом меню пункт «Remove this application…»

    img10

    Если Вы хотите программно определить работает приложение в браузере или вне его, используйте свойство RunningOffline объекта приложения:

    if (App.Current.RunningOffline)
    {
      ///Приложение работает вне браузера!
    }

    * This source code was highlighted with Source Code Highlighter.

    Кроме того, Вы можете задать для приложения свою иконку. Правда, требуются иконки разных размеров. Эти иконки будут отображаться при установке, в заголовке окна приложения, а также ярлык приложения будет иметь соответствующий вид. Для задания иконок, добавьте четыре .png файла в проект, и установите для них «Build Action» в значение «Content». Кроме того в секции ApplicationIdentity файла AppManifest.xml пропишите слудующий код:

    <ApplicationIdentity.Icons>
     <Icon Size="16x16">images/icon16.png</Icon>
     <Icon Size="32x32">images/icon32.png</Icon>
     <Icon Size="64x64">images/icon64.png</Icon>
     <Icon Size="128x128">images/icon128.png</Icon>
    </ApplicationIdentity.Icons>

    * This source code was highlighted with Source Code Highlighter.
    Полностью секция будет выглядеть так:
    <Deployment.ApplicationIdentity>
     <ApplicationIdentity
       ShortName="Out of Browser Silverlight Application"
       Title="Window Title of Your Silverlight Application">
      <ApplicationIdentity.Blurb>Description of your Silverlight application</ApplicationIdentity.Blurb>
      <ApplicationIdentity.Icons>
       <Icon Size="16x16">images/icon16.png</Icon>
       <Icon Size="32x32">images/icon32.png</Icon>
       <Icon Size="64x64">images/icon64.png</Icon>
       <Icon Size="128x128">images/icon128.png</Icon>
      </ApplicationIdentity.Icons>
     </ApplicationIdentity>
    </Deployment.ApplicationIdentity>

    * This source code was highlighted with Source Code Highlighter.

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

    И ещё хотелось бы пару слов сказать о том, как работают внебраузерные Silverlight приложения. После установки третьей версии Сильверлайта, в каталоге установки (C:\Program Files\Microsoft Silverlight\3.0.40307.0) Вы сможете найти приложение sllauncher.exe, которое занимается обеспечением работы Silverlight приложений вне браузера. Посмотрев на свойства ярлыка внебраузерного Silverlight приложения мы увидим, что на самом деле как раз и запускается sllauncher.exe, которому передаётся идентификатор нужного приложения. А само приложение хранится в подпапке директории C:\Users\#YourName#\AppData\LocalLow\Microsoft\Silverlight\Offline. Там для каждого приложения есть своя подпапка, название которой и является идентификатором приложения. Внутри можно найти .xap файл, иконку и некоторые другие файлы.

    Детектирование наличия/отсутствия сетевого соединения

    Если Вы разрабатываете внебраузерное Silverlight приложение, Вам бы, наверное, хотелось знать доступно ли в данный момент сетевое подключение или нет. Такая информация полезна и для обычных приложений, работающих в браузере.

    Silverlight 3, кроме того, что Вы можете определить есть ли соединение с интернетом или нет, можно детектировать момент, когда соединение появляется или исчезает. Итак, давайте посмотрим на код, проверяющий наличие соединения:

    if (NetworkInterface.GetIsNetworkAvailable())
    {
      //Сделать что-то, требующее наличия соединения
    }

    * This source code was highlighted with Source Code Highlighter.

    Он говорит сам за себя. А для определения момента, когда сетевое подключение появляется или исчезает, подпишитесь на событие NetworkChange.NetworkAddressChanged:

    NetworkChange.NetworkAddressChanged += new NetworkAddressChangedEventHandler(NetworkChange_NetworkAddressChanged); 

    * This source code was highlighted with Source Code Highlighter.

    В обработчике события используйте уже знакомый код:

    void NetworkChange_NetworkAddressChanged(object sender, EventArgs e)
    {
      if (NetworkInterface.GetIsNetworkAvailable())
      {
        //Сделать что-то, требующее наличия соединения
      }
    }

    * This source code was highlighted with Source Code Highlighter.

    Таким образом, Вы сможете, отловив момент, когда состояние сетевого соединения меняется, проверить его наличие и выполнить какие-либо действия.

    Navigation Framework

    Выше уже вскользь упоминался Navigation Framework. Теперь пришло время рассмотреть его подробнее на конкретном примере.

    Давайте в Visual Studio создадим новый проект, выбрав File->New Project…->Silverlight->Silverlight Navigation Application. То есть мы будем использовать шаблон проекта «Silverlight Navigation Application». В принципе это не обязательно и Вы можете использовать стандартный шаблон для Silverlight проектов, или добавить поддержку навигации в существующее приложение. Используя же специализированный шаблон просто немного легче начать.

    Введите имя для нового проекта и нажмите «OK». Выбранный шаблон содержит базовое приложение с некоторым графическим интерфейсом. Обратите внимание, что страницы приложения содержатся в папке «Views», а MainPage.xaml является контейнером (мастер страницей).

    img11

    Вы уже сейчас можете запустить приложение и попробовать перейти на страницу «About», посмотреть на изменения в адресной строке браузера, которые при этом происходят, и воспользоваться кнопкой «Назад». Вся эта функциональность доступна по умолчанию.

    img12

    Если мы заглянем в код страницы MainPage.xaml, то увидим, в том числе и такие строки:

    <navigation:Frame x:Name="Frame" Source="/Views/HomePage.xaml"
    HorizontalContentAlignment="Stretch"
    VerticalContentAlignment="Stretch"
    Padding="15,10,15,10"
    Background="White"/>

    * This source code was highlighted with Source Code Highlighter.

    Здесь используется элемент управления Frame. В этот фрейм загружаются различные страницы. Если провести аналогию с ASP.NET, то Frame в чём-то похож на ContentPlaceHolder (хотя Frame обладает более богатыми возможностями). Давайте посмотрим на наиболее важные свойства и методы фрейма:

    • Source – это свойство задаёт Uri страницы, которая будет открыта при загрузке фрейма.
    • JournalOwnership – данное свойство определяет, сохранять ли историю в журнале браузера или фрейм будет использовать собственный журнал для этих целей.
    • Frame.Navigate (Uri uri) – данный метод позволяет загрузить во фрейме страницу, адрес которой передаётся ему параметром. Не забывайте указывать в начале адреса слеш "/". Давайте посмотрим на пример использования данного метода:
      Frame.Navigate(new Uri( "/Views/Home.xaml", UriKind.Relative ) );

    Также у фрейма есть много полезных событий, на которые можно подписаться, например Navigating, Navigated, NavigationFailed и NavigationStopped.

    Теперь взглянем на код страницы HomePage.xaml:

    <navigation:Page x:Class="SilverlightApplication6.HomePage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
    Title="Моё Супер приложение">
    <Grid x:Name="LayoutRoot" Background="White">
    <StackPanel>
    <TextBlock Text="Home" Style="{StaticResource HeaderTextStyle}"/>
    <StackPanel Style="{StaticResource ContentTextPanelStyle}">
    <TextBlock Text="To learn more about Silverlight visit " Style="{StaticResource ContentTextStyle}"/>
    <HyperlinkButton Content="http://www.silverlight.net" NavigateUri="http://www.silverlight.net" Style="{StaticResource HyperlinkButtonStyle}"/>
    </StackPanel>
    </StackPanel>
    </Grid>
    </navigation:Page>

    * This source code was highlighted with Source Code Highlighter.

    Вы видите, что здесь используется элемент управления Page. Обратите внимание на свойство «Title». С его помощью можно задать текст, который будет находиться, в заголовке окна браузера при отображении конкретной страницы. В данном случае я задал Title="Моё Супер приложение":

    img13

    По умолчанию фрейм интегрируется с журналом браузера. Когда происходит переход между страницами, информация об этом сохраняется в журнале. Кроме того, Вы можете использовать и кнопки «Вперёд/Назад»:

    img14

    Однако, как я уже говорил, у фрейма есть свойство JournalOwnership, которое может принимать следующие значения:

    • Automatic – если браузер позволяет, история сохраняется в его журнал, если нет, она сохраняется только в журнал фрейма.
    • OwnsJournal – история сохраняется только в журнал фрейма.
    • UsesParentJournal – фрейм будет использовать журнал и настройки фрейма, в котором находится сам (родительского фрейма). Если родительского фрейма нет, используется режим «Automatic».

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

    Есть одна небольшая проблема. Из кода дочерней страницы мы не имеем прямого доступа к объекту фрейма на главной странице. Но на помощь нам приходит NavigationService. Благодаря которому, мы можем производить навигацию, то есть изменять страницу, загруженную во фрейм из кода любой внутренней страницы.

    Сделать это можно примерно так:

    this.NavigationService.Navigate(new Uri( String.Format( "/Views/NextPage.xaml?title={0}&param={1}", ...), UriKind.Relative ) );

    * This source code was highlighted with Source Code Highlighter.

    Обратите внимание, что поддерживается передача параметров прямо в строке адреса. Получить переданные таким образом параметры позволяет свойство NavigationContext.

    if (this.NavigationContext.QueryString.ContainsKey("param")
    && this.NavigationContext.QueryString.ContainsKey("title"))
    {
      string title = this.NavigationContext.QueryString["title"];
      string param = this.NavigationContext.QueryString["param"];
    }

    * This source code was highlighted with Source Code Highlighter.

    Как я уже говорил, когда происходит навигация внутри Silverlight приложения, адрес в адресной строке браузера также меняется. Если Вы копируете такой адрес и вставите в адресную строку в новом окне браузера, Silverlight приложение загрузится на нужной странице. Доступ к строке запроса из приложения можно получить, используя объект NavigationContext.

    Заключение

    Мы рассмотрели некоторые возможности третьего Сильверлайта. Надеюсь, они понравятся Вам также, как нравятся мне. О других возможностях мы расскажем в следующих выпусках.

     

    Трюки и советы

    Layout transform в Silverlight

    В WPF у элементов интерфейса есть замечательное свойство – LayoutTransform, которое позволяет применить трансформацию к содержимому этих элементов. При этом размеры родительского элемента остаются прежними, а трансформированное содержимое масштабируется так, чтобы поместиться в отведенное ему место.

    LayoutTransform необходима, если вы, например, хотите повернуть текст внутри кнопки вертикально:

    img15

    Однако, в силу того, что сильверлайт не имеет этого свойства, придется использовать RenderTransform, и в итоге получится следующее:

    img16

    Что же делать

    Безусловно, добиться нужного эффекта можно и имеющимися средствами – рассчитать отступы и применить TranslateTransform, но это лишние затраты времени. Представьте, что вам нужно применить группу трансформаций к содержимому нескольких элементов интерфейса (да-да, такое бывает нужно), тогда для каждого придется проводить хитрые математические расчеты для правильного отображения. Думаю, те кто применял LayoutTransform в WPF, будут разочарованы предстоящим объемом работы, ведь там это делается одной строчкой кода.

    Пока разработчики думают включать ли LayoutTransform в следующие версии сильверлайта, в блоге Delay's Blog уже появилось решение этой проблемы. Автор блога David Anson написал замечательный контрол LayoutTransformControl, который позволяет оборачивать нужное содержимое и применять к нему трансформации так, как будто используется «настоящая» LayoutTransform.

    Использование

    Для начала необходимо добавить пространство имен к любому родительскому элементу по отношению к контролу LayoutTransformControl, например, к UserControl:

    xmlns:local="clr-namespace:LayoutTransformControlSample;assembly=ИмяПодключенойСборки"

    * This source code was highlighted with Source Code Highlighter.

    Далее оборачиваем нужное содержимое в теги

    <local:LayoutTransformControl.Transform />

    * This source code was highlighted with Source Code Highlighter.

    Теперь можно применять любую доступную трансформацию через свойство LayoutTransformControl.Transform :

    <local:LayoutTransformControl.Transform>
      <TransformGroup>
        <RotateTransform Angle="-90" />
        <SkewTransform AngleX="10" AngleY="4" />
       </TransformGroup>
    </local:LayoutTransformControl.Transform>

    * This source code was highlighted with Source Code Highlighter.

    Вот все, что нужно написать для примера с кнопкой:

    <Button Width="200" Height="100">
       <local:LayoutTransformControl>
        <local:LayoutTransformControl.Transform>
          <RotateTransform Angle="-90" />
        </local:LayoutTransformControl.Transform>
        <TextBlock Text="Кликни меня" />
       </local:LayoutTransformControl>
    </Button>

    * This source code was highlighted with Source Code Highlighter.

    Где достать

    Скачать этот контрол можно отсюда – LayoutTransformControl.zip. Одна из статей, посвященных ему - Lying to the layout system for a good cause [Bringing LayoutTransform to Silverlight 2!]. В архиве помимо исходников находятся наглядные примеры использования этого элемента и сравнения с RenderTransform.

     

    Замена класса App в Silverlight приложении

    Как известно, по умолчанию стартовым классом всех Silverlight приложений является App, часть описания которого можно найти в файле App.xaml.cs. Изменить стандартное поведение можно очень просто:

    1. Нужно добавить в ваш Silverlight проект класс, производный от Application. Например, назовем его NewStartClass, вот содержимое файла NewStartClass.cs:

    using System;
    using System.Net;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Documents;
    using System.Windows.Ink;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Animation;
    using System.Windows.Shapes;

    namespace SilverlightApplication3
    {
      public class NewStartClass: Application
      {
       
      }
    }

    * This source code was highlighted with Source Code Highlighter.

    2. Откроем свойства silverlight проекта (Правой кнопкой на название проекта -> Properties). На вкладке Silverlight в ниспадающем списке под названием Startup Object выбираем только что созданный класс.

    img17

    Все готово! Теперь в качестве стартового будет использоваться наш класс. Но давайте в заключение добавим корневой элемент визуального интерфейса, чтобы что-нибудь отображалось пользователю на экране. Корневым элементом может быть любой класс, производный от UIElement. По умолчанию используется класс Page, его экземпляр и создадим.

    3. Итак, добавим конструктор по умолчанию

    public NewStartClass()
    {
      this.Startup +=
       new StartupEventHandler(NewStartClass_Startup);
    }


    * This source code was highlighted with Source Code Highlighter.

    Вот обработчик события старта приложения:

    void NewStartClass_Startup(object sender, StartupEventArgs e)
    {
      Page root = new Page();
      this.RootVisual = root;
    }


    * This source code was highlighted with Source Code Highlighter.

    В нем просто устанавливаем корневым элементом экземпляр класса Page.


    Опубликовано 08 апреля 2009, 11:19 , автор - Александр Порубов