Общие сведения о WPF WPF overview

Платформа Windows Presentation Foundation (WPF) позволяет создавать клиентские приложения для настольных систем Windows с привлекательным пользовательским интерфейсом. Windows Presentation Foundation (WPF) lets you create desktop client applications for Windows with visually stunning user experiences.

В основе WPF лежит независимый от разрешения векторный модуль визуализации, использующий возможности современного графического оборудования. The core of WPF is a resolution-independent and vector-based rendering engine that is built to take advantage of modern graphics hardware. Возможности этого модуля расширяются с помощью комплексного набора функций разработки приложений, которые включают в себя язык XAML, элементы управления, привязку к данным, макет, двумерную и трехмерную графику, анимацию, стили, шаблоны, документы, мультимедиа, текст и типографические функции. WPF extends the core with a comprehensive set of application-development features that include Extensible Application Markup Language (XAML), controls, data binding, layout, 2D and 3D graphics, animation, styles, templates, documents, media, text, and typography. WPF является частью .NET, поэтому вы можете создавать приложения, включающие другие элементы .NET API. WPF is part of .NET, so you can build applications that incorporate other elements of the .NET API.

Этот обзор предназначен для новичков: в нем рассматриваются ключевые возможности и понятия WPF. This overview is intended for newcomers and covers the key capabilities and concepts of WPF.

Программирование с помощью WPF Program with WPF

WPF существует в виде подмножества типов .NET, которые по большей части находятся в пространстве имен System.Windows. WPF exists as a subset of .NET types that are (for the most part) located in the System.Windows namespace. Если ранее вы создавали приложения с помощью .NET, используя управляемые технологии, такие как ASP.NET и Windows Forms, основные принципы программирования с помощью WPF должны быть вам знакомы: вы создаете экземпляры классов, задаете свойства, вызываете методы и обрабатываете события — все это с использованием своего любимого языка программирования .NET, например C# или Visual Basic. If you have previously built applications with .NET using managed technologies like ASP.NET and Windows Forms, the fundamental WPF programming experience should be familiar; you instantiate classes, set properties, call methods, and handle events, using your favorite .NET programming language, such as C# or Visual Basic.

WPF включает в себя дополнительные конструкции программирования, которые расширяют возможности свойств и событий: свойства зависимостей и перенаправленные события. WPF includes additional programming constructs that enhance properties and events: dependency properties and routed events.

Разметка и код программной части Markup and code-behind

WPF позволяет разрабатывать приложения, используя как разметку, так и код программной части, что привычно для разработчиков на ASP.NET. WPF lets you develop an application using both markup and code-behind, an experience with which ASP.NET developers should be familiar. Разметка XAML обычно используется для определения внешнего вида приложения, а управляемые языки программирования (код программной части) — для реализации его поведения. You generally use XAML markup to implement the appearance of an application while using managed programming languages (code-behind) to implement its behavior. Такое разделение внешнего вида и поведения имеет ряд преимуществ. This separation of appearance and behavior has the following benefits:

Затраты на разработку и обслуживание снижаются, так как разметка, определяющая внешний вид, не связана тесно с кодом, обуславливающим поведение. Development and maintenance costs are reduced because appearance-specific markup is not tightly coupled with behavior-specific code.

Повышается эффективность разработки, так как дизайнеры, занимающиеся внешним видом приложения, могут работать параллельно с разработчиками, реализующими поведение приложения. Development is more efficient because designers can implement an application’s appearance simultaneously with developers who are implementing the application’s behavior.

Глобализация и локализация приложений WPF упрощена. Globalization and localization for WPF applications is simplified.

разметку Markup

XAML — это язык разметки на основе XML, который служит для определения внешнего вида приложения в декларативной форме. XAML is an XML-based markup language that implements an application’s appearance declaratively. Обычно он используется для создания окон, страниц и пользовательских элементов управления, а также их заполнения элементами управления, фигурами и графическими элементами. You typically use it to create windows, dialog boxes, pages, and user controls, and to fill them with controls, shapes, and graphics.

В следующем примере XAML используется для реализации внешнего вида окна, содержащего одну кнопку: The following example uses XAML to implement the appearance of a window that contains a single button:

Этот код XAML определяет окно и кнопку с помощью элементов Window и Button соответственно. Specifically, this XAML defines a window and a button by using the Window and Button elements, respectively. Каждый элемент настраивается с помощью атрибутов, например атрибута Window элемента Title , определяющего текст заголовка окна. Each element is configured with attributes, such as the Window element’s Title attribute to specify the window’s title-bar text. Во время выполнения WPF преобразует элементы и атрибуты, определенные в разметке, в экземпляры классов WPF. At run time, WPF converts the elements and attributes that are defined in markup to instances of WPF classes. Например, элемент Window преобразуется в экземпляр класса Window , свойство Title которого является значением атрибута Title . For example, the Window element is converted to an instance of the Window class whose Title property is the value of the Title attribute.

На следующем рисунке показан пользовательский интерфейс, определяемый XAML в предыдущем примере: The following figure shows the user interface (UI) that is defined by the XAML in the previous example:

Так как язык XAML основан на XML, создаваемый с его помощью пользовательский интерфейс образует иерархию вложенных элементов, известную как дерево элементов. Since XAML is XML-based, the UI that you compose with it is assembled in a hierarchy of nested elements known as an element tree. Дерево элементов обеспечивает логичный и интуитивно понятный способ создания пользовательских интерфейсов и управления ими. The element tree provides a logical and intuitive way to create and manage UIs.

Файл с кодом программной части Code-behind

При разработке поведения приложения главной задачей является обеспечение реакции на действия пользователя, включая обработку событий (таких как выбор пункта меню или нажатие на кнопку), и вызов в ответ бизнес-логики и логики доступа к данным. The main behavior of an application is to implement the functionality that responds to user interactions, including handling events (for example, clicking a menu, tool bar, or button) and calling business logic and data access logic in response. В WPF такое поведение реализуется в коде, связанном с разметкой. In WPF, this behavior is implemented in code that is associated with markup. Этот код называется кодом программной части. This type of code is known as code-behind. В следующем примере показана обновленная разметка из предыдущего примера и кода программной части: The following example shows the updated markup from the previous example and the code-behind:

В этом примере в коде программной части реализован класс, производный от класса Window . In this example, the code-behind implements a class that derives from the Window class. С помощью атрибута x:Class разметка связывается с классом в коде программной части. The x:Class attribute is used to associate the markup with the code-behind class. Метод InitializeComponent вызывается из конструктора класса кода программной части для слияния пользовательского интерфейса, определенного в разметке, с классом кода программной части. InitializeComponent is called from the code-behind class’s constructor to merge the UI that is defined in markup with the code-behind class. (создается InitializeComponent автоматически при построении приложения, поэтому его не нужно реализовывать вручную.) Сочетание x:Class и InitializeComponent гарантирует, что ваша реализация будет правильно инициализирована при создании. ( InitializeComponent is generated for you when your application is built, which is why you don’t need to implement it manually.) The combination of x:Class and InitializeComponent ensure that your implementation is correctly initialized whenever it is created. Класс кода программной части также реализует обработчик событий Click кнопки. The code-behind class also implements an event handler for the button’s Click event. При нажатии на кнопку обработчик событий выводит окно сообщения, вызывая метод System.Windows.MessageBox.Show . When the button is clicked, the event handler shows a message box by calling the System.Windows.MessageBox.Show method.

На следующем рисунке показан результат нажатия кнопки: The following figure shows the result when the button is clicked:

Элементы управления Controls

Возможности взаимодействия с пользователем, обеспечиваемые моделью приложения, реализуются с помощью сконструированных элементов управления. The user experiences that are delivered by the application model are constructed controls. В WPF элемент управления — это общий термин, который относится к категории классов WPF, размещаемых в окне или на странице, имеющих пользовательский интерфейс и реализующих некоторое поведение. In WPF, control is an umbrella term that applies to a category of WPF classes that are hosted in either a window or a page, have a user interface, and implement some behavior.

Дополнительные сведения см. в разделе элементы управления. For more information, see Controls.

Функциональная классификация элементов управления WPF WPF controls by function

Ниже перечислены встроенные элементы управления WPF. The built-in WPF controls are listed here:

Кнопки: Button и RepeatButton . Buttons: Button and RepeatButton.

Отображение данных: DataGrid , ListView и TreeView . Data Display: DataGrid, ListView, and TreeView.

Отображение и выбор даты: Calendar и DatePicker . Date Display and Selection: Calendar and DatePicker.

Цифровой рукописный ввод: InkCanvas и InkPresenter . Digital Ink: InkCanvas and InkPresenter.

Входные данные: TextBox , RichTextBox и PasswordBox . Input: TextBox, RichTextBox, and PasswordBox.

Меню: ContextMenu , Menu и ToolBar . Menus: ContextMenu, Menu, and ToolBar.

Ввод данных и команды Input and commands

Элементы управления чаще всего используются для определения ввода данных пользователем и реагирования на него. Controls most often detect and respond to user input. Система ввода WPF использует как прямые, так и перенаправленные события для поддержки ввода текста, управления фокусом и определения положения указателя мыши. The WPF input system uses both direct and routed events to support text input, focus management, and mouse positioning.

Приложения часто предъявляют сложные требования к вводу. Applications often have complex input requirements. WPF предоставляет систему команд, которая отделяет действия по вводу данных пользователем от кода, реагирующего на эти действия. WPF provides a command system that separates user-input actions from the code that responds to those actions.

Layout Layout

При создании пользовательского интерфейса вы компонуете элементы управления, настраивая их расположение и размер. When you create a user interface, you arrange your controls by location and size to form a layout. Основным требованием любого макета является адаптация к изменениям размеров окна и параметров экрана. A key requirement of any layout is to adapt to changes in window size and display settings. Платформа WPF избавляет вас от необходимости писать код для адаптации макета к таким условиям, предоставляя первоклассную расширяемую систему макета. Rather than forcing you to write the code to adapt a layout in these circumstances, WPF provides a first-class, extensible layout system for you.

Ключевым элементом системы макета является относительное позиционирование, которое упрощает адаптацию к меняющимся характеристикам окна и экрана. The cornerstone of the layout system is relative positioning, which increases the ability to adapt to changing window and display conditions. Кроме того, система макета управляет взаимодействием между элементами управления для определения макета. In addition, the layout system manages the negotiation between controls to determine the layout. Взаимодействие протекает в два этапа: сначала элемент управления сообщает родительскому объекту о требуемом расположении и размере, а затем родительский объект сообщает родительскому элементу, какое пространство он может занять. The negotiation is a two-step process: first, a control tells its parent what location and size it requires; second, the parent tells the control what space it can have.

Система макета доступна дочерним элементам управления посредством базовых классов WPF. The layout system is exposed to child controls through base WPF classes. Для стандартных макетов, таких как сетка, наложение и закрепление, в WPF имеется несколько элементов управления макетом. For common layouts such as grids, stacking, and docking, WPF includes several layout controls:

Canvas: дочерние элементы управления предоставляют собственный макет. Canvas: Child controls provide their own layout.

DockPanel: дочерние элементы управления выравниваются по краям панели. DockPanel: Child controls are aligned to the edges of the panel.

Grid: дочерние элементы управления упорядочиваются по строкам и столбцам. Grid: Child controls are positioned by rows and columns.

StackPanel: дочерние элементы управления располагаются с наложением по вертикали или по горизонтали. StackPanel: Child controls are stacked either vertically or horizontally.

VirtualizingStackPanel: дочерние элементы управления виртуализируются и располагаются в линию по горизонтали или по вертикали. VirtualizingStackPanel: Child controls are virtualized and arranged on a single line that is either horizontally or vertically oriented.

WrapPanel: дочерние элементы управления располагаются в порядке слева направо и переносятся на следующую строку, если не помещаются в текущей. WrapPanel: Child controls are positioned in left-to-right order and wrapped to the next line when there are more controls on the current line than space allows.

В следующем примере DockPanel для размещения нескольких TextBox элементов управления используется. The following example uses a DockPanel to lay out several TextBox controls:

Элемент управления DockPanel позволяет дочерним элементам TextBox сообщать, как они должны быть упорядочены. The DockPanel allows the child TextBox controls to tell it how to arrange them. Для этого в DockPanel реализовано присоединенное свойство Dock , которое доступно дочерним элементам управления и позволяет каждому из них указывать стиль закрепления. To do this, the DockPanel implements a Dock attached property that is exposed to the child controls to allow each of them to specify a dock style.

Свойство, которое реализуется родительским элементом управления для использования дочерними элементами, представляет собой конструкцию WPF, называемую присоединенным свойством. A property that’s implemented by a parent control for use by child controls is a WPF construct called an attached property.

На следующем рисунке показан результат разметки XAML в предыдущем примере: The following figure shows the result of the XAML markup in the preceding example:

привязка данных, Data binding

Большинство приложений предоставляют пользователям возможность просматривать и редактировать данные. Most applications are created to provide users with the means to view and edit data. Для приложений WPF задачи хранения данных и доступа к ним уже обеспечиваются такими технологиями, как SQL Server и ADO .NET. For WPF applications, the work of storing and accessing data is already provided for by technologies such as SQL Server and ADO .NET. После получения доступа к данным и их загрузки в управляемые объекты приложения WPF начинается самое сложное. After the data is accessed and loaded into an application’s managed objects, the hard work for WPF applications begins. Фактически этот процесс состоит из двух этапов: Essentially, this involves two things:

копирование данных из управляемых объектов в элементы управления для их отображения и редактирования; Copying the data from the managed objects into controls, where the data can be displayed and edited.

обеспечение копирования изменений, внесенных в данные с помощью элементов управления, обратно в управляемые объекты. Ensuring that changes made to data by using controls are copied back to the managed objects.

Чтобы упростить разработку приложений, платформа WPF предоставляет механизм привязки данных для автоматического выполнения этих действий. To simplify application development, WPF provides a data binding engine to automatically perform these steps. Основной элемент механизма привязки данных — класс Binding , задачей которого является привязка элемента управления (целевого объекта привязки) к объекту данных (источнику привязки). The core unit of the data binding engine is the Binding class, whose job is to bind a control (the binding target) to a data object (the binding source). Эта связь показана на рисунке ниже. This relationship is illustrated by the following figure:

В следующем примере показано, как привязать элемент управления TextBox к экземпляру пользовательского объекта Person . The next example demonstrates how to bind a TextBox to an instance of a custom Person object. Реализация Person показана в следующем коде: The Person implementation is shown in the following code:

Следующая разметка привязывает объект TextBox к экземпляру пользовательского Person объекта: The following markup binds the TextBox to an instance of a custom Person object:

В этом примере экземпляр класса Person создается в коде программной части и устанавливается в качестве контекста данных для DataBindingWindow . In this example, the Person class is instantiated in code-behind and is set as the data context for the DataBindingWindow . В разметке свойство Text элемента управления TextBox привязывается к свойству Person.Name (с помощью синтаксической конструкции « » языка XAML). In markup, the Text property of the TextBox is bound to the Person.Name property (using the » » XAML syntax). Этот код XAML предписывает платформе WPF привязать элемент управления TextBox к объекту Person , который хранится в свойстве DataContext окна. This XAML tells WPF to bind the TextBox control to the Person object that is stored in the DataContext property of the window.

Механизм привязки данных WPF поддерживает дополнительные возможности, включая проверку, сортировку, фильтрацию и группировку. The WPF data binding engine provides additional support that includes validation, sorting, filtering, and grouping. Кроме того, привязка данных поддерживает использование шаблонов данных с целью создания настраиваемого пользовательского интерфейса для связанных данных, если пользовательский интерфейс на основе стандартных элементов управления WPF не удовлетворяет требованиям. Furthermore, data binding supports the use of data templates to create custom user interface for bound data when the user interface displayed by the standard WPF controls is not appropriate.

Более подробную информацию см. в разделе Общие сведения о привязке данных. For more information, see Data binding overview.

Графика Graphics

Платформа WPF предоставляет широкий, гибкий и масштабируемый набор графических функций, который обладает перечисленными ниже преимуществами. WPF introduces an extensive, scalable, and flexible set of graphics features that have the following benefits:

Независимость графики от разрешения и устройства. Resolution-independent and device-independent graphics. Основной единицей измерения в графической системе WPF является аппаратно-независимый пиксель, размер которого составляет 1/96 дюйма вне зависимости от разрешения экрана. Это создает основу для независимой от разрешения и аппаратной платформы отрисовки. The basic unit of measurement in the WPF graphics system is the device-independent pixel, which is 1/96th of an inch, regardless of actual screen resolution, and provides the foundation for resolution-independent and device-independent rendering. Каждый аппаратно-независимый пиксель автоматически масштабируется в соответствии с заданным в системе количеством точек на дюйм (DPI). Each device-independent pixel automatically scales to match the dots-per-inch (dpi) setting of the system it renders on.

Повышение точности. Improved precision. Система координат WPF основана на числах двойной точности с плавающей запятой, а не числах одинарной точности. The WPF coordinate system is measured with double-precision floating-point numbers rather than single-precision. Значения преобразования и прозрачности также выражаются числами двойной точности. Transformations and opacity values are also expressed as double-precision. Платформа WPF также поддерживает широкую цветовую палитру (scRGB) и имеет встроенную поддержку управления входными данными из разных цветовых схем. WPF also supports a wide color gamut (scRGB) and provides integrated support for managing inputs from different color spaces.

Расширенная поддержка графики и анимации. Advanced graphics and animation support. Платформа WPF упрощает программирование графики, автоматически управляя анимированными сценами. Вам не нужно беспокоиться об обработке сцен, циклах отрисовки и билинейной интерполяции. WPF simplifies graphics programming by managing animation scenes for you; there is no need to worry about scene processing, rendering loops, and bilinear interpolation. Кроме того, WPF обеспечивает поддержку проверки попадания и полную поддержку альфа-версии компоновки. Additionally, WPF provides hit-testing support and full alpha-compositing support.

Аппаратное ускорение. Hardware acceleration. Система графики WPF использует возможности графического оборудования, чтобы снизить нагрузку на ЦП. The WPF graphics system takes advantage of graphics hardware to minimize CPU usage.

Двумерные фигуры 2D shapes

WPF предоставляет библиотеку стандартных векторных двумерных фигур, таких как прямоугольники и эллипсы, которые показаны на рисунке ниже. WPF provides a library of common vector-drawn 2D shapes, such as the rectangles and ellipses that are shown in the following illustration:

Интересной особенностью фигур является то, что они предназначены не только для отображения. В них реализованы многие возможности элементов управления, включая ввод с клавиатуры и с помощью мыши. An interesting capability of shapes is that they are not just for display; shapes implement many of the features that you expect from controls, including keyboard and mouse input. В следующем примере показано MouseUp событие Ellipse обрабатываемого объекта: The following example shows the MouseUp event of an Ellipse being handled:

На следующем рисунке показано, что создается в приведенном выше коде. The following figure shows what is produced by the preceding code:

Двумерные геометрические объекты 2D geometries

Двумерные фигуры, предоставляемые WPF, включают в себя стандартный набор базовых фигур. The 2D shapes provided by WPF cover the standard set of basic shapes. Однако вам может потребоваться создать собственные фигуры, чтобы упростить разработку пользовательского интерфейса. However, you may need to create custom shapes to facilitate the design of a customized user interface. Для этой цели WPF предоставляет геометрические объекты. For this purpose, WPF provides geometries. На рисунке ниже демонстрируется использование геометрических объектов для создания пользовательской фигуры, которую можно нарисовать напрямую, применять как кисть или использовать для обрезки других фигур и элементов управления. The following figure demonstrates the use of geometries to create a custom shape that can be drawn directly, used as a brush, or used to clip other shapes and controls.

ОбъектыPath можно использовать для рисования замкнутых и незамкнутых фигур, нескольких фигур и даже криволинейных фигур. Path objects can be used to draw closed or open shapes, multiple shapes, and even curved shapes.

Объекты Geometry можно использовать для обрезки, проверки попадания и отрисовки двумерных графических данных. Geometry objects can be used for clipping, hit-testing, and rendering 2D graphic data.

Дополнительные сведения см. в разделе Общие сведения о геометрии. For more information, see Geometry overview.

Двумерные эффекты 2D effects

В число возможностей двумерной графики WPF входят визуальные эффекты, такие как градиенты, растровые изображения, рисунки, рисование с видео, вращение, масштабирование и наклон. A subset of WPF 2D capabilities includes visual effects, such as gradients, bitmaps, drawings, painting with videos, rotation, scaling, and skewing. Все это достигается с помощью кистей; на следующем рисунке показаны некоторые примеры. These are all achieved with brushes; the following figure shows some examples:

Дополнительные сведения см. в разделе Общие сведения о кистях WPF. For more information, see WPF brushes overview.

Трехмерная отрисовка 3D rendering

WPF также включает возможности трехмерной отрисовки, которые интегрируются с двухмерной графикой, что позволяет создавать более интересные и интересные пользовательские интерфейсы. WPF also includes 3D rendering capabilities that integrate with 2D graphics to allow the creation of more exciting and interesting user interfaces. Например, на следующем рисунке показаны двумерные изображения, отображаемые на трехмерных фигурах: For example, the following figure shows 2D images rendered onto 3D shapes:

Дополнительные сведения см. в разделе Обзор трехмерной графики. For more information, see 3D graphics overview.

Анимация Animation

Поддержка анимации в WPF позволяет применять к элементам управления такие эффекты, как увеличение, дрожание, вращение и исчезание, создавать интересные эффекты смены страниц и другие эффекты. WPF animation support lets you make controls grow, shake, spin, and fade, to create interesting page transitions, and more. Вы можете анимировать большинство классов WPF, даже настраиваемые классы. You can animate most WPF classes, even custom classes. На следующем рисунке показана простая анимация в действии: The following figure shows a simple animation in action:

Дополнительные сведения см. в разделе Общие сведения об анимации. For more information, see Animation overview.

Мультимедиа Media

Одни из способов передачи более информативного содержимого — использовать аудиовизуальные средства. One way to convey rich content is through the use of audiovisual media. WPF обеспечивает специальную поддержку изображений, видео и звука. WPF provides special support for images, video, and audio.

Изображения Images

Изображения присутствуют в большинстве приложений, и платформа WPF предоставляет несколько способов их использования. Images are common to most applications, and WPF provides several ways to use them. На рисунке ниже показан пользовательский интерфейс со списком, содержащим эскизы. The following figure shows a user interface with a list box that contains thumbnail images. При выборе эскиза изображение отображается в полном размере. When a thumbnail is selected, the image is shown full-size.

Дополнительные сведения см. в разделе Общие сведения о работе с образами. For more information, see Imaging overview.

Видео и звук Video and audio

Элемент управления MediaElement позволяет воспроизводить как видео, так и звук и достаточно гибок для того, чтобы служить основой для пользовательского мультимедиапроигрывателя. The MediaElement control is capable of playing both video and audio, and it is flexible enough to be the basis for a custom media player. Следующая разметка XAML реализует проигрыватель мультимедиа: The following XAML markup implements a media player:

В окне на следующем рисунке показан MediaElement элемент управления в действии: The window in the following figure shows the MediaElement control in action:

Дополнительные сведения см. в разделе Графика и мультимедиа. For more information, see Graphics and multimedia.

Текст и типографическая разметка Text and typography

Чтобы упростить высококачественную отрисовку текста, платформа WPF предоставляет следующие возможности: To facilitate high-quality text rendering, WPF offers the following features:

поддержка шрифтов OpenType; OpenType font support.

усовершенствования ClearType; ClearType enhancements.

высокая производительность за счет аппаратного ускорения; High performance that takes advantage of hardware acceleration.

интеграция текста с мультимедиа, графикой и анимацией; Integration of text with media, graphics, and animation.

поддержка международных шрифтов и резервных механизмов. International font support and fallback mechanisms.

В качестве демонстрации интеграции текста с графикой на следующем рисунке показано применение украшений текста. As a demonstration of text integration with graphics, the following figure shows the application of text decorations:

Настройка приложений WPF Customize WPF apps

До сих пор мы рассматривали основные строительные блоки WPF для разработки приложений. Up to this point, you’ve seen the core WPF building blocks for developing applications. Для размещения и предоставления содержимого приложения, состоящего в основном из элементов управления, используется модель приложения. You use the application model to host and deliver application content, which consists mainly of controls. Для упрощения размещения элементов управления в пользовательском интерфейсе и сохранения их компоновки в случае изменения размера окна или параметров экрана используется система макета WPF. To simplify the arrangement of controls in a user interface, and to ensure the arrangement is maintained in the face of changes to window size and display settings, you use the WPF layout system. Так как большинство приложений предоставляют пользователям возможность взаимодействовать с данными, для сокращения объема работы, необходимой для интеграции пользовательского интерфейса с данными, используется привязка данных. Because most applications let users interact with data, you use data binding to reduce the work of integrating your user interface with data. Чтобы улучшить внешний вид приложения, используется широкий ряд средств графики, анимации и мультимедиа, предоставляемый платформой WPF. To enhance the visual appearance of your application, you use the comprehensive range of graphics, animation, and media support provided by WPF.

Однако зачастую этих основных средств недостаточно для создания уникального и визуально привлекательного пользовательского интерфейса. Often, though, the basics are not enough for creating and managing a truly distinct and visually stunning user experience. Стандартные элементы управления WPF могут не сочетаться с требуемым оформлением вашего приложения. The standard WPF controls might not integrate with the desired appearance of your application. Данные могут отображаться не самым эффективным образом. Data might not be displayed in the most effective way. Пользовательскому интерфейсу вашего приложения может в целом не подходить внешний вид тем Windows по умолчанию. Your application’s overall user experience may not be suited to the default look and feel of Windows themes. Наряду с другими типами расширяемости, технологии представления во многих случаях требуется визуальная расширяемость. In many ways, a presentation technology needs visual extensibility as much as any other type of extensibility.

По этой причине WPF предоставляет разнообразные механизмы создания уникальных пользовательских интерфейсов, включая модель мультимедийного содержимого для элементов управления, триггеры, шаблоны элементов управления и данных, стили, ресурсы пользовательского интерфейса, темы и обложки. For this reason, WPF provides a variety of mechanisms for creating unique user experiences, including a rich content model for controls, triggers, control and data templates, styles, user interface resources, and themes and skins.

Модель содержимого Content model

Основным назначением большинства элементов управления WPF является отображение содержимого. The main purpose of a majority of the WPF controls is to display content. В WPF тип и число элементов, составляющих содержимое элемента управления, называются моделью содержимого элемента управления. In WPF, the type and number of items that can constitute the content of a control is referred to as the control’s content model. Некоторые элементы могут содержать только один объект и только один тип содержимого. Например, содержимым элемента управления TextBox является строковое значение, присвоенное свойству Text . Some controls can contain a single item and type of content; for example, the content of a TextBox is a string value that is assigned to the Text property. В следующем примере задается содержимое TextBox : The following example sets the content of a TextBox:

На следующем рисунке показан результат. The following figure shows the result:

Другие элементы управления, однако, могут содержать несколько объектов с различным типом содержимого. Содержимым элемента управления Button, определяемым свойством Content, могут быть различные объекты, в том числе элементы управления макетом, текст, изображения и фигуры. Other controls, however, can contain multiple items of different types of content; the content of a Button, specified by the Content property, can contain a variety of items including layout controls, text, images, and shapes. В следующем примере показано Button содержимое с содержимым, включающим. DockPanel Label Border и MediaElement . The following example shows a Button with content that includes a DockPanel, a Label, a Border, and a MediaElement:

На следующем рисунке показано содержимое этой кнопки: The following figure shows the content of this button:

Дополнительную информацию о типах содержимого, поддерживаемого различными элементами управления, см. в разделе Модель содержимого WPF. For more information on the kinds of content that is supported by various controls, see WPF content model.

Триггеры Triggers

Хотя основным назначением разметки XAML является определение внешнего вида приложения, ее также можно использовать для реализации некоторых аспектов поведения приложения. Although the main purpose of XAML markup is to implement an application’s appearance, you can also use XAML to implement some aspects of an application’s behavior. Один из примеров — изменение внешнего вида приложения с помощью триггеров при выполнении пользователем определенных действий. One example is the use of triggers to change an application’s appearance based on user interactions. Дополнительные сведения см. в разделе Стили и шаблоны. For more information, see Styles and templates.

Шаблоны элементов управления Control templates

Пользовательские интерфейсы по умолчанию для элементов управления WPF обычно формируются на основе других элементов управления и фигур. The default user interfaces for WPF controls are typically constructed from other controls and shapes. Например, элемент управления Button состоит из элементов управления ButtonChrome и ContentPresenter . For example, a Button is composed of both ButtonChrome and ContentPresenter controls. ButtonChrome обеспечивает стандартный внешний вид кнопки, а ContentPresenter служит для вывода ее содержимого, определяемого свойством Content . The ButtonChrome provides the standard button appearance, while the ContentPresenter displays the button’s content, as specified by the Content property.

Иногда внешний вид элемента управления по умолчанию может не согласовываться с общим оформлением приложения. Sometimes the default appearance of a control may be incongruent with the overall appearance of an application. В этом случае можно использовать ControlTemplate для изменения пользовательского интерфейса элемента управления, не меняя его содержимое и поведение. In this case, you can use a ControlTemplate to change the appearance of the control’s user interface without changing its content and behavior.

В следующем примере показано, как изменить внешний вид с Button помощью ControlTemplate : The following example shows how to change the appearance of a Button by using a ControlTemplate:

В этом примере пользовательский интерфейс кнопки по умолчанию заменяется элементом Ellipse, имеющим темно-синюю границу и заполнение, определяемое RadialGradientBrush. In this example, the default button user interface has been replaced with an Ellipse that has a dark blue border and is filled using a RadialGradientBrush. В элементе управления ContentPresenter выводится содержимое элемента Button— текст «Click Me!» The ContentPresenter control displays the content of the Button, «Click Me!» При нажатии на элемент Button по-прежнему вызывается событие Click , что соответствует поведению элемента управления Button по умолчанию. When the Button is clicked, the Click event is still raised as part of the Button control’s default behavior. Результат показан на рисунке ниже. The result is shown in the following figure:

Шаблоны данных Data templates

В то время как шаблон элемента управления позволяет определять внешний вид элемента управления, шаблон данных дает возможность настраивать оформление его содержимого. Whereas a control template lets you specify the appearance of a control, a data template lets you specify the appearance of a control’s content. Шаблоны данных часто используются для оптимизации отображения привязанных данных. Data templates are frequently used to enhance how bound data is displayed. На следующем рисунке показан внешний вид по умолчанию для объекта, ListBox привязанного к коллекции Task объектов, у каждой задачи есть имя, описание и приоритет: The following figure shows the default appearance for a ListBox that is bound to a collection of Task objects, where each task has a name, description, and priority:

Оформление по умолчанию является стандартным для элемента управления ListBox. The default appearance is what you would expect from a ListBox. Однако оно предполагает, что для каждой задачи отображается только ее название. However, the default appearance of each task contains only the task name. Чтобы отобразить название, описание и приоритет задачи, нужно изменить оформление по умолчанию для элементов списка, привязанных к элементу управления ListBox , с помощью DataTemplate. To show the task name, description, and priority, the default appearance of the ListBox control’s bound list items must be changed by using a DataTemplate. Следующий код XAML определяет такие DataTemplate , которые применяются к каждой задаче с помощью ItemTemplate атрибута: The following XAML defines such a DataTemplate, which is applied to each task by using the ItemTemplate attribute:

На следующем рисунке показан результат выполнения этого кода: The following figure shows the effect of this code:

Обратите внимание на то, что элемент управления ListBox сохранил свое поведение и общий внешний вид. Изменилось только оформление содержимого, отображаемого в списке. Note that the ListBox has retained its behavior and overall appearance; only the appearance of the content being displayed by the list box has changed.

Дополнительные сведения см. в разделе Общие сведения о шаблонах данных. For more information, see Data templating overview.

Стили Styles

Стили позволяют разработчикам и дизайнерам стандартизировать внешний вид своего продукта. Styles enable developers and designers to standardize on a particular appearance for their product. Платформа WPF предоставляет строгую модель стилей, в основе которой лежит элемент Style . WPF provides a strong style model, the foundation of which is the Style element. В следующем примере создается стиль, который задает для каждого окна цвет фона для каждого Button из окон Orange : The following example creates a style that sets the background color for every Button on a window to Orange :

Так как этот стиль предназначен для всех элементов управления Button, он автоматически применяется ко всем кнопкам в окне, как показано на рисунке ниже. Because this style targets all Button controls, the style is automatically applied to all the buttons in the window, as shown in the following figure:

Дополнительные сведения см. в разделе Стили и шаблоны. For more information, see Styles and templates.

Ресурсы Resources

Элементы управления в приложении должны иметь одинаковое оформление, которое может включать любые элементы: от шрифтов и цвета фона до шаблонов элементов управления, шаблонов данных и стилей. Controls in an application should share the same appearance, which can include anything from fonts and background colors to control templates, data templates, and styles. Благодаря поддержке ресурсов пользовательского интерфейса в WPF можно инкапсулировать эти ресурсы в одном месте для повторного использования. You can use WPF’s support for user interface resources to encapsulate these resources in a single location for reuse.

В следующем примере определяется общий цвет фона, совместно используемый Button и Label . The following example defines a common background color that is shared by a Button and a Label:

Ресурс цвета фона реализуется с помощью элемента свойства Window.Resources . This example implements a background color resource by using the Window.Resources property element. Этот ресурс доступен всем дочерним элементам объекта Window. This resource is available to all children of the Window. Существует ряд различных областей действия ресурсов. Некоторые из них перечислены ниже в порядке их разрешения. There are a variety of resource scopes, including the following, listed in the order in which they are resolved:

Отдельный элемент управления (с использованием наследуемого свойства System.Windows.FrameworkElement.Resources ). An individual control (using the inherited System.Windows.FrameworkElement.Resources property).

Разнообразие областей действия обеспечивает гибкость в отношении способов определения ресурсов и предоставления доступа к ним. The variety of scopes gives you flexibility with respect to the way in which you define and share your resources.

Помимо прямого сопоставления ресурсов с определенной областью действия, можно упаковать один или несколько ресурсов с помощью отдельного объекта ResourceDictionary , на который можно ссылаться в других частях приложения. As an alternative to directly associating your resources with a particular scope, you can package one or more resources by using a separate ResourceDictionary that can be referenced in other parts of an application. Например, в следующем примере определяется цвет фона по умолчанию в словаре ресурсов. For example, the following example defines a default background color in a resource dictionary:

Следующий пример ссылается на словарь ресурсов, определенный в предыдущем примере, чтобы сделать его общим для приложения: The following example references the resource dictionary defined in the previous example so that it is shared across an application:

Ресурсы и словари ресурсов лежат в основе реализованной в WPF поддержки тем и обложек. Resources and resource dictionaries are the foundation of WPF support for themes and skins.

Дополнительные сведения см. в статье о ресурсах DSC. For more information, see Resources.

Пользовательские элементы управления Custom controls

Хотя WPF предоставляет множество возможностей настройки, могут возникнуть ситуации, когда существующие элементы управления WPF не удовлетворяют потребности вашего приложения или его пользователей. Although WPF provides a host of customization support, you may encounter situations where existing WPF controls do not meet the needs of either your application or its users. Это может произойти в указанных ниже случаях. This can occur when:

Требуемый пользовательский интерфейс нельзя создать, настроив внешний вид существующих элементов, реализованных в WPF. The user interface that you require cannot be created by customizing the look and feel of existing WPF implementations.

Требуемое поведение не поддерживается существующими элементами, реализованными в WPF, или его поддержка представляет трудность. The behavior that you require is not supported (or not easily supported) by existing WPF implementations.

В такой ситуации вы можете воспользоваться одной из трех моделей WPF, чтоб создать новый элемент управления. At this point, however, you can take advantage of one of three WPF models to create a new control. Каждая модель предназначена для определенного сценария и предполагает, что пользовательский элемент управления наследуется от определенного базового класса WPF. Each model targets a specific scenario and requires your custom control to derive from a particular WPF base class. Ниже перечислены эти три модели. The three models are listed here:

Модель пользовательского элемента управления. User Control Model. Пользовательский элемент управления наследуется от UserControl и составляется из одного или нескольких других элементов управления. A custom control derives from UserControl and is composed of one or more other controls.

Модель элемента управления. Control Model. Пользовательский элемент управления наследуется от Control и используется для создания реализаций, в которых поведение и внешний вид разделяются с помощью шаблонов, как в большинстве элементов управления WPF. A custom control derives from Control and is used to build implementations that separate their behavior from their appearance using templates, much like the majority of WPF controls. Наследование от класса Control обеспечивает большую гибкость при создании собственного пользовательского интерфейса, чем пользовательские элементы управления, но может потребовать больших усилий. Deriving from Control allows you more freedom for creating a custom user interface than user controls, but it may require more effort.

Модель элемента платформы. Framework Element Model. Пользовательский элемент управления наследуется от класса FrameworkElement , если его внешний вид определяется пользовательской логикой отрисовки, а не шаблонами. A custom control derives from FrameworkElement when its appearance is defined by custom rendering logic (not templates).

В следующем примере показан настраиваемый числовой элемент управления «вверх/вниз», производный от UserControl : The following example shows a custom numeric up/down control that derives from UserControl:

В следующем примере показан код XAML, необходимый для включения пользовательского элемента управления в Window : The following example illustrates the XAML that is required to incorporate the user control into a Window:

На следующем рисунке показан NumericUpDown элемент управления, размещенный в Window : The following figure shows the NumericUpDown control hosted in a Window:

Дополнительные сведения о пользовательских элементах управления см. в разделе Общие сведения о разработке управления. For more information on custom controls, see Control authoring overview.

Рекомендации по использованию WPF WPF best practices

Как и любую другую платформу разработки, WPF можно использовать разными способами для получения нужного результата. As with any development platform, WPF can be used in a variety of ways to achieve the desired result. Чтобы ваши приложения WPF обеспечивали требуемый уровень удобства и отвечали потребностям пользователей в целом, следует придерживаться рекомендаций в отношении специальных возможностей, глобализации, локализации и производительности. As a way of ensuring that your WPF applications provide the required user experience and meet the demands of the audience in general, there are recommended best practices for accessibility, globalization and localization, and performance. Дополнительные сведения см. в разделе: For more information, see:

Дальнейшие действия Next steps

Мы рассмотрели основные возможности WPF. We’ve looked at the key features of WPF. Теперь пора приступить к созданию первого приложения WPF. Now it’s time to build your first WPF app.