Структура проекта WPF
При создании проекта WPF открываются несколько файлов и вкладок. Два основных файла создаются для каждого окна приложения:
Основные файлы окна
- Файл с расширением .xaml: Описывает дизайн окна. Здесь изменяются размеры окна, добавляются объекты, применяются стили и создаётся пользовательский интерфейс. Язык разметки XAML подобен HTML или XML, объекты создаются через теги.
- Файл с расширением .xaml.cs: Описывает функциональность окна. Здесь добавляется код для обработки событий, например, нажатия кнопок. Каждый файл .xaml имеет соответствующий файл .xaml.cs.
Среда разработки: дополнительные окна
Помимо файлов проекта, в среде разработки открываются другие окна:
- Обозреватель решений: Содержит все файлы проекта, включая App.config (глобальные характеристики проекта) и MainWindow.xaml (основной класс приложения). MainWindow.xaml.cs содержит основной метод Main, запускающий программу.
- Окно свойств: Позволяет устанавливать свойства объектов на странице. Выбор объекта меняет доступные свойства (внешний вид, размер шрифта, цвет фона и др.).
- Панель элементов: Содержит элементы WPF (кнопки, текстовые поля и т.д.), которые можно перетаскивать в окно приложения.
Создание калькулятора
Настройка основного окна
Настроим название и размеры окна:
- Название программы: «Калькулятор»
- Высота: 350 пикселей
- Ширина: 500 пикселей
Добавим основной контейнер (Grid) с именем mainGrid и белым фоном:
<Grid x_Name="mainGrid" Background="White">
</Grid>
Создадим 4 столбца и 5 рядов в Grid для размещения элементов калькулятора:
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
Добавим текстовое поле (TextBlock) для отображения результатов вычислений с именем txtLabel, занимающее все четыре столбца:
<TextBlock x_Name="txtLabel" Grid.Row="0" Grid.ColumnSpan="4" Text=""/>
Добавим кнопки с цифрами и операциями. Размещение кнопок осуществляется с помощью атрибутов Grid.Row и Grid.Column.
Добавление функциональности
В файле .xaml.cs добавим обработчик событий для кнопок:
private void Button_Click(object sender, RoutedEventArgs e)
{
string str = ((Button)sender).Content.ToString();
if (str == "C")
{
txtLabel.Text = "";
}
else if (str == "=")
{
txtLabel.Text = new DataTable().Compute(txtLabel.Text, "").ToString();
}
else
{
txtLabel.Text += str;
}
}
Этот код обрабатывает нажатия кнопок: «C» очищает текстовое поле, «=» выполняет вычисление (с использованием DataTable), остальные кнопки добавляют свои значения в текстовое поле.
В этом уроке мы изучили основы WPF, создав простой калькулятор. Мы работали с XAML для дизайна и C# для функциональности. В следующих уроках улучшим дизайн и добавим функции. Рекомендуется самостоятельно поработать с настройками объектов через окно свойств.