Учебное пособие по применению C# Windows Forms с примером

До сих пор мы видели, как работать с C# для создания консольных приложений. Но в реальных сценариях команда обычно использует Visual Studio и C# для создания либо Windows Forms, либо веб-приложений.

Приложение Windows Form — это приложение, предназначенное для работы на компьютере. Он не будет работать в веб-браузере, потому что тогда он станет веб-приложением.

В этом учебнике основное внимание будет уделено тому, как мы можем создавать приложения для Windows. Мы также изучим некоторые основы работы с различными элементами приложения C# для Windows.

В этом руководстве по Windows вы узнаете-

• Основы Windows Forms
• Hello World в Windows Forms
• Добавление элементов управления в форму
• Обработка событий для элементов управления
• Дерево и элемент управления PictureBox

Основы Windows Forms

Приложение Windows Forms — это приложение, работающее на настольном компьютере. Приложение Windows Forms обычно содержит набор элементов управления, таких как метки, текстовые поля, списки и т. д.

Ниже приведен пример простого приложения Windows Form C#. Он показывает простой экран входа в систему, доступный пользователю. Пользователь введет необходимые учетные данные, а затем нажмет кнопку «Войти», чтобы продолжить.

Итак, пример элементов управления, доступных в приведенном выше приложении

1. Это набор элементов управления метками, которые обычно используются для описания смежных элементов управления. Итак, в нашем случае у нас есть 2 текстовых поля, и метки используются, чтобы сообщить пользователю, что одно текстовое поле предназначено для ввода имени пользователя, а другое — для пароля.
2. Два текстовых поля используются для хранения имени пользователя и пароля, которые вводит пользователь.
3. Наконец у нас есть кнопка. Обычно к элементу управления «кнопка» прилагается некоторый код для выполнения определенного набора действий. Так, например, в приведенном выше случае мы могли бы заставить кнопку выполнять действие по проверке имени пользователя и пароля, которые вводит пользователь.

С# Привет, мир

Теперь давайте рассмотрим пример того, как мы можем реализовать простое приложение «hello world» в Visual Studio. Для этого нам нужно будет выполнить следующие шаги

Шаг 1) Первый шаг включает в себя создание нового проекта в Visual Studio. После запуска Visual Studio необходимо выбрать пункт меню New->Project.

Шаг 2) Следующим шагом является выбор типа проекта в качестве приложения Windows Forms. Здесь нам также нужно указать название и местоположение нашего проекта.

1. В диалоговом окне проекта мы видим различные параметры для создания различных типов проектов в Visual Studio. Выберите вариант Windows слева.
2. Когда мы щелкнем параметры Windows на предыдущем шаге, мы сможем увидеть параметр для приложения Windows Forms. Выберите этот вариант.
3. Мы дадим имя приложению. В нашем случае это DemoApplication. Мы также предоставим место для хранения нашего приложения.
4. Наконец, мы нажимаем кнопку "ОК", чтобы позволить Visual Studio создать наш проект.

Если вышеуказанные шаги будут выполнены, вы получите следующий вывод в Visual Studio.

Вывод:-

Вы увидите конструктор форм, отображаемый в Visual Studio. Именно в этом конструкторе форм вы начнете создавать приложение Windows Forms.

В обозревателе решений вы также сможете увидеть решение DemoApplication. Это решение будет содержать следующие 2 файла проекта

1. Приложение Form с именем Forms1.cs. Этот файл будет содержать весь код приложения Windows Form.
2. Основная программа с именем Program.cs — это файл кода по умолчанию, который создается при создании нового приложения в Visual Studio. Этот код будет содержать код запуска для приложения в целом.

В левой части Visual Studio вы также увидите панель инструментов. Панель инструментов содержит все элементы управления, которые можно добавить в Windows Forms. Такие элементы управления, как текстовое поле или метка, — это лишь некоторые из элементов управления, которые можно добавить в Windows Forms.

Ниже приведен скриншот того, как выглядит панель инструментов.

Шаг 3) На этом этапе мы добавим в форму метку, которая будет отображать «Hello World». На панели инструментов вам нужно будет выбрать элемент управления Label и просто перетащить его на форму.

Как только вы перетащите метку на форму, вы увидите метку, встроенную в форму, как показано ниже.

Шаг 4) Следующий шаг — перейти к свойствам элемента управления и изменить текст на «Hello World».

Чтобы перейти к свойствам элемента управления, вам нужно щелкнуть правой кнопкой мыши элемент управления и выбрать пункт меню «Свойства»

• Панель свойств также отображается в Visual Studio. Итак, для элемента управления меткой в ​​элементе управления свойствами перейдите в раздел «Текст» и введите «Hello World».
• Каждый элемент управления имеет набор свойств, описывающих элемент управления.

Если вы выполните все вышеперечисленные шаги и запустите свою программу в Visual Studio, вы получите следующий вывод

Вывод:-

В выводе вы можете видеть, что отображается форма Windows. Вы также можете увидеть, что в форме отображается надпись «Hello World».

Добавление элементов управления в форму

Мы уже видели, как добавить элемент управления в форму, когда добавляли элемент управления меткой в ​​предыдущем разделе для отображения «Hello World».

Давайте посмотрим на другие элементы управления, доступные для форм Windows, и рассмотрим их общие свойства.

В нашем приложении формы Windows в примерах C# мы создадим одну форму, которая будет иметь следующие функции.

1. Возможность для пользователя вводить имя и адрес.
2. Возможность выбрать город, в котором проживает пользователь.
3. Возможность для пользователя указать пол.
4. Возможность выбрать курс, который хочет изучить пользователь. Будет сделан выбор как для C#, так и для ASP.Net

Итак, давайте подробно рассмотрим каждый элемент управления и добавим их для создания формы с вышеупомянутой функциональностью.

Групповое поле

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

Шаг 1) Первый шаг — перетащить элемент управления Groupbox на форму Windows из панели инструментов, как показано ниже

Шаг 2) После добавления группового поля перейдите в окно свойств, щелкнув элемент управления групповым полем. В окне свойств перейдите к свойству «Текст» и измените его на «Сведения о пользователе».

После внесения вышеуказанных изменений вы увидите следующий вывод

Вывод:-

В выводе вы можете ясно видеть, что Groupbox был добавлен в форму. Вы также можете видеть, что текст группового поля был изменен на «Сведения о пользователе».

Контроль ярлыков

Далее идет элемент управления метками. Элемент управления label используется для отображения текста или сообщения пользователю в форме. Элемент управления Label обычно используется вместе с другими элементами управления. Типичными примерами являются добавление метки вместе с элементом управления текстовым полем.

Метка указывает пользователю на то, что ожидается заполнить в текстовом поле. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим 2 ярлыка, один из которых будет называться «имя», а другой — «адрес». Они будут использоваться вместе с элементами управления текстовыми полями, которые будут добавлены в следующем разделе.

Шаг 1) Первый шаг — перетащить элемент управления меткой на форму Windows из панели инструментов, как показано ниже. Убедитесь, что вы перетащили элемент управления меткой 2 раза, чтобы у вас был один для «имени», а другой для «адреса».

Шаг 2) После добавления метки перейдите в окно свойств, щелкнув элемент управления меткой. В окне свойств перейдите к свойству Text каждого элемента управления меткой.

После внесения вышеуказанных изменений вы увидите следующий вывод

Вывод:-

Вы можете увидеть элементы управления надписями, добавленные в форму.

Текстовое поле

Текстовое поле позволяет пользователю вводить некоторый текст в приложении Windows на C#. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим в форму 2 текстовых поля, одно для имени, а другое для адреса, который нужно ввести для пользователя

Шаг 1) Первый шаг — перетащить элемент управления текстовым полем на форму Windows из панели инструментов, как показано ниже

Шаг 2) После добавления текстовых полей перейдите в окно свойств, щелкнув элемент управления текстовым полем. В окне свойств перейдите к свойству Name и добавьте осмысленное имя в каждое текстовое поле. Например, назовите текстовое поле для пользователя как txtName, а поле для адреса — как txtAddress. Для элементов управления следует установить соглашение об именах и стандарт, потому что становится проще добавлять к этим элементам дополнительные функции, которые мы увидим позже.

После внесения вышеуказанных изменений вы увидите следующий вывод

Вывод:-

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

Список

Список используется для демонстрации списка элементов в форме Windows. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим в форму список для хранения некоторых городов.

Шаг 1) Первый шаг — перетащить элемент управления полем списка на форму Windows из панели инструментов, как показано ниже

Шаг 2) После добавления списка перейдите в окно свойств, щелкнув элемент управления списком.

1. Сначала измените свойство элемента управления Listbox, в нашем случае мы изменили его на lstCity
2. Нажмите на свойство Items. Это позволит вам добавлять различные элементы, которые могут отображаться в списке. В нашем случае мы выбрали элементы «коллекция».
3. В появившемся редакторе коллекции строк введите названия городов. В нашем случае мы ввели «Мумбаи», «Бангалор» и «Хайдарабад».
4. Наконец нажмите кнопку "ОК".

После внесения вышеуказанных изменений вы увидите следующий вывод

Вывод:-

В выводе вы видите, что Listbox был добавлен в форму. Вы также можете видеть, что список заполнен значениями города.

Радиокнопка

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

Шаг 1) Первый шаг — перетащить элемент управления «радиокнопка» на форму Windows из панели инструментов, как показано ниже.

Шаг 2) После добавления Radiobutton перейдите в окно свойств, щелкнув элемент управления Radiobutton.

1. Во-первых, вам нужно изменить текстовое свойство обоих элементов управления Radio. Перейдите в окно свойств и измените текст одного переключателя на мужской, а текст другого на женский.
2. Аналогичным образом измените свойство name обоих элементов управления Radio. Перейдите в окно свойств и измените имя на «rdMale» для одного переключателя и на «rdfemale» для другого.

После внесения вышеуказанных изменений вы увидите следующий вывод

Вывод:-

Вы увидите переключатели, добавленные в форму Windows.

Флажок

Флажок используется для предоставления списка параметров, в котором пользователь может выбрать несколько вариантов. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим 2 флажка в наши формы Windows. Эти флажки предоставят пользователю возможность выбрать, хотят ли они изучать C# или ASP.Net.

Шаг 1) Первый шаг — перетащить элемент управления флажком на форму Windows из панели инструментов, как показано ниже

Шаг 2) После добавления флажка перейдите в окно свойств, щелкнув элемент управления Checkbox.

В окне свойств

1. Во-первых, вам нужно изменить свойство текста обоих флажков. Перейдите в окно свойств и измените текст на C# и ASP.Net.
2. Аналогичным образом измените свойство name обоих элементов управления Radio. Перейдите в окно свойств и измените имя на chkC для одного флажка и на chkASP для другого.

После внесения вышеуказанных изменений вы увидите следующий вывод

Вывод:-

Кнопка

Кнопка используется, чтобы позволить пользователю нажать на кнопку, которая затем запустит обработку формы. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим простую кнопку «Отправить», которая будет использоваться для отправки всей информации в форме.

Шаг 1) Первый шаг — перетащить элемент управления «Кнопка» на форму Windows из панели инструментов, как показано ниже

Шаг 2) После добавления кнопки перейдите в окно свойств, щелкнув элемент управления Button.

1. Во-первых, вам нужно изменить свойство текста элемента управления "Кнопка". Перейдите в окно свойств и измените текст на «отправить».
2. Аналогичным образом измените свойство имени элемента управления. Перейдите в окно свойств и измените имя на «btnSubmit».

После внесения вышеуказанных изменений вы увидите следующий вывод

Вывод:-

Поздравляем, теперь у вас есть первая базовая форма Windows Form. Теперь давайте перейдем к следующему разделу, чтобы узнать, как мы можем выполнять обработку событий для элементов управления.

Обработка событий C# для элементов управления

При работе с формой окна вы можете добавлять события в элементы управления. Событие — это то, что происходит при выполнении действия. Вероятно, наиболее распространенным действием является нажатие кнопки в форме. В C# Windows Forms можно добавить код, который можно использовать для выполнения определенных действий при нажатии кнопки в форме.

Обычно нажатие кнопки в форме означает, что должна произойти какая-то обработка.

Давайте рассмотрим одно из событий и то, как его можно обработать, прежде чем мы перейдем к сценарию события кнопки.

В приведенном ниже примере показано событие для элемента управления Listbox. Поэтому всякий раз, когда элемент выбран в элементе управления списком, должно появиться окно сообщения, в котором отображается выбранный элемент. Давайте выполним следующие шаги, чтобы добиться этого.

Шаг 1) Дважды щелкните список в конструкторе форм. Сделав это, Visual Studio автоматически откроет файл кода для формы. И он автоматически добавит в код метод события. Этот метод события будет запускаться при выборе любого элемента в списке.

Выше приведен фрагмент кода, который автоматически добавляется Visual Studio при двойном щелчке элемента управления «Поле списка» в форме. Теперь давайте добавим приведенный ниже фрагмент кода к этому фрагменту кода, чтобы добавить необходимую функциональность в событие списка.

1. Это метод обработчика событий, который автоматически создается Visual Studio при двойном щелчке элемента управления "Список". Вам не нужно беспокоиться о сложности имени метода или параметрах, передаваемых методу.
2. Здесь мы получаем SelectedItem через свойство lstCity.SelectedItem. Помните, что lstCity — это имя нашего элемента управления Listbox. Затем мы используем метод GetItemText для получения фактического значения выбранного элемента. Затем мы присваиваем это значение текстовой переменной.
3. Наконец, мы используем метод MessageBox для отображения значения текстовой переменной пользователю.

После внесения вышеуказанных изменений и запуска программы в Visual Studio вы увидите следующий вывод

Вывод:-

Из вывода видно, что при выборе любого элемента из списка появляется всплывающее окно сообщения. Это покажет выбранный элемент из списка.

Теперь давайте посмотрим на последний элемент управления, который представляет собой метод нажатия кнопки. Опять же, это следует той же философии. Просто дважды щелкните кнопку в конструкторе форм, и он автоматически добавит метод для обработчика событий кнопки. Затем вам просто нужно добавить приведенный ниже код.

1. Это метод обработчика событий, который автоматически создается Visual Studio при двойном щелчке элемента управления "Кнопка". Вам не нужно беспокоиться о сложности имени метода или параметров, передаваемых в метод.
2. Здесь мы получаем значения, введенные в текстовое поле имени и адреса. Значения можно взять из свойства text текстового поля. Затем мы присваиваем значения двум переменным, имени и адресу соответственно.
3. Наконец, мы используем метод MessageBox, чтобы отобразить пользователю значения имени и адреса.

После внесения вышеуказанных изменений и запуска программы в Visual Studio вы увидите следующий вывод

Вывод:-

1. Сначала введите значение в поле имени и адреса.
2. Затем нажмите кнопку "Отправить".

После того, как вы нажмете кнопку «Отправить», появится окно сообщения, в котором правильно будет показано, что вы ввели в разделе сведений о пользователе.

Дерево и элемент управления PictureBox

Есть еще 2 элемента управления, на которые мы можем обратить внимание:один — «Управление деревом», а другой — «Управление изображением». Давайте посмотрим на примеры того, как мы можем реализовать эти элементы управления

Управление деревом

- Элемент управления деревом используется для перечисления элементов в виде дерева, подобного моду. Вероятно, лучший пример — это когда мы видим сам проводник Windows. Структура папок в Проводнике Windows похожа на древовидную структуру.

Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже.

Шаг 1) Первый шаг — перетащить элемент управления «Дерево» на форму Windows из панели инструментов, как показано ниже

Шаг 2) Следующий шаг — начать добавлять узлы в коллекцию деревьев, чтобы они могли соответственно появиться в дереве. Во-первых, давайте выполним следующие подшаги, чтобы добавить корневой узел в коллекцию дерева.

1. Перейдите к панели инструментов свойств для элемента управления представлением в виде дерева. Нажмите на свойство узла. Откроется редактор TreeNode.
2. В редакторе узла дерева нажмите кнопку "Добавить корень", чтобы добавить корневой узел в коллекцию дерева.
3. Далее измените текст корневого узла, укажите текст как корневой и нажмите кнопку «ОК». Это добавит корневой узел.

Шаг 3) Следующим шагом будет добавление дочерних узлов в коллекцию дерева. Давайте выполним следующие подшаги, чтобы добавить дочерний корневой узел в коллекцию дерева.

1. Сначала нажмите кнопку "Добавить дочерний элемент". Это позволит вам добавлять дочерние узлы в коллекцию Tree.
2. Для каждого дочернего узла измените свойство text. Продолжайте повторять предыдущий шаг и этот шаг и добавьте 2 дополнительных узла. В итоге у вас будет 3 узла, как показано выше, с текстом в виде метки, кнопки и флажка соответственно.
3. Нажмите кнопку "ОК".

После внесения вышеуказанных изменений вы увидите следующий вывод.

Вывод:-

Вы сможете увидеть представление в виде дерева, добавленное в форму. Когда вы запускаете приложение формы Windows, вы можете развернуть корневой узел и увидеть дочерние узлы в списке.

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

Этот элемент управления используется для добавления изображений в Winforms C#. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже.

Шаг 1) Первый шаг — перетащить элемент управления PictureBox на форму Windows C# из панели инструментов, как показано ниже

Шаг 2) Следующим шагом является фактическое прикрепление изображения к элементу управления Picture Box. Это можно сделать, выполнив следующие действия.

1. Сначала щелкните свойство Image элемента управления PictureBox. Появится новое окно.
2. В этом окне нажмите кнопку «Импорт». Это будет использоваться для прикрепления изображения к элементу управления picturebox.
3. Появится диалоговое окно, в котором вы сможете выбрать изображение для прикрепления изображения.
4. Нажмите кнопку "ОК".

После внесения вышеуказанных изменений вы увидите следующий вывод

Вывод:-

Из вывода видно, что в форме отображается изображение.

Обзор

• Форма Windows в приложении C# — это форма, которая запускается на рабочем столе компьютера. Visual Studio Form вместе с C# можно использовать для создания приложения Windows Forms.
• Элементы управления можно добавить в формы C# для Windows с помощью панели инструментов в Visual Studio. Элементы управления, такие как метки, флажки, переключатели и т. д., можно добавить в форму с помощью панели инструментов.
• Можно также использовать расширенные элементы управления, такие как элемент управления в виде дерева и элемент управления PictureBox.
• Обработчики событий используются для реагирования на события, генерируемые элементами управления. Наиболее распространенным является тот, который добавляется для события нажатия кнопки.