
- •Пошаговое руководство. Начало работы с wpf
- •8 Из 9 оценили этот материал как полезный - Оценить эту тему
- •Добавление файлов в приложение
- •Добавление элементов управления
- •Добавление изображения и заголовка
- •Добавление кода для обработки событий
- •Создание пользовательского интерфейса для страницы ExpenseReportPage
- •Цвета стилей
- •Привязка данных к элементу управления
- •Подключение данных к элементам управления
- •Стилизация данных с помощью шаблонов данных
Пошаговое руководство. Начало работы с wpf
.NET Framework 4
Другие версии
-
.NET Framework 4.5
-
.NET Framework 3.5
8 Из 9 оценили этот материал как полезный - Оценить эту тему
В этом пошаговом руководстве представлены общие сведения о разработке приложений Windows Presentation Foundation (WPF), включающих в себя элементы, которые являются общими для большинства приложений WPF: разметку Extensible Application Markup Language (XAML), код программной части, определения приложения, элементы управления, макет, привязку данных и стили.
В этом пошаговом руководстве описывается разработка простого приложения WPF.
-
Определение XAML-кода для разработки user interface (UI) приложения.
-
Написание кода для построения модели поведения приложения.
-
Создание управляющих определений приложения.
-
Добавление элементов управления и создание макета, входящих в состав UI приложения.
-
Создание стилей, обеспечивающих унифицированный внешний вид компонентов приложения UI.
-
Связывание UI с данными для заполнения UI из данных и синхронизации данных с UI.
Изучив данное пошаговое руководство, вы сможете создать автономное приложение Windows, которое позволит пользователям просматривать отчеты о расходах выбранных лиц.Приложение будет состоять из нескольких страниц WPF, размещенных в окне, напоминающем браузер.
Пример кода, который используется в этом пошаговом руководстве, доступен как для Microsoft Visual Basic, так и для C#; см. раздел Введение в разработку приложений WPF.
Предварительные
требования
Ниже приведены компоненты, необходимые для выполнения данного пошагового руководства.
-
Visual Studio 2010
Дополнительные сведения об установке Visual Studio см. в разделе Установка Visual Studio.
Создание проекта приложения
В этом разделе создается инфраструктура приложения, включающая определение приложения, две страницы и изображение.
-
Создайте новый проект приложения WPF на языке Visual Basic или Visual C# с именем ExpenseIt.Дополнительные сведения см. в разделе Практическое руководство. Создание нового проекта приложения WPF.
Примечание
В этом пошаговом руководстве используется элемент управления DataGrid, доступных в платформе .NET Framework 4.Необходимо, чтобы проект предназначался для платформы .NET Framework 4.Дополнительные сведения см. в разделе Практическое руководство. Указание конкретной версии или профиля платформы .NET Framework.
-
Откройте файл Application.xaml (Visual Basic) или App.xaml (C#).
Этот файл XAML определяет приложение WPF и все его ресурсы. Данный файл также используется для указания UI, автоматически отображаемого при запуске приложения (в данном случае — MainWindow.xaml).
XAML-код должен выглядеть следующим образом в Visual Basic:
XAML
Копировать
<Application x:Class="Application"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml">
<Application.Resources>
</Application.Resources>
</Application>
А в C# он должен выглядеть следующим образом:
XAML
Копировать
<Application x:Class="ExpenseIt.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml">
<Application.Resources>
</Application.Resources>
</Application>
-
Откройте файл MainWindow.xaml.
Этот XAML-файл представляет главное окно приложения, в котором отображается созданное содержимое страниц.Класс Window определяет свойства окна, такие как заголовок, размер и значок, и обрабатывает события, такие как открытие и закрытие окна.
-
Замените элемент Window на NavigationWindow.
Приложение будет переходить к различному содержимому согласно действиям пользователя.Поэтому главное окно Window необходимо изменить на NavigationWindow.Класс NavigationWindow наследует все свойства класса Window.Элемент NavigationWindow в XAML-файле создает экземпляр класса NavigationWindow.Дополнительные сведения см. в разделе Общие сведения о переходах.
-
Измените следующие свойства элемента NavigationWindow.
-
Задайте свойству Title значение "ExpenseIt".
-
Задайте свойству Width значение 500 пикселей.
-
Задайте свойству Height значение 350 пикселей.
-
Удалите элементы Grid между тегами NavigationWindow.
XAML-код должен выглядеть следующим образом в Visual Basic:
XAML
Копировать
<NavigationWindow x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="ExpenseIt" Height="350" Width="500">
</NavigationWindow>
А в C# он должен выглядеть следующим образом:
XAML
Копировать
<NavigationWindow x:Class="ExpenseIt.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="ExpenseIt" Height="350" Width="500">
</NavigationWindow>
-
Откройте файл MainWindow.xaml.vb или MainWindow.xaml.cs.
В этом файле кода программной части содержится код обработки событий, объявленных в файле MainWindow.xaml.В этом файле содержится разделяемый класс окна, определенного в XAML-коде.
-
Если используется язык C#, измените класс
MainWindow
так, чтобы он наследовался от класса NavigationWindow.
В языке Visual Basic это выполняется автоматически при изменении окна в XAML-коде.
Код должен выглядеть следующим образом.
C#
VB
Копировать
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace ExpenseIt
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : NavigationWindow
{
public MainWindow()
{
InitializeComponent();
}
}
}