Введение в Windows Forms

Для создания графических интерфейсов с помощью платформы .NET применяются разные технологии — Window Forms, WPF, приложения для магазина Windows Store (для ОС Windows 8/8.1/10). Однако наиболее простой и удобной платформой до сих пор остается Window Forms или формы. Данное руководство ставит своей целью дать понимание принципов создания графических интерфейсов с помощью технологии WinForms и работы основных элементов управления.

Создание графического приложения

Для создания графического проекта нам потребуется среда разработки Visual Studio. Поскольку наиболее распространенная пока версия Visual Studio 2013, то для данного руководства я буду использовать бесплатную версию данной среды Visual Studio Community 2013 которую можно найти на странице https://www.visualstudio.com/en-us/products/visual-studio-community-vs.aspx.

После установки среды и всех ее компонентов, запустим Visual Studio и создадим проект графического приложения. Для этого в меню выберем пункт File (Файл) и в подменю выберем New — > Project (Создать — > Проект). После этого перед нами откроется диалоговое окно создания нового проекта:

В левой колонке выберем Windows Desktop , а в центральной части среди типов проектов — тип Windows Forms Application и дадим ему какое-нибудь имя в поле внизу. Например, назовем его HelloApp. После этого нажимаем OK.

После этого Visual Studio откроет наш проект с созданными по умолчанию файлами:

Большую часть пространства Visual Studio занимает графический дизайнер, который содержит форму будущего приложения. Пока она пуста и имеет только заголовок Form1. Справа находится окно файлов решения/проекта — Solution Explorer (Обозреватель решений). Там и находятся все связанные с нашим приложением файлы, в том числе файлы формы Form1.cs.

Внизу справа находится окно свойств — Properties. Так как у меня в данный момент выбрана форма как элемент управления, то в этом поле отображаются свойства, связанные с формой.

Теперь найдем в этом окне свойство формы Text и изменим его значение на любое другое:

Таким образом мы поменяли заголовок формы. Теперь перенесем на поле какой-нибудь элемент управления, например, кнопку. Для этого найдем в левой части Visual Studio вкладку Toolbox (Панель инструментов) . Нажмем на эту вкладку, и у нас откроется панель с элементами, откуда мы можем с помощью мыши перенести на форму любой элемент:

Найдем среди элементов кнопку и, захватив ее указателем мыши, перенесем на форму:

Это визуальная часть. Теперь приступим к самому программированию. Добавим простейший код на языке C#, который бы выводил сообщение по нажатию кнопки. Для этого мы должны перейти в файл кода, который связан с этой формой. Если у нас не открыт файл кода, мы можем нажать на форму правой кнопкой мыши и в появившемся меню выбрать View Code (Посмотреть файл кода):

Однако воспользуемся другим способом, чтобы не писать много лишнего кода. Наведем указатель мыши на кнопку и щелкнем по ней двойным щелчком. Мы автоматически попадаем в файл кода Form1.cs, который выглядит так:

Добавим вывод сообщения по нажатию кнопки, изменив код следующим образом:

Запуск приложения

Чтобы запустить приложение в режиме отладки, нажмем на клавишу F5 или на зеленую стрелочку на панели Visual Studio. После этого запустится наша форма с одинокой кнопкой. И если мы нажмем на кнопку на форме, то нам будет отображено сообщение с приветствием.

После запуска приложения студия компилирует его в файл с расширением exe. Найти данный файл можно, зайдя в папку проекта и далее в каталог bin/Debug или bin/Release

Рассмотрев вкратце создание проекта графического приложения, мы можем перейти к обзору основных компонентов и начнем мы с форм.

Практическое руководство. Добавление элементов управления в формы Windows Forms. How to: Add Controls to Windows Forms

Большинство форм разрабатываются путем добавления элементов управления на поверхность формы для определения пользовательского интерфейса. Most forms are designed by adding controls to the surface of the form to define a user interface (UI). Элемент управления — это компонент в форме, используемый для вывода информации или ввода данных пользователем. A control is a component on a form used to display information or accept user input. Дополнительные сведения об элементах управления см. в разделе элементы управления Windows Forms. For more information about controls, see Windows Forms Controls.

Рисование элемента управления в форме To draw a control on a form

Откройте форму. Open the form. Дополнительные сведения см. в разделе инструкции. отображение Windows Forms в конструкторе. For more information, see How to: Display Windows Forms in the Designer.

В области элементов щелкните элемент управления, который необходимо добавить в форму. In the Toolbox, click the control you want to add to your form.

В форме щелкните место, где должен располагаться левый верхний угол элемента управления, и перетащите его в то место, где должен располагаться правый нижний угол элемента управления. On the form, click where you want the upper-left corner of the control to be located, and drag to where you want the lower-right corner of the control to be located.

Элемент управления добавляется в форму с указанными расположением и размером. The control is added to the form with the specified location and size.

Для каждого элемента управления определен размер по умолчанию. Each control has a default size defined. Можно добавить элемент управления в форму в размер элемента управления по умолчанию, перетащив его из области элементов в форму. You can add a control to your form in the control’s default size by dragging it from the Toolbox to the form.

Перетаскивание элемента управления в форму To drag a control to a form

Откройте форму. Open the form. Дополнительные сведения см. в разделе инструкции. отображение Windows Forms в конструкторе. For more information, see How to: Display Windows Forms in the Designer.

На панели элементов щелкните нужный элемент управления и перетащите его в форму. In the Toolbox, click the control you want and drag it to your form.

Элемент управления добавляется в форму в указанном расположении в его размер по умолчанию. The control is added to the form at the specified location in its default size.

Можно дважды щелкнуть элемент управления на панели элементов , чтобы добавить его в левый верхний угол формы в его размер по умолчанию. You can double-click a control in the Toolbox to add it to the upper-left corner of the form in its default size.

Кроме того, можно динамически добавлять элементы управления в форму во время выполнения. You can also add controls dynamically to a form at run time. В следующем примере кода TextBox элемент управления будет добавлен в форму при Button щелчке элемента управления. In the following code example, a TextBox control will be added to the form when a Button control is clicked.

Следующая процедура требует наличия формы с элементом управления Button , Button1 уже размещенным в ней. The following procedure requires the existence of a form with a Button control, Button1 , already placed on it.

Добавление элемента управления в форму программным способом To add a control to a form programmatically

В методе, обрабатывающем событие кнопки Click в классе формы, вставьте код, аналогичный приведенному ниже, чтобы добавить ссылку на переменную элемента управления, задать элемент управления Location и добавить элемент управления. In the method that handles the button’s Click event within your form’s class, insert code similar to the following to add a reference to your control variable, set the control’s Location , and add the control.

Можно также добавить код для инициализации других свойств элемента управления. You can also add code to initialize other properties of the control.

Вы можете предоставить локальному компьютеру угрозу безопасности через сеть, обратившись к вредоносной программе UserControl . You might expose your local computer to a security risk through the network by referencing a malicious UserControl . Это будет проблемой только в случае, если злоумышленник создает вредоносный пользовательский элемент управления, а затем добавляет его в проект по ошибке. This would only be a concern in the case of a malicious person creating a damaging custom control, followed by you mistakenly adding it to your project.

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

Элементы управления представляют собой визуальные классы, которые получают введенные пользователем данные и могут инициировать различные события. Все элементы управления наследуются от класса Control и поэтому имеют ряд общих свойств:

Anchor : Определяет, как элемент будет растягиваться

BackColor : Определяет фоновый цвет элемента

BackgroundImage : Определяет фоновое изображение элемента

ContextMenu : Контекстное меню, которое открывается при нажатии на элемент правой кнопкой мыши. Задается с помощью элемента ContextMenu

Cursor : Представляет, как будет отображаться курсор мыши при наведении на элемент

Dock : Задает расположение элемента на форме

Enabled : Определяет, будет ли доступен элемент для использования. Если это свойство имеет значение False, то элемент блокируется.

Font : Устанавливает шрифт текста для элемента

ForeColor : Определяет цвет шрифта

Location : Определяет координаты верхнего левого угла элемента управления

Name : Имя элемента управления

Size : Определяет размер элемента

Width : ширина элемента

Height : высота элемента

TabIndex : Определяет порядок обхода элемента по нажатию на клавишу Tab

Tag : Позволяет сохранять значение, ассоциированное с этим элементом управления

Кнопка

Наиболее часто используемым элементом управления является кнопка. Обрабатывая событие нажатия кнопки, мы может производить те или иные действия.

При нажатии на кнопку на форме в редакторе Visual Studio мы по умолчанию попадаем в код обработчика события Click , который будет выполняться при нажатии:

Оформление кнопки

Чтобы управлять внешним отображением кнопки, можно использовать свойство FlatStyle. Оно может принимать следующие значения:

Flat — Кнопка имеет плоский вид

Popup — Кнопка приобретает объемный вид при наведении на нее указателя, в иных случаях она имеет плоский вид

Standard — Кнопка имеет объемный вид (используется по умолчанию)

System — Вид кнопки зависит от операционной системы

Изображение на кнопке

Как и для многих элементов управления, для кнопки можно задавать изображение с помощью свойства BackgroundImage. Однако мы можем также управлять размещением текста и изображения на кнопки. Для этого надо использовать свойство TextImageRelation . Оно приобретает следующие значения:

Overlay : текст накладывается на изображение

ImageAboveText : изображение располагается над текстом

TextAboveImage : текст располагается над изображением

ImageBeforeText : изображение располагается перед текстом

TextBeforeImage : текст располагается перед изображением

Например, установим для кнопки изображение. Для этого выберем кнопку и в окне Свойств нажмем на поле Image (не путать с BackgroundImage). Нам откроется диалоговое окно установи изображения:

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

После выбора изображения мы можем установить свойство ImageAlign , которое управляет позиционированием изображения на кнопке:

Нам доступны 9 вариантов, с помощью которых мы можем прикрепить изображение к определенной стороне кнопки. Оставим здесь значение по умолчанию — MiddleCenter , то есть позиционирование по центру.

Затем перейдем к свойству TextImageRelation и установим для него значение ImageBeforeText . В итоге мы получим кнопку, где сразу после изображения идет надпись на кнопке:

Клавиши быстрого доступа

При работе с формами при использовании клавиатуры очень удобно пользоваться клавишами быстрого доступа. При нажатии на клавиатуре комбинации клавиш At+некоторый символ, будет вызываться определенная кнопка. Например, зададим для некоторой кнопки свойство Text равное &Аватар . Первый знак — амперсанд — определяет ту букву, которая будет подчеркнута. В данном случае надпись будет выглядеть как А ватар. И теперь чтобы вызвать событие Click, нам достаточно нажать на комбинацию клавиш Alt+А.

Кнопки по умолчанию

Форма, на которой размещаются все элементы управления, имеет свойства, позволяющие назначать кнопку по умолчанию и кнопку отмены.

Так, свойство формы AcceptButton позволяет назначать кнопку по умолчанию, которая будет срабатывать по нажатию на клавишу Enter.

Аналогично работает свойство формы CancelButton , которое назначает кнопку отмены. Назначив такую кнопку, мы можем вызвать ее нажатие, нажав на клавишу Esc.

Ввод данных пользователем в Windows Forms User Input in Windows Forms

В Windows Forms включена модель ввода пользователя, основанная на событиях, которые возникают во время обработки соответствующих сообщений Windows. Windows Forms includes a user input model based on events that are raised while processing related Windows messages. Здесь приведены ссылки на разделы с информацией о вводе с помощью мыши и клавиатуры, включая примеры кода, демонстрирующие выполнение определенных задач. The topics in this section provide information on mouse and keyboard user input, including code examples that demonstrate how to perform specific tasks.

в этом разделе In This Section

Ввод данных пользователем в приложении Windows Forms User Input in a Windows Forms Application
Содержит обзор событий пользовательского ввода и методов, которые обрабатывают сообщения Windows. Provides an overview of user input events and the methods that process Windows messages.

Ввод с клавиатуры в приложении Windows Forms Keyboard Input in a Windows Forms Application
Содержит сведения об обработке сообщений клавиатуры, различных типах клавиш и событиях клавиатуры. Provides information on keyboard message handling, the different types of keys, and the keyboard events.

Ввод данных мышью в приложении Windows Forms Mouse Input in a Windows Forms Application
Содержит сведения о событиях мыши и других связанных с мышью возможностях, включая курсоры и отслеживание перемещения мыши. Provides information on the mouse events and other mouse-related features, including mouse cursors and mouse capture.

Практическое руководство. Имитация событий мыши и клавиатуры в коде How to: Simulate Mouse and Keyboard Events in Code
Показано несколько различных способов программной имитации ввода с помощью мыши и клавиатуры. Demonstrates several different ways to programmatically simulate mouse and keyboard input.

Практическое руководство. Обработка событий пользовательского ввода в элементах управления Windows Forms How to: Handle User Input Events in Windows Forms Controls
Пример кода, который обрабатывает большую часть событий пользовательского ввода и сообщает сведения о каждом событии. Presents a code example that handles most user input events and reports information about each event.

Проверка введенных пользователем данных в Windows Forms User Input Validation in Windows Forms
Описываются методы проверки пользовательского ввода в приложениях Windows Forms. Describes the methods to validate user input in Windows Forms applications.