Разработка программного обеспечения обычно представляет собой двухэтапный процесс, который включает разработку пользовательского интерфейса и бизнес-логики приложения. Windows Phone не является исключением из этой парадигмы. При разработке для Windows Phone XAML используется для реализации пользовательского интерфейса приложений Windows Phone.
1. Что такое XAML?
XAML или Extensible Application Markup Language — декларативный язык, разработанный Microsoft и используемый в Windows Phone для создания объектов графического интерфейса пользователя. Если вы знакомы с XML , то фрагмент кода XAML будет выглядеть очень знакомым. XAML для разработчика на C # то же самое, что HTML для веб-разработчика. Это основа дизайна пользовательского интерфейса для Windows Phone.
Платформа Windows Phone имеет в своем распоряжении множество строительных блоков, таких как кнопки, текстовые блоки, текстовые поля и т. Д. Несмотря на то, что можно разработать приложение для Windows Phone 8, используя только C #, оно непрактично и громоздко.
XAML значительно упрощает создание пользовательских интерфейсов. После создания нового проекта или страницы Windows Phone 8 в Visual Studio вы увидите два представления. В одном представлении отображается код XAML, а в другом — разработчик, представляющий визуальное проектное представление.
Чтобы лучше понять это, давайте вернемся к проекту, который мы создали в предыдущем руководстве, в котором мы создали наше первое приложение для Windows Phone 8.
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
|
<Grid x:Name=»LayoutRoot» Background=»Transparent»>
<Grid.RowDefinitions>
<RowDefinition Height=»Auto»/>
<RowDefinition Height=»*»/>
</Grid.RowDefinitions>
<!—TitlePanel contains the name of the application and page title—>
<StackPanel x:Name=»TitlePanel» Grid.Row=»0″ Margin=»12,17,0,28″>
<TextBlock Text=»MY APPLICATION» Style=»{StaticResource PhoneTextNormalStyle}» Margin=»12,0″/>
<TextBlock Text=»page name» Margin=»9,-7,0,0″ Style=»{StaticResource PhoneTextTitle1Style}»/>
</StackPanel>
<!—ContentPanel — place additional content here—>
<Grid x:Name=»ContentPanel» Grid.Row=»1″ Margin=»12,0,12,0″>
</Grid>
</Grid>
|
Вы сразу заметите ту же иерархическую структуру, что и в XML и HTML. Каждый элемент в коде XAML представляет элемент управления Windows Phone, который мы обсудим позже в этой серии. Вы заметите, что у каждого элемента есть открывающий и закрывающий тег, как в XML или HTML. Вы также можете видеть, что некоторые элементы имеют дополнительные атрибуты, имеющие следующую структуру:
|
1
2
3
4
|
<ElementName Property1=»Value» Property2=»Value» …>
<ChildElementName Property=»Value»>
</ChildElementName>
</ElementName>
|
Я буду ссылаться на каждый элемент в файле XAML как на элемент управления, так как он представляет элементы управления Windows Phone, которые являются частью структуры. Каждый из этих элементов управления может иметь свойства, связанные с ними. Некоторые из этих элементов управления, такие как элементы управления Grid и StackPanel , могут даже содержать другие элементы управления внутри них. Например, посмотрите, как элемент управления StackPanel со свойством Name элемента TitlePanel содержит два элемента управления TextBlock .
Такое иерархическое расположение элементов позволяет разработчикам гораздо проще разрабатывать пользовательский интерфейс приложений Windows Phone, а также обеспечивает структуру между элементами управления, составляющими пользовательский интерфейс приложения Windows Phone.
2. XAML против кода
Как я уже говорил ранее в этой статье, можно создать весь пользовательский интерфейс приложения Windows Phone в C # без использования XAML. В действительности, однако, это не очень практично. Это не рекомендуется, потому что это делает разработку пользовательского интерфейса приложения неубедительной и немного повсеместной.
Кроме того, строгое использование C # для создания пользовательского интерфейса приложения значительно ограничит возможность использования шаблона проектирования MVVM , встроенного в разработку Windows Phone. Это означает, что более сложные методы, такие как привязка данных , будут труднее реализовать.
Давайте внимательно рассмотрим два метода, XAML и C #, для создания пользовательского интерфейса приложения. Для этого сравнения я сначала покажу, как TextBlock и элемент управления Button объявляются в элементе управления StackPanel с использованием XAML. Затем я покажу вам эквивалент в C #.
XAML
|
1
2
3
4
5
|
<StackPanel>
<TextBlock Margin=»20″>A Simple TextBlock</TextBlock>
<Button Margin=»10″ HorizontalAlignment=»Right» Content=»Simple Button»>
</Button>
</StackPanel>
|
Вы можете видеть, насколько декларативным является приведенный выше фрагмент XAML. Легко понять иерархию элементов управления. Есть еще одно преимущество при использовании XAML. Мы можем непосредственно увидеть результат наших изменений в Visual Studio через панель предварительного просмотра дизайна, которая обычно расположена слева в Visual Studio.
C #
Давайте посмотрим, как мы можем реализовать тот же пользовательский интерфейс, используя C # вместо XAML.
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
|
//Create Our StackPanel
StackPanel stackPanel = new StackPanel();
this.Content = stackPanel;
//Create Our TextBlock
TextBlock textBlock = new TextBlock();
textBlock.Margin = new Thickness(10);
textBlock.Text = «A Simple TextBlock»;
stackPanel.Children.Add(textBlock);
//Create Our Button
Button button = new Button();
button.Margin= new Thickness(20);
button.Content = «Simple Button»;
stackPanel.Children.Add(button);
|
Как видите, он немного более грубый по сравнению с XAML, и мы не можем увидеть результат наших изменений на лету. Возможно, вы также заметили, что блок кода в C # почти вдвое больше строк кода и не так удобен для чтения, как фрагмент кода XAML, который мы видели ранее.
Для разработки Windows Phone XAML является рекомендуемым способом создания пользовательских интерфейсов. Однако могут быть случаи, когда нам необходимо реализовать более сложные элементы управления, которые сложно создать с помощью XAML, например, когда элемент управления должен быть в некоторой степени динамическим. Хотя эти ситуации встречаются реже, полезно знать, что мы можем использовать C #.
Вывод
XAML является неотъемлемой частью разработки Windows Phone, и поэтому необходимо твердое понимание. Я рекомендую вам взглянуть на официальную документацию XAML от Microsoft в Центре разработки Windows Phone. Он содержит подробную информацию об использовании XAML для разработки под Windows Phone.
В этом руководстве мы рассмотрели роль XAML в разработке Windows Phone и ее сравнение с C # для создания пользовательских интерфейсов. В следующем уроке мы продолжим работу с XAML и познакомимся с некоторыми из наиболее распространенных элементов управления Windows Phone, их использованием и способами их применения в приложении Windows Phone 8.