Как настроить windows form

Обновлено: 03.07.2024

Любая более или менее серьезная программа использует диалоговые окна для организации интерфейса с пользователем. В графическом интерфейсе операционной системы Windows различают два вида диалоговых окон:

Модальные окна являются наиболее распространенным видом окон. Если открыто модальное окно, то чтобы попасть в основную программу, его обязательно нужно закрыть. Без закрытия модального окна невозможно перейти в программу, которая его вызвала. В программах Windows Forms возможна ситуация, когда одно модальное окно открывает другое (следующее) модальное окно. Таким образом получается цепочка вызовов.

Как правило, модальное окно содержит кнопки типа OK, Cancel (или другие), при нажатии на которые это окно закрывается.

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

2. Особенности работы с немодальными окнами в Windows Forms

В технологии Windows Forms основной программе соответствует форма – экземпляр класса, унаследованного от класса Form . Также модальному или немодальному окну соответствует некоторая форма.

При работе с немодальными окнами были замечены следующие особенности:

в немодальном окне есть одна кнопка Close , которая его закрывает;
вызов немодального окна из главной программы происходит с помощью метода Show() класса Form (чтобы вызвать модальное окно нужно использовать метод ShowDialog() ).

В нижеследующем коде приведены примеры вызова модального и немодального окна

Как видно из вышеприведенного кода, проблемой есть способ обмена информацией между основной программой и немодальным окном. Основной программе соответствует главная форма, немодальному окну соответствует немодальная форма.

3. Способы обмена информацией между главной формой и немодальной формой

При использовании немодальных форм важным есть обмен информацией между основной программой (главной формой) и немодальной формой.

Здесь возможны две ситуации:

передача информации из главной формы в немодальную. Эта ситуация решается без проблем, поскольку в основной форме создается экземпляр немодальной формы. Через этот экземпляр осуществляется доступ к компонентам немодальной формы стандартным способом;
передача информации из немодальной формы в главную форму. Здесь возникает проблема: как из немодальной формы доступиться к экземпляру главной формы.

Чтобы передать данные (информацию) с немодальной формы в главную, можно использовать один из следующих способов:

4. Пример разработки демонстрационной программы использования немодальной формы

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

Демонстрационная программа состоит из двух форм: главной и немодальной. Из главной формы вызывается немодальная форма. Из немодальной формы происходит копирование информации из поля ввода в соответствующее поле ввода главной формы.

4.1. Создать проект типа Windows Forms

После создания проекта по шаблону Windows Forms автоматически создается главная форма, экземпляр которой называется Form1 .

4.2. Разработка основной формы

Создать основную форму и разместить на ней следующие элементы управления:

элемент управления типа Button . Создается экземпляр кнопки с именем button1 ;
элемент управления типа Label . Создается экземпляр метки с именем label1 ;
элемент управления типа TextBox . Создается экземпляр поля ввода с именем textBox1 .

Настроить свойства формы и элементов управления как показано на рисунке 1:

Также нужно откорректировать размеры главной формы.

После настройки главная форма будет иметь вид как изображено на рисунке 1.

Рисунок 1. Главная форма программы

4.3. Создать новую форму Form2

Создание новой формы осуществляется стандартным способом с помощью команд

4.4. Проектирование формы Form2

Разместить на форме Form2 следующие элементы управления:

один элемент управления типа Label . Будет создан объект с именем label1 ;
два элемента управления типа Button . Будет создано два объекта с именами button1 , button2 ;
один элемент управления типа TextBox . Будет создан экземпляр с именем textBox1 .

Настроить следующие свойства элементов управления формы Form2 :

После настройки немодальная форма будет иметь вид как изображено на рисунке 2.

Рисунок 2. Немодальная форма Form2 после настройки элементов управления

4.5. Ввод статической ссылки на форму Form1

В тексте класса Form1 нужно ввести статическую переменную с именем form1:

Статическая переменная имеет тип Control . Все элементы управления унаследованы из класса Control . Это же касается и формы.

4.6. Программирование обработчика события Click элемента управления button1 формы Form1

При нажатии на кнопке button1 ( Show Modeless Form ) открывается окно немодальной формы и в поле ввода немодальной формы ( Form2.textBox1.Text ) вписывается текст из поля ввода главной формы ( Form1.textBox1.Text ).

Чтобы выполнить этот пункт сначала нужно активировать форму Form1 . Затем нужно запрограммировать событие Click элемента управления button1 , размещенного на форме Form1 .

Текст обработчика события следующий:

4.7. Программирование обработчика события Click кнопки button1 формы Form2

При нажатии на кнопке button1 ( Copy to Form1 ) текст из поля ввода немодальной формы ( Form2.textBox1.Text ) должен скопироваться в соответствующее поле ввода главной формы ( Form1.textBox1.Text ).

Сначала нужно активировать форму Form2 и сформировать обработчик события Click элемента управления button1 .

Текст обработчика события следующий:

В обработчике события на основе статической ссылки form1 происходит циклический поиск элемента управления типа TextBox с именем textBox1 (на всякий случай, если в главной форме несколько textBox-ов).

4.8. Программирование обработчика события Click элемента управления button2

При нажатии на кнопке button2 нужно закрыть немодальную форму. Текст соответствующего обработчика следующий:

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

4.9. Запуск программы на выполнение

Установите Visual Studio бесплатно со страницы скачиваемых материалов Visual Studio, если еще не сделали этого.

На некоторых снимках экрана в этом учебнике используется темная тема. Если вы не используете темную тему, но хотите переключиться на нее, см. страницу Персонализация интегрированной среды разработки и редактора Visual Studio.

Установите Visual Studio бесплатно со страницы скачиваемых материалов Visual Studio 2022, если еще не сделали этого.

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

Откройте Visual Studio 2017.

В верхней строке меню последовательно выберите Файл > Создать > Проект.

Запустите Visual Studio.

На начальном экране выберите Создать проект.

Затем нажмите кнопку Изменить в Visual Studio Installer. Вам может быть предложено сохранить результаты работы; в таком случае сделайте это. Выберите Продолжить, чтобы установить рабочую нагрузку. После этого вернитесь к шагу 2 в процедуре Создание проекта.

В поле Имя проекта окна Настроить новый проект введите HelloWorld. Затем нажмите Создать.

Новый проект открывается в Visual Studio.

Запустите Visual Studio.

В окне запуска выберите Создание нового проекта.

В поле Имя проекта окна Настроить новый проект введите HelloWorld. Затем выберите Создать.

Новый проект открывается в Visual Studio.

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

Добавление кнопки на форму

Выберите Панель элементов, чтобы открыть всплывающее окно "Панель элементов".

(Если параметр для всплывающего окна Панель элементов отсутствует, его можно открыть в строке меню. Для этого выберите Вид > Панель элементов. Либо нажмите клавиши CTRL+ALT+X.)

Выберите значок Закрепить, чтобы закрепить окно Панель элементов.

Выберите элемент управления Кнопка и перетащите его на форму.

В окне Свойства найдите Текст, измените имя с button1 на Click this и нажмите клавишу ВВОД.

(Если окно Свойства не отображается, его можно открыть в строке меню.) Для этого выберите Вид > Окно свойств. Или нажмите клавишу F4.)

В разделе Конструктор окна Свойства измените имя с button1 на btnClickThis и нажмите клавишу ВВОД.

Если список в окне Свойства был упорядочен по алфавиту, button1 появится в разделе Привязки данных.

Добавление метки на форму

Теперь, когда мы добавили элемент управления ''Кнопка'' для создания действия, давайте добавим элемент управления "Метка", куда можно отправлять текст.

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

В разделе Конструктор или Привязки данных окна Свойства измените имя label1 на lblHelloWorld и нажмите клавишу ВВОД.

Добавление кода на форму

В окне Form1.cs [Проект] дважды щелкните кнопку Нажмите это, чтобы открыть окно Form1.cs.

(Кроме того, можно развернуть узел Form1.cs в обозревателе решений, а затем выбрать Form1.)

В окне Form1.cs после строки private void введите lblHelloWorld.Text = "Hello World!"; , как показано на следующем снимке экрана:

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

Будет выполнено несколько операций. В интегрированной среде разработки Visual Studio откроются окна Средства диагностики и Вывод. Кроме того, вне этой среды откроется диалоговое окно Form1. Оно будет содержать вашу кнопку Нажмите это и текст label1.

Закройте диалоговое окно Form1, чтобы завершить работу приложения.

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

Добавление кнопки на форму

Щелкните Панель элементов, чтобы открыть всплывающее окно "Панель элементов".

Щелкните значок Закрепить, чтобы закрепить окно Панель элементов.

Выберите элемент управления Кнопка и перетащите его на форму.

В окне Свойства найдите элемент Текст, измените имя с Button1 на Click this , а затем нажмите клавишу ВВОД.

В разделе Проектирование окна Свойства измените имя с Button1 на btnClickThis , а затем нажмите клавишу ВВОД.

Если список был упорядочен по алфавиту в окне Свойства, Button1 появится в разделе (DataBindings) .

Добавление метки на форму

В разделе Проект или (DataBindings) окна Свойства измените имя Label1 на lblHelloWorld и нажмите клавишу ВВОД.

Добавление кода на форму

В окне Form1.cs [Проект] дважды щелкните кнопку Нажмите это, чтобы открыть окно Form1.cs.

(Кроме того, можно развернуть узел Form1.cs в обозревателе решений, а затем выбрать Form1.)

В окне Form1.cs после строки private void введите lblHelloWorld.Text = "Hello World!"; , как показано на следующем снимке экрана:

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

Закройте диалоговое окно Form1, чтобы завершить работу приложения.

Следующие шаги

Для получения дополнительных сведений перейдите к следующему руководству:

Чтобы повысить интерес у пользователей, возникла идея повысить его привлекательность за счет настройки цвета и шрифта.

Требования к настройке внешнего вида приложения

хранить и загружать свойства отдельных компонентов в XML-файле
пользователь должен иметь простой инструмент по настройке внешнего вида
список настраиваемых компонентов должен очень просто расширяться (одной строкой кода)
при изменении значения свойства пользователь должен сразу видеть изменения на форме
должна быть кнопка отмены, которая позволит вернуть все изменения назад

Результат работы

Окно настройки внешнего вида:

До и после настроек внешнего вида:

Для решения задачи необходимо

использовать компонент PropertyGridEx, для отображения и изменения свойств компонентов
создать класс CustomDesignControl для удобства хранения свойств в XML
создать форму MainForm, на которой будем изменять внешний вид
создать форму AppSettingsForm, на которой будем настраивать внешний вид MainForm
создать класс SettingsXml для удобства работы с XML

Функция отмены изменений внешнего вида

Чтобы реализовать отмену изменений внешнего вида (пункт 5 из требований), решил найти универсальный способ клонирования свойств компонентов которые будут создаваться в памяти и заменять отображаемые компоненты.

Скопировал код, убрал лишние свойства, которые не нужно сохранять, оставив цвета и шрифт.
После проверки работы кода, сразу выяснились недостатки данного способа:

используется приведение любого контрола к классу Control, а это означает, что половину свойств можно потерять (например, компонент DataGridView унаследован от класса Control, но имеет свой дополнительный набор свойств)
при клонировании компонента некоторые свойства (например: цвет шрифта внутри ячейки DataGridView) не клонируются, а создают ссылки на клонируемый компонент (возможно, это потому, что используется свойство со своими внутренними свойствами и их нужно как-то по-другому обрабатывать).

Безрезультатно, компонент не смог вернуть изменения обратно.

Попробовал тогда само свойство создать оператором new и задать ему значение методом SetValue:

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

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

Пример приложения с настройкой внешнего вида

На всякий случай, подготовил готовый код, на котором желающие смогут проверить и возможно доработать функцию отмены изменений внешнего вида без перезагрузки приложения и рассказать нам о проблеме в комментариях.
Нужно добиться, чтобы при нажатии на кнопку «Автотест» на компоненте DataGridView был серый фон и шрифт ячеек был мелкий.

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

В этом уроке вы узнаете

Основы Windows Forms

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

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

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

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

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

Вывод:-

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

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

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

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

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

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

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

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

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

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

Вывод:-

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

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

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

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

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

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

Групповая коробка

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

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

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

Вывод:-

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

Контроль над этикетками

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

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

Вывод:-

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

Текстовое окно

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

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

Вывод:-

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

Список

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

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

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

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

Вывод:-

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

Переключатель

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

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

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

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

Вывод:-

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

флажок

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

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

Вывод:-

кнопка

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

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

Вывод:-

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

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

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

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

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

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

Вывод:-

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

Это метод обработчика событий, который автоматически создается Visual Studio при двойном щелчке по кнопке управления. Вам не нужно беспокоиться о сложности имени метода или параметров, передаваемых в метод.
Здесь мы получаем значения, введенные в текстовое поле имени и адреса. Значения могут быть взяты из свойства text текстового поля. Затем мы присваиваем значения двум переменным: name и address соответственно.
Наконец, мы используем метод MessageBox для отображения значения имени и адреса для пользователя.

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

Вывод:-

Управление Tree и PictureBox

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

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

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

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

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

Вывод:-

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

PictureBox Control

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

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

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

Читайте также: