Элементы управления
Элементы управления представляют собой визуальные классы, которые получают введенные пользователем данные и могут инициировать различные события. Все элементы управления наследуются от класса 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.
Урок 1. Программа «Привет»
Прежде чем написать программу «Привет», давайте определимся, что будет делать программа и как она должна выглядеть в действии.
После запуска программы должно появиться окно приложения. Окно должно содержать две кнопки (Привет и Очистить) и пустое текстовое поле (рис.1.1).

Рис.1.1. Внешний вид приложения
Если щелкнуть мышью на кнопке Привет, в текстовом поле появится надпись «Здравствуй, Мир!» (рис.1.2)

Рис.1.2. Приложение в действии.
Если щелкнуть мышью на кнопке Очистить, программа очищает текстовое поле.
Создание нового проекта
Теперь, когда вы знаете, что должна делать программа, давайте попробуем написать ее на C#. Постарайтесь выполнить все описываемые действия.
Первое, с чего начинается разработка новой программы — это создать новый проект. Для этого запустите Visual Studio. В меню File выберите команду New | Project. . Откроется диалоговое окно New Project (рис.1.1). Выберите в левой части окна тип проекта Visual C# | Windows. В правой части появятся доступные шаблоны для выбранного типа проекта.
Как видите, Visual Studio позволяет создавать проекты разных типов. Для нашего первого урока мы будем использовать проект типа Windows Forms Application. Выделите мышкой шаблон Windows Forms Application. Далее измените имя проекта. В поле Name удалите текст по умолчанию WindowsFormsApplication1 и введите текст MyFirstProgram. Следующее поле Location показывает место, где будет храниться ваш проект. Вы можете изменить место хранения проекта. Для этого щелкните кнопку Browse. и выберите папку на вашем компьютере. Теперь можно щелкнуть кнопку OK.

Рис.1.3. Создание нового проекта
У вас откроется среда разработки Visual Studio. В центре экрана вы увидите окно формы (пока пустое) с заголовком Form1. Ваша задача — сделать его похожим на форму готового приложения

Рис.1.4. Пустая форма
Изменяем заголовок формы
Пустая форма, которая появилась у вас на экране, имеет заголовок Form1. Эту стандартную надпись в заголовке Visual Studio присваивает любой вновь созданной форме. В учебных целях вы можете оставлять эту надпись без изменений, но давайте сделаем форму более профессиональной. В нашей первой программе заголовок имеет надпись Привет.
Итак, изменим заголовок у формы на Привет
Убедитесь, что окно формы является текущим. Это легко распознать по заголовку — оно должно быть активным (подсвеченным). Если форма не является текущим, то просто щелкните мышью в любом месте формы или по заголовку.
В правой части среды разработки найдите окно Properties. Если оно у вас скрыто, то в меню View выберите команду Properties Windows.
Щелкните на поле, расположенном справа от надписи Text. В данный момент поле содержит текст Form1. Удалите этот текст и введите новый текст Привет. Окно свойств должно принять вид, как на рис 1.5.

Рис.1.5. Изменяем заголовок у формы
Ура! Вы изменили заголовок формы. Взгляните на окно формы — надпись изменилась (рис.1.6).

Рис.1.6. Форма с новым заголовком.
Добавляем кнопку
Мы знаем, что в окончательном варианте на форме должны быть кнопки Привет и Очистить. Давайте сделаем это.
Чтобы поместить кнопку на форму, сначала выберите ее в коллекции инструментов.
Окно коллекции инструментов содержит значки различных элементов управления. Ваша задача — выбрать нужный объект и поместить его на форму.
Найдите среди значков нужный элемент с надписью Button.
![]()
Дважды щелкните на значке кнопки — в результате Visual Studio поместит кнопку с надписью Button на форму (рис.1.7).

Рис.1.7. Помещаем кнопку на форму
Visual Studio автоматически присвоила некоторые свойства для нашей кнопки. Мы должны изменить их для нашего удобства, как это мы сделали для заголовка формы.
Перейдите на панель Properties (если она невидима, то выполните команду Properties Window из меню ё1)
Убедитесь, что поле списка в верхней части окна свойств содержит надпись button1 System.Windows.Forms.Button (рис.1.6)
Измените значение свойства Name с button1 на butHello.

Рис.1.8. Присваиваем новое имя кнопке
По умолчанию, Visual Studio присвоило кнопке надпись button1, которую вы видите сейчас на кнопке. Давайте изменим ее на более понятную надпись. Находим свойство Text и изменяем текст button1 на Привет.
Изменяем положение кнопки
Кнопка в нашем варианте должна находиться не в углу формы, а чуть ниже.
Перетащите ее в нижнюю часть формы: поместите указатель мыши на кнопку Привет, нажмите на кнопку мыши и, не отпуская кнопки мыши, переместите кнопку Привет в нужное место.
Изменяем свойство Font (Шрифт) у кнопки
Продолжим изменять свойства у кнопки. Снова переходим в окно свойств и щелкните на поле справа от надписи Font. При этом появится кнопка с тремя точками. Щелкните на этой кнопке. Появится диалоговое окно Font, позволяющее выбрать и установить новый шрифт.
Выберите нужный размер шрифта, например, 10. Щелкните на кнопке OK диалогового окна Font
Взгляните на кнопку: шрифт надписи Привет изменился.
Добавляем вторую кнопку
Теперь нам необходимо добавить на форму вторую кнопку с надписью Очистить. Повторяем уже знакомые операции. Дважды щелкаем на значке кнопки в коллекции инструментов. На форме появится вторая кнопка. Перетащите ее в правую часть формы рядом с первой кнопкой. Далее измените у кнопки свойства Name с button1 на butClear и свойство Text на текст Очистить. Также можете изменить размер шрифта.
Изменяем размеры кнопок
Первоначальные размеры, которые Visual Studio установил кнопкам, могут нам не подойти. Например, слово Очистить может оказаться слишком большим и не помещается целиком на кнопке. Давайте научимся изменять размеры кнопок.
Выберите нужный объект одиночным щелчком (не двойным!). Выбранный элемент будет заключен в прямоугольник из небольших белых квадратиков, которые называются маркерами. Аккуратно подведите указатель мыши к любому маркеру и, удерживая нажатой кнопку мыши, перетаскивайте маркер в нужном направлении, пока объект не примет требуемый размер. Например, маркеры на вертикальных гранях объекта меняют его горизонтальные размеры и наоборот. Маркеры на углах меняют размеры объекта в обоих направлениях одновременно.

Добавляем на форму текстовое поле TextBox
Остался еще один элемент, которого не хватает для нашей программы — это текстовое поле TextBox. Данный элемент предназначен для ввода любого текста. Иногда этот элемент называют полем редактирования.
Помещаем элемент TextBox на форму
У нас уже есть опыт добавления кнопок на форму. Теперь мы должны добавить текстовое поле. Найдите в коллекции инструментов значок текстового поля.
![]()
Двойным щелчком на значке Tex t Box поместите элемент на форму.
Выбрав его на форме, измените положение и размер элемента как показано на рисунке 1.9.

Рис.1.9. Размещение всех элементов на форме
Изменяем значения свойств элемента TextBox
Измениим несколько свойств у текстового поля. Измените значение свойства Name с textBox1 на txtDisplay. По желанию, вы можете изменить размер шрифта.
Вводим исходный код
Этап визуального программирования на этом завершен. Мы сконструировали внешний вид программы. Теперь осталось ввести исходный код для программы.
Visual C# является языком программирования, ориентированным на обработку событий. Например, если вы щелкните на кнопке Привет, то выполняется событие Click для кнопки butHello и автоматически будет выполнена процедура обработки данного события. Таким образом, ваша задача сводится к тому, чтобы для каждого события написать соответствующую процедуру — обработчик данного события. Если вы ничего не поняли — не расстраивайтесь. Все гораздо проще, чем может показаться на первый взгляд. Давайте попробуем, и вы увидите, как это просто и легко. Начнем с обработчика события Click для кнопки Привет (butHello).
Пишем процедуру для кнопки Привет (butHello)
Дважды щелкните на кнопке Привет (butHello). Visual Studio откроет окно программного кода. Обратите внимание, что Visual Studio автоматически поместил в окно программного кода строчки:
Как мы договаривались, при нажатии на кнопку в текстовом поле должна появиться надпись Здравствуй, Мир!. Поместите курсор между фигурными скобками < >и введите следующий код:
Обратите внимание, что когда вы набрали слово txtDispaly и поставили точку, то Visual Studio предложил вам выбрать уже готовые варианты для продолжения. Не обращайте пока внимания на подсказки и продолжайте набирать текст. Не забудьте поставить в конце строки точку с запятой.
Вводим код для кнопки Очистить
Снова переключитесь в режим визуального редактирования (View | Designer) и дважды щелкните на кнопке Очистить (butClear). Visual Studio снова сгенерирует заготовку для события Click второй кнопки. Задача этой процедуры заключается в очистке текстового поля. Для этого нужно присвоить для значения свойства Text пустую строку.
Выполняем программу Привет
Все готово для нашей первой программы. Пора проверить ее в действии. Выберите в меню Debug | Start Debugging.
Если вы не сделали ни одной ошибки, то у вас на экране появится окно нашей программы. Щелкните на кнопке Привет. В текстовом поле появится текст, который мы задали в коде программы. Теперь щелкните на кнопке Очистить. Текст исчезнет. Вы можете пощелкать по кнопкам несколько раз. Чтобы выйти из программы, нажмите на кнопку Закрыть в верхнем правом углу программы.
Когда вы выходите из программы, то можете снова вносить в нее изменения в Visual Studio. Попробуйте самостоятельно изменить программу таким образом, чтобы при щелчке на кнопке Привет в текстовом поле появилась надпись Привет, мама!.
Исполняемый файл EXE
Когда вы запустили программу в первый раз, то Visual Studio автоматически создал исполняемый файл EXE. Откройте папку, в котором вы сохраняли свой проект. Там найдите подпапку \bin\Debug, в которой увидите файл MyFirstProgram.exe.
Вы можете скопировать этот файл на флешку и передать ее своим знакомым, чтобы они увидели вашу программу на своем компьютере. На этом первый урок завершен.
Итоги
Итак, вы написали свою первую программу на C#, прошли все необходимые этапы: этап визуального программирования и этап ввода исходного кода. На первом этапе вы учились размещать на форме необходимые элементы и задавать их свойствам нужные значения. На этапе ввода кода вы создали несколько процедур для обработки некоторых событий к некоторым объектам и использовали операторы C#.
2.2 Создание первого оконного приложения в .NET. "Убегающее окно".
Создавая данную программу, мы рассмотрим основные принципы создания оконных приложений в C#, а также методы реализации с помощью них каких-либо конечных целей: в нашем случае — это забавно убегающее окно.
Создайте новый проект, в качестве типа шаблона установите приложение Windows Forms, как показано на рисунке 1:
Рисунок 1. Создание нового проекта.
Назовите проект RandWindow и нажмите кнопку ОК.
- Окно Toolbox (Панель элементов управления) — элементы управления вы можете разместить на создаваемой форме.
- Окно Solution Explorer (Обозреватель решений) — здесь вы сможете увидеть следующие узлы: Properties — настройки проекта, Links (Ссылки) — подключенные к проекту библиотеки, а также созданные и подключенные к проекту файлы исходных кодов (с расширением .cs) и подключенные к проекту формы (например, Form1).
- Окно Class View (Окно классов) — здесь представлены все созданные в программе классы.
- Окно Properties (Свойства) — выбрав любой элемент управления или даже форму, вы сможете увидеть все параметры данного объекта, а также изменить значения, установленные в них по умолчанию.
Добавление новых элементов управления на форму
Итак, после того как вы ввели имя проекта, установили необходимый шаблон и нажали кнопку ОК, MS Visual Studio автоматически создаст каркас оконного приложения, после чего мы сможем добавить на него новые оконные элементы.
Для этого необходимо перетащить необходимый оконный элемент из окна инструментов (ToolBox).
Нашему окну потребуется 2 элемента поля для ввода, в которые мы будем выводить координаты указателя мыши, что облегчит нам понимание работы программы.
В центре окна будет находиться надпись, которую мы создадим с помощью элемента Label.
Снизу будут расположены 2 кнопки.
Немного растяните заготовку окна. Если вы нажмете на него правой кнопкой, то откроется контекстное меню. В нем нажмите на пункте свойства, после чего вы сможете изучить различные параметры окна, которые вы можете изменить. На рисунке 3 изображены самые (как правило) необходимые свойства:
Рисунок 3. Различные свойства окна (формы) в C# .NET.
Немного растяните заготовку окна и добавьте все необходимые элементы. На рисунке 4 вы можете увидеть их в окне ToolBox:
Рисунок 4. Перетаскивайте необходимые элементы из окна Toolbox на создаваемую форму.
Перейдите в свойства строки Label1, где измените текст на «Вы стремитесь сделать мир лучше?». Также измените тип шрифта, для этого найдите свойство Font (рис. 5).
Рисунок 5. Свойство Font элемента Label.
После чего установите тип шрифта Tahoma, ширину шрифта Bold и размер равный 16 (рис. 6).
Рисунок 6. Установки шрифта.
Далее измените текст на кнопках, используя свойство Text.
Полученная заготовка окна программы будет выглядеть следующим образом (рис. 7).
Рисунок 7. Форма будет выглядеть следующим образом.
Техническая часть работы программы
- Сначала мы добавим обработчик события перемещения мыши и реализуем вывод ее координат x и y в два созданных поля ввода.
- Далее мы создадим функции обработчики щелчка по каждой из клавиш мыши (особенно усердные пользователи все же смогут попасть по кнопке «Да, конечно!»).
- Далее мы добавим код, реализующий случайное перемещение окна в том случае, если курсор приблизиться к кнопке «Да, конечно!».
Определение перемещения указателя мыши по форме
Щелкните непосредственно на части формы создаваемого приложения (НЕ на одном из элементов).
Теперь перейдите к свойствам формы с помощью щелчка правой кнопки мыши -> контекстное меню свойства.
Теперь необходимо перейти к списку возможных событий, которые может получать данное окно. Для этого щелкните на кнопке «Event» (события), как показано на рисунке 8:
Рисунок 8. Переход к списку возможных событий.
Когда пользователь передвигает указатель мыши по нашему окну, операционная система посылает сообщение программе с текущими координатами указателя. Они-то нам и нужны.
Чтобы назначить обработчик данного события, найдите строку MouseMove (рис. 9), после чего сделайте двойной щелчок в поле справа от нее – автоматически добавится обработчик события движения мыши и добавится функция Form1_MouseMove в коде нашей программы.
Рисунок 9. После двойного щелчка справа от MouseMove появиться данная строка, и автоматически совершится переход к коду функции-обработчика данного события.
Добавьте в эту функцию 2 строки, чтобы ее код стал выглядеть следующим образом.
Данная функция, обрабатывающая событие перемещения указателя мыши над формой, получает 2 параметра: объект отправитель и экземпляр класса MouseEventsArgs, содержащий информацию о координатах указателя мыши и других текущих свойствах.
textBox1 и textBox2 это экземпляры класса textbox, реализующие управление нашими элементами поля для ввода.
Член данных экземпляров Text позволяет установить текст в данных полях.
Таким образом, если теперь откомпилировать программу (F5), при перемещении указателя мыши по форме окна мы будем видеть координаты указателя (внутри формы), которые будут непрерывно изменяться.
Теперь вернемся к заготовке нашей формы. Для это щелкните на соответствующей закладке (Form1.cs [Конструктор]), как показано на рисунке 10:
Рисунок 10. Переход к конструктору форм C#.
Сделайте двойной щелчок по первой кнопке: Visual Studio автоматически добавит код обработки данной кнопки при нажатии.
Добавьте следующие строки кода:
Теперь снова вернитесь к конструктору и добавьте вторую кнопку, также с помощью двойного щелчка по ней.
Она будет содержать следующий код:
Как видите, здесь мы немного усложнили код вызова окна-сообщения, чтобы продемонстрировать то, как оно работает, более подробно. Все параметры передаваемые в функцию Show закомментированны в исходном коде.
Теперь нам осталось только реализовать перемещение окна в тот момент, когда мышь приближается к кнопке «Да, конечно».
Для этого мы добавим код в функцию:
private void Form1_MouseMove(object sender, MouseEventArgs)
Принцип очень прост: получая координаты движения мыши, мы проверяем не входят ли они в квадрат, очерчивающий нашу кнопку с небольшим запасом. Если да, то мы генерируем 2 случайных числа, которые будут использованы для перемещения окна.
Мы бы могли просто отслеживать сообщение о наведении указателя мыши на кнопку, но оно приходит с заметной задержкой, в связи с чем пользователь без особого труда нажмет на кнопку да, поэтому мы будем просто вычислять попадание курсора в зону вокруг кнопки.
Также нам понадобится объявить несколько "рабочих" переменных, которые мы будем в дальнейшем использовать.
Генерация случайных чисел
Класс Random в C# представляет собой генератор псевдослучайных чисел — т.е. данный класс отвечает за выдачу последовательности чисел, отвечающую определенным статистическим критериям случайности.
Random rnd = new Random();
Здесь мы объявили экземпляр класса Random (rnd), с помощью которого мы будем генерировать случайные числа. В дальнейшем мы будем использовать код, вида rnd.Next (диапазон_генерации) или rnd.Next (от, до -1) для генерации случайного числа.
Также мы объявим еще несколько переменных, часть из которых сразу будет инициализирована.
tmp_location объявляется для того, чтобы в будущем временно хранить текущее положение окна.
Также нам следует подумать о том, что при случайном перемещении, наше окно может выйти далеко за пределы экрана.
Чтобы определить разрешение экрана в C# .NET, мы будем использовать:
_h и _w будут хранить в себе размеры экрана пользователя, которые определяются при их инициализации.
Теперь код этой функции будет выглядеть следующим образом:
Вот, собственно, и все. Откомпеллировав приложение, можете попробовать нажать на кнопку "Да, конечно". Это будет крайне трудно.
20) C # Приложение Windows Forms
До сих пор мы видели, как работать с C # для создания консольных приложений. Но в реальной ситуации команда обычно использует Visual Studio и C # для создания Windows Forms или веб-приложений.
Приложение Windows Form – это приложение, которое предназначено для работы на компьютере. Он не будет работать в веб-браузере, потому что тогда он станет веб-приложением.
Этот урок будет посвящен тому, как мы можем создавать приложения для Windows. Мы также изучим некоторые основы работы с различными элементами приложений Windows.
В этом уроке вы узнаете
Основы Windows Forms
Приложение Windows Forms работает на настольном компьютере. Приложение форм Windows обычно имеет набор элементов управления, таких как метки, текстовые поля, списки и т. Д.
Ниже приведен пример простого приложения для Windows. Он показывает простой экран входа в систему, который доступен пользователю. Пользователь введет необходимые учетные данные, а затем нажмет кнопку «Вход», чтобы продолжить.
Итак, пример элементов управления, доступных в приведенном выше приложении
- Это коллекция элементов управления метками, которые обычно используются для описания смежных элементов управления. Таким образом, в нашем случае у нас есть 2 текстовых поля, и метки используются, чтобы сообщить пользователю, что одно текстовое поле предназначено для ввода имени пользователя, а другое – для пароля.
- 2 текстовых поля используются для хранения имени пользователя и пароля, которые будут введены пользователем.
- Наконец, у нас есть кнопка управления. К кнопке управления обычно прикрепляется некоторый код для выполнения определенного набора действий. Так, например, в приведенном выше случае мы могли бы заставить кнопку выполнить действие по проверке имени пользователя и пароля, которые вводит пользователь.
C # Hello World
Теперь давайте рассмотрим пример того, как мы можем реализовать простое приложение «Hello World» в Visual Studio. Для этого нам нужно будет выполнить следующие шаги
Шаг 1) Первый шаг включает создание нового проекта в Visual Studio. После запуска Visual Studio вам нужно выбрать пункт меню New-> Project.
Шаг 2) Следующий шаг – выбрать тип проекта в качестве приложения Windows Forms. Здесь также необходимо указать название и местонахождение нашего проекта.
- В диалоговом окне проекта мы видим различные варианты создания проектов разных типов в Visual Studio. Нажмите на опцию Windows слева.
- Если щелкнуть параметры Windows на предыдущем шаге, мы увидим параметр для приложения Windows Forms. Нажмите эту опцию.
- Затем мы даем имя для приложения, которое в нашем случае – DemoApplication. Нам также нужно указать место для хранения нашего приложения.
- Наконец, мы нажимаем кнопку «ОК», чтобы позволить Visual Studio создать наш проект.
Если вышеуказанные шаги будут выполнены, вы получите следующий вывод в 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 и просто перетащить его на форму.
После того, как вы перетащите метку на форму, вы можете увидеть метку, встроенную в форму, как показано ниже.
Шаг 4) Следующий шаг – перейти к свойствам элемента управления и изменить текст на «Hello World».
Чтобы перейти к свойствам элемента управления, необходимо щелкнуть его правой кнопкой мыши и выбрать пункт меню «Свойства».
- Панель свойств также отображается в Visual Studio. Таким образом, для элемента управления меткой в элементе управления свойствами перейдите в раздел «Текст» и введите «Hello World».
- Каждый элемент управления имеет набор свойств, которые описывают элемент управления.
Если вы выполните все вышеперечисленные шаги и запустите свою программу в Visual Studio, вы получите следующий вывод
Вывод:-
В выводе вы можете видеть, что форма Windows отображается. Вы также можете увидеть «Hello World» отображается в форме.
Добавление элементов управления в форму
Мы уже видели, как добавить элемент управления в форму, когда добавили элемент управления меткой в предыдущем разделе, чтобы отобразить «Hello World».
Давайте посмотрим на другие элементы управления, доступные для форм Windows, и рассмотрим некоторые их общие свойства.
В нашем примере мы создадим одну форму, которая будет иметь следующую функциональность.
- Возможность для пользователя ввести имя и адрес.
- Возможность выбрать город, в котором находится пользователь
- Возможность для пользователя ввести опцию для пола.
- Возможность выбрать курс, который пользователь хочет изучать. Там будут делать выбор как для C #, так и для ASP.Net
Итак, давайте подробно рассмотрим каждый элемент управления и добавим их для построения формы с вышеупомянутой функциональностью.
Групповая коробка
Групповое поле используется для логической группировки элементов управления в раздел. Давайте рассмотрим пример, если у вас была коллекция элементов управления для ввода таких данных, как имя и адрес человека. В идеале это данные человека, поэтому вы бы хотели, чтобы эти данные были указаны в отдельном разделе формы. Для этого у вас может быть групповое поле. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже
Шаг 1) Первый шаг – перетащить элемент управления Groupbox на форму Windows из панели инструментов, как показано ниже.
Шаг 2) После того, как группа будет добавлена, перейдите в окно свойств, нажав на элемент управления группы. В окне свойств перейдите к свойству Text и измените его на «Сведения о пользователе».
После внесения вышеуказанных изменений вы увидите следующий вывод
Вывод:-
В выводе вы можете четко видеть, что Groupbox был добавлен в форму. Вы также можете видеть, что текст группового блока был изменен на «Сведения о пользователе».
Контроль над этикетками
Затем идет Контроль надписей. Элемент управления меткой используется для отображения текста или сообщения пользователю в форме. Элемент управления меткой обычно используется вместе с другими элементами управления. Типичными примерами являются метка, добавляемая вместе с элементом управления textbox.
Метка указывает пользователю на то, что ожидается заполнить в текстовом поле. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим 2 метки, одна из которых будет называться «имя», а другая – «адрес». Они будут использоваться вместе с элементами управления текстовым полем, которые будут добавлены в следующем разделе.
Шаг 1) Первый шаг – перетащить элемент управления меткой в форму Windows из панели инструментов, как показано ниже. Убедитесь, что вы перетаскиваете элемент управления меткой 2 раза, чтобы иметь один для «имени», а другой для «адреса».
Шаг 2) После добавления метки перейдите в окно свойств, щелкнув элемент управления меткой. В окне свойств перейдите к свойству Text каждого элемента управления label.
После внесения вышеуказанных изменений вы увидите следующий вывод
Вывод:-
Вы можете видеть элементы управления надписью, добавленные в форму.
Текстовое окно
Текстовое поле используется для того, чтобы пользователь мог ввести текст в приложение форм. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим в форму 2 текстовых поля, одно для Имени и другое для адреса, который будет введен для пользователя.
Шаг 1) Первый шаг – перетащить элемент управления текстовым полем на форму Windows из панели инструментов, как показано ниже.
Шаг 2) После добавления текстовых полей перейдите в окно свойств, щелкнув элемент управления текстовым полем. В окне свойств перейдите к свойству Name и добавьте осмысленное имя в каждое текстовое поле. Например, назовите текстовое поле для пользователя как txtUser, а для адреса – txtAddress. Соглашение и стандарт именования должны быть сделаны для элементов управления, потому что становится легче добавить дополнительную функциональность к этим элементам управления, что мы увидим позже.
После внесения вышеуказанных изменений вы увидите следующий вывод
Вывод:-
На выходе вы можете четко видеть, что текстовые поля были добавлены в форму.
Список
Список используется для отображения списка элементов в форме Windows. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим в форму список для хранения некоторых городов.
Шаг 1) Первый шаг – перетащить элемент управления со списком на форму Windows из панели инструментов, как показано ниже.
Шаг 2) После того, как список был добавлен, перейдите в окно свойств, нажав на элемент управления списка.
- Сначала измените свойство элемента управления Listbox, в нашем случае мы изменили его на lstCity
- Нажмите на свойство Items. Это позволит вам добавлять различные элементы, которые могут отображаться в списке. В нашем случае мы выбрали элементы «коллекция».
- В появившемся всплывающем редакторе коллекции строк введите названия городов. В нашем случае мы ввели «Мумбаи», «Бангалор» и «Хайдарабад».
- Наконец, нажмите кнопку «ОК».
После внесения вышеуказанных изменений вы увидите следующий вывод
Вывод:-
В выводе вы видите, что список был добавлен в форму. Вы также можете видеть, что список заполнен значениями города.
Переключатель
Radiobutton используется для демонстрации списка элементов, из которых пользователь может выбрать один. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим переключатель для мужской / женской опции.
Шаг 1) Первый шаг – перетащить элемент управления radiobutton на форму Windows из панели инструментов, как показано ниже.
Шаг 2) После добавления радиокнопки перейдите в окно свойств, щелкнув элемент управления радиокнопки.
- Во-первых, вам нужно изменить свойство текста обоих элементов управления Radio. Перейдите в окно свойств и измените текст на мужской радиобутон, а на другой женский.
- Аналогичным образом измените свойство name обоих элементов управления Radio. Перейдите в окно свойств и измените имя на «rdMale» одной радиокнопки и на «rdfemale» для другой.
Как только вы сделаете вышеуказанные изменения, вы увидите следующий вывод
Вывод:-
Вы увидите переключатели, добавленные в форму Windows.
флажок
Флажок используется для предоставления списка опций, в которых пользователь может выбрать несколько вариантов. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим 2 флажка в наши формы Windows. Эти флажки предоставят пользователю возможность изучать C # или ASP.Net.
Шаг 1) Первый шаг – перетащить элемент управления флажком на форму Windows из панели инструментов, как показано ниже.
Шаг 2) После того, как флажок был добавлен, перейдите в окно свойств, нажав на элемент управления флажок.
- Во-первых, вам нужно изменить свойство текста обоих элементов управления флажка. Откройте окно свойств и измените текст на C # и ASP.Net.
- Аналогичным образом измените свойство name обоих элементов управления Radio. Откройте окно свойств и измените имя на chkC для одного флажка и на chkASP для другого.
После внесения вышеуказанных изменений вы увидите следующий вывод
Вывод:-
кнопка
Кнопка используется, чтобы позволить пользователю нажать на кнопку, которая затем начнет обработку формы. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже. Мы добавим простую кнопку «Отправить», которая будет использоваться для отправки всей информации в форме.
Шаг 1) Первый шаг – перетащить элемент управления кнопки на форму Windows из панели инструментов, как показано ниже.
Шаг 2) После добавления кнопки перейдите в окно свойств, нажав на элемент управления Button.
- Во-первых, вам нужно изменить текстовое свойство кнопки управления. Откройте окно свойств и измените текст на «отправить».
- Аналогичным образом измените свойство name элемента управления. Откройте окно свойств и измените имя на «btnSubmit».
После внесения вышеуказанных изменений вы увидите следующий вывод
Вывод:-
Поздравляю, теперь у вас есть первая базовая форма Windows. Давайте теперь перейдем к следующей теме, чтобы увидеть, как мы можем выполнять обработку событий для элементов управления.
C # Обработка событий для элементов управления
При работе с формой окна вы можете добавлять события в элементы управления. Событие – это то, что происходит при выполнении действия. Вероятно, наиболее распространенным действием является нажатие кнопки на форме. В Windows Forms вы можете добавить код, который можно использовать для выполнения определенных действий при нажатии кнопки в форме.
Обычно, когда кнопка нажимается на форме, это означает, что должна выполняться некоторая обработка.
Давайте посмотрим на одно из событий и как оно может быть обработано, прежде чем мы перейдем к сценарию события кнопки.
В приведенном ниже примере будет показано событие для элемента управления Listbox. Таким образом, всякий раз, когда элемент выбран в элементе управления списком, должно появиться окно сообщения, в котором отображается выбранный элемент. Давайте выполним следующие шаги для достижения этой цели.
Шаг 1) Дважды щелкните по списку в конструкторе форм . Делая это, Visual Studio автоматически откроет файл кода для формы. И он автоматически добавит метод события в код. Этот метод события будет запускаться всякий раз, когда выбран какой-либо элемент в списке.
Выше приведен фрагмент кода, который автоматически добавляется Visual Studio при двойном щелчке элемента управления «Список» на форме. Теперь давайте добавим приведенный ниже фрагмент кода в этот фрагмент кода, чтобы добавить необходимые функции в событие списка.
- Это метод обработчика событий, который автоматически создается Visual Studio при двойном щелчке элемента управления «Список». Вам не нужно беспокоиться о сложности имени метода или параметров, передаваемых в метод.
- Здесь мы получаем SelectedItem через свойство lstCity.SelectedItem. Помните, что lstCity – это имя нашего элемента управления Listbox. Затем мы используем метод GetItemText, чтобы получить фактическое значение выбранного элемента. Затем мы присваиваем это значение текстовой переменной.
- Наконец, мы используем метод MessageBox для отображения значения текстовой переменной для пользователя.
Как только вы внесете вышеуказанные изменения и запустите программу в Visual Studio, вы увидите следующий вывод
Вывод:-
Из вывода видно, что при выборе любого элемента из списка появляется окно сообщения. Это покажет выбранный элемент из списка.
Теперь давайте посмотрим на последний элемент управления, который представляет собой метод нажатия кнопки. Опять же, это следует той же философии. Просто дважды щелкните кнопку в конструкторе форм, и он автоматически добавит метод для обработчика события кнопки. Тогда вам просто нужно добавить код ниже.
- Это метод обработчика событий, который автоматически создается Visual Studio при двойном щелчке по кнопке управления. Вам не нужно беспокоиться о сложности имени метода или параметров, передаваемых в метод.
- Здесь мы получаем значения, введенные в текстовое поле имени и адреса. Значения могут быть взяты из свойства text текстового поля. Затем мы присваиваем значения двум переменным: name и address соответственно.
- Наконец, мы используем метод MessageBox для отображения значения имени и адреса для пользователя.
Как только вы внесете вышеуказанные изменения и запустите программу в Visual Studio, вы увидите следующий вывод
Вывод:-
- Сначала введите значение в поле имени и адреса.
- Затем нажмите на кнопку Отправить
После того, как вы нажмете кнопку «Отправить», появится окно сообщения, в котором будет правильно показано, что вы ввели в разделе сведений о пользователе.
Управление Tree и PictureBox
Есть еще 2 элемента управления, на которые мы можем обратить внимание: один – «Управление деревом», а другой – «Управление изображением». Давайте посмотрим на примеры того, как мы можем реализовать эти элементы управления
Управление Деревом
– Элемент управления деревом используется для перечисления элементов в дереве, как мода. Вероятно, лучший пример – это когда мы видим сам Windows Explorer. Структура папок в проводнике Windows похожа на древовидную структуру.
Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже.
Шаг 1) Первый шаг – перетащить элемент управления Tree в форму Windows из панели инструментов, как показано ниже.
Шаг 2) Следующий шаг – начать добавлять узлы в коллекцию дерева, чтобы он мог соответственно появиться в дереве. Во-первых, давайте выполните следующие подэтапы, чтобы добавить корневой узел в коллекцию деревьев.
- Перейдите к панели инструментов свойств для древовидного элемента управления. Нажмите на свойство узла. Это вызовет редактор TreeNode
- В редакторе TreeNode нажмите кнопку Add Root, чтобы добавить корневой узел в коллекцию дерева.
- Затем измените текст корневого узла, укажите текст в качестве корневого и нажмите кнопку «ОК». Это добавит корневой узел.
Шаг 3) Следующий шаг – начать добавлять дочерние узлы в коллекцию деревьев. Давайте выполним следующие подэтапы, чтобы добавить дочерний корневой узел в коллекцию деревьев.
- Сначала нажмите кнопку «Добавить дочерний элемент». Это позволит вам добавить дочерние узлы в коллекцию Tree.
- Для каждого дочернего узла измените свойство text. Продолжайте повторять предыдущий шаг и этот шаг и добавьте 2 дополнительных узла. В итоге у вас будет 3 узла, как показано выше, с текстом соответственно Label, Button и Checkbox.
- Нажмите на кнопку ОК
После внесения вышеуказанных изменений вы увидите следующий вывод.
Вывод:-
Вы сможете увидеть древовидное представление, добавленное к форме. Когда вы запускаете приложение формы Windows, вы можете развернуть корневой узел и увидеть дочерние узлы в списке.
PictureBox Control
Этот элемент управления используется для добавления изображений в Windows Forms. Давайте посмотрим, как мы можем реализовать это на примере, показанном ниже.
Шаг 1) Первый шаг – перетащить элемент управления PictureBox в форму Windows из панели инструментов, как показано ниже.
Шаг 2) Следующий шаг – прикрепить изображение к элементу управления графическим блоком. Это можно сделать, выполнив следующие шаги.
- Сначала нажмите на свойство Image для элемента управления PictureBox. Появится новое окно.
- В этом окне нажмите на кнопку «Импорт». Это будет использоваться для прикрепления изображения к элементу управления Picturebox.
- Появится диалоговое окно, в котором вы сможете выбрать изображение для прикрепления картинки
- Нажмите на кнопку ОК
Как только вы сделаете вышеуказанные изменения, вы увидите следующий вывод