Пошаговое руководство. Начало работы с 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.

Создание проекта приложения

В этом разделе создается инфраструктура приложения, включающая определение приложения, две страницы и изображение.

1. Создайте новый проект приложения WPF на языке Visual Basic или Visual C# с именем ExpenseIt.Дополнительные сведения см. в разделе Практическое руководство. Создание нового проекта приложения WPF.

   Примечание

   В этом пошаговом руководстве используется элемент управления DataGrid, доступных в платформе .NET Framework 4.Необходимо, чтобы проект предназначался для платформы .NET Framework 4.Дополнительные сведения см. в разделе Практическое руководство. Указание конкретной версии или профиля платформы .NET Framework.

2. Откройте файл 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>

3. Откройте файл MainWindow.xaml.

Этот XAML-файл представляет главное окно приложения, в котором отображается созданное содержимое страниц.Класс Window определяет свойства окна, такие как заголовок, размер и значок, и обрабатывает события, такие как открытие и закрытие окна.

4. Замените элемент Window на NavigationWindow.

Приложение будет переходить к различному содержимому согласно действиям пользователя.Поэтому главное окно Window необходимо изменить на NavigationWindow.Класс NavigationWindow наследует все свойства класса Window.Элемент NavigationWindow в XAML-файле создает экземпляр класса NavigationWindow.Дополнительные сведения см. в разделе Общие сведения о переходах.

5. Измените следующие свойства элемента 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>

6. Откройте файл MainWindow.xaml.vb или MainWindow.xaml.cs.

В этом файле кода программной части содержится код обработки событий, объявленных в файле MainWindow.xaml.В этом файле содержится разделяемый класс окна, определенного в XAML-коде.

7. Если используется язык 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();

}

}

}