Като част от серията настойнически на Windows Phone сега ще се научим да създаваме елементите на потребителския интерфейс за HelloPhone приложение. Приложението е много просто. След като бъде завършен, потребителският интерфейс на приложението ще съдържа надпис, текстово поле и бутон.
За да използвате приложението, въвеждате текст в текстовото поле и след това, когато кликнете върху бутона, приложението показва банер с текста, който сте въвели. Това ще изглежда като следната фигура.
1. В Разтвор за изследване, кликнете два пъти MainPage.xaml за да отворите този файл в дизайнера.
Проектантът предоставя два отделни изгледа за редактиране на XAML файлове, Дизайн и XAML изглед. В режим Дизайн имате дизайн на емулатор, в който можете да плъзгате и пускате контроли от кутията с инструменти, както и да избирате, преоразмерявате, премествате и настройвате свойствата на съществуващите контроли. В режим XAML имате редактор за маркиране, който ви позволява да редактирате XAML кода в страницата. Можете да работите с някой от режимите. Също така имате разделен режим, като прозорецът на редактора показва едновременно и двата изгледа.
2. В тази задача основно се фокусираме върху ръчното редактиране на XAML. След като завъртите кодиращата част, можете да се върнете към дизайнерския изглед, за да видите резултатите. Можете също така да имате изглед в цял екран XAML.
3. В маркера XAML, генериран от стандартния шаблон за приложение на Windows Phone, намерете решетка контейнер елемент име LayoutRoot, Целта му е да подреди елементите на страницата. Вътре в него RowDefinition property, въведете допълнителен ред между двата съществуващи реда и задайте стойността му височина собственост на Автоматичен, Този ред скоро ще включва текстово поле и бутон.
4. Корен решетка елементът също така съдържа някои вложени елементи, всеки от които е определен за различен ред на външната решетка чрез дефиниране на a Grid.Row Имот. Сега намерете елемента на мрежата с име TitleGrid и Задайте текстовата характеристика на първия елемент на текстовия блок в вътрешната решетка на " Windows Phone 7 Series ". по същия начин Здравей, телефон се добавя към следващия текстов блок.
5. Сега, Намерете решетка елемент име ContentGrid, го присвоите на ред 1, която първоначално е първоначално празна, и поставете следния знак XAML в този елемент.
6. За да завършите дизайна на страницата, добавете трети ред, за да задържите банера със съобщението, въведено от потребителя.За да създадете този ред, въведете следната маркировка XAML непосредствено преди крайния маркер на външната решетка.
7. Щракнете върху Дизайн да прегледате и да разгледате разположението на контролите на страницата.
В следващия ни урок ще се научим как да "Обработка на събития от потребителския интерфейс".
