Создание простого Silverlight приложения, используя один из компонентов Expression Studio.

1.Запустим Expression Blend 4. И создадим новый проект:

Рис. 24.1.

2.Выберем из списка "Silvelight Application + WebSite":

Рис. 24.2.

Откроется окно проекта:

увеличить изображение
Рис. 24.3.

3.Для начала необходимо осуществить разметку проекта. Разметить области проекта можно с помощью мыши (синии полоски по вертикали или горизонтали) или вручную с помощью XAML кода. Выполним начальную разметку проекта:

увеличить изображение
Рис. 24.4.

Добавим атрибут ShowGridLines="True" в XAML-код, после чего пунктиром выделятся границы разметки:

<Grid x:Name="LayoutRoot" Background="White" ShowGridLines="True">
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="0.492*"/>
      <ColumnDefinition Width="0.508*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
      <RowDefinition Height="0.673*"/>
      <RowDefinition Height="0.177*"/>
      <RowDefinition Height="0.15*"/>
    </Grid.RowDefinitions>
  </Grid>

4.Добавим элементы управления в проект. Для этого перейдем во вкладку "Assests":

Рис. 24.5.

Из списка выберем "Button" и перенесем на рабочую область проекта:

увеличить изображение
Рис. 24.6.

Далее с помощью инструмента выбора "Selection", выберем добавленную кнопку. После чего станет активна закладка свойств кнопки ( Properties ):

Рис. 24.7.

Изменим заливку кнопки на красный:

Рис. 24.8.

Высоте, ширине и отступам поставим следующие значения - Width = 305, Height = 62, Margin =5:

Рис. 24.9.

Изменим имя кнопки "Button" на "Кнопка 1":

Рис. 24.10.

В итоге на рабочей области - элемент управления отобразится следующим образом:

увеличить изображение
Рис. 24.11.

5.Аналогичным образом разместим другие элементы управления. Элементы управления 2 Button, 2 TextBox, 1 Label, 1 Star (Раздел "Shapes" ):

Рис. 24.12.