След като научихме как да създаваме и внедряваме приложение в версията на инструментите за CTP на Silverlight, като част от серията уроци за Windows Phone, преминаваме към Expression Blend. Expression Blend е създаваща система за професионални дизайнери, които изграждат опит на потребителите, които са насочени към платформата.NET 3.0 + и по-конкретно WPF или Windows Presentation Foundation.
Обикновено контролите на Silverlight имат отделна логика от визуалния си вид, използвайки шаблони. А ControlTemplate определя визуалната структура и визуалното поведение на контрола. Можете да персонализирате външния вид на повечето контроли, като промените техните стойности по подразбиране ControlTemplate настройки. Това ви позволява да промените външния вид на контрола, без да променяте нейната функционалност. Например, можете да направите бутоните в заявката си кръг, а не стандартната квадратна форма, но бутонът пак ще повдигне Кликнете събитие.
В този урок можете да отворите проекта Visual Studio, който сте създали в предишното упражнение в Expression Blend и да го замените ControlTemplate на бутона, за да промени външния си вид и усещане. Защото създавате a ControlTemplate в XAML, можете да промените външния вид на контрола без да пишете код.
2. Ако сте изпълнили стъпките в предишното упражнение, можете да продължите с решението, което сте създали за това упражнение.
3. Отворете текущото решение в Expression Blend. За да направите това от Visual Studio, щракнете с десния бутон на мишката MainPage.xaml в Разтвор Explorer и след това изберете Отвори в Изразяване. Ако тази опция е недостъпна- най-вероятната причина е, че текущата ви версия на Expression Blend не поддържа необходимия тип проект, следвайте следващите стъпки, за да създадете временен проект, който можете да редактирате, като използвате Expression Blend
4. Отворете Microsoft Expression Blend
5. Създайте нов проект за приложение, за да задържите временно проекта си. За да направите това, отворете досие и след това изберете Нов проект
6. В Нов проект изберете диалоговия прозорец Silverlight тип проект и след това изберете Приложение на Silverlight 3 шаблон. Задайте името на DesignHelloPhone, изберете подходящо местоположение и запазете езика като Visual C #, след което щракнете върху Добре.
7. В Visual Studio щракнете двукратно върху App.xaml в Разтвор за изследване за да отворите този файл в редактора. Сега отворете изгледа XAML и след това изберете и копирайте целия Application.Resources раздел в клипборда
8. Отново отворете Expression Blend, разгънете DesignHelloPhone проект в Проекти панел и щракнете двукратно върху него App.xaml за да отворите файла
9. Насочете към Активен преглед на документи в изглед и изберете XAML View.
10. Намерете Application.Resources раздел в този файл - той трябва да е празен - и след това поставете съдържанието на клипборда, за да го замените.
11. Сега намерете секцията в новия текст, който е ограничен с коментара " ***** LISTBOX / LISTBOXITEM TEMPLATES *****"; тя съдържа стилове, които не са съвместими с проект Silverlight 3. Изтрийте целия раздел между началните и крайните разделители.
12. Сега намиране на Приложение елемент в горната част на файла и въведете нова декларация за пространство на имена, за да препратите към Система пространство за имена в mscorlib монтаж, както е показано по-долу.
xmlns:system='clr-namespace:System;assembly=mscorlib' > # FF1F1F1F черно ?> var13 ->
13. Сега запазете променените App.xaml в експресионна смес.
14. След това отворете Visual Studio отново и отворете MainPage.xaml файл в изгледа XAML. След това изберете и копирайте решетка елемент име LayoutRoot включително и децата си в клипборда.
15. Връщане към Expression Blend, отворете MainPage.xaml файл в изгледа XAML и след това поставете съдържанието на клипборда, за да смените празното LayoutRootрешетка елемент в този файл.
16. В MainPage.xaml файл, намерете корена UserControl елемент и промяна на стойностите на височина атрибут на 800 и широчина атрибут на 480.
17. Върнете се в Visual Studio, щракнете с десния бутон на мишката MainPage.xaml.cs в Разтвор за изследване и изберете Преглед на кода, След това копирайте ClickMeButton_Click манипулатор на събития в клипборда.
18. Накрая, върнете се към Expression Blend, разгънете MainPage.xaml възел в Проекти панел, щракнете двукратно върху MainPage.xaml.cs за да отворите файла в редактора, и поставете кода в клипборда в Главна страница клас.
Сега успешно възпроизведохме нашия проект в изразителна смес. За да създадете дизайн за персонализирания бутон, прочетете следващия урок, който ще бъде публикуван утре.
