До цього часу ми бачили, як працювати з C # для створення консольних програм. Але в реальному сценарії команда зазвичай використовує Visual Studio і C # для створення Windows Forms або веб-додатків.
Додаток у формі Windows - це програма, яка призначена для роботи на комп’ютері. Він не працюватиме у веб-браузері, оскільки тоді він стає веб-додатком.
Цей підручник буде зосереджений на тому, як ми можемо створювати додатки на базі Windows. Ми також вивчимо основи роботи з різними елементами програми C # Windows.
У цьому підручнику для Windows ви дізнаєтесь-
- Основи Windows Forms
- Привіт Світ у Windows Forms
- Додавання елементів керування до форми
- Обробка подій для елементів керування
- Дерево та PictureBox Control
Основи Windows Forms
Додаток для форм Windows - це той, який працює на настільному комп'ютері. Додаток для форм Windows зазвичай матиме набір елементів керування, таких як мітки, текстові поля, списки тощо.
Нижче наведено приклад простої програми для Windows у формі C #. Він показує простий екран входу, доступний користувачеві. Користувач введе необхідні облікові дані, а потім натисніть кнопку Вхід, щоб продовжити.
Отже, приклад елементів управління, доступних у наведеному вище додатку
- Це набір елементів керування етикеткою, які зазвичай використовуються для опису сусідніх елементів управління. Отже, у нашому випадку у нас є 2 текстових поля, і мітки використовуються, щоб повідомити користувачеві, що одне текстове поле призначене для введення імені користувача, а друге - для пароля.
- Два текстових поля використовуються для зберігання імені користувача та пароля, які будуть введені користувачем.
- Нарешті, у нас є кнопкове управління. Зазвичай кнопка управління має прикріплений код для виконання певного набору дій. Так, наприклад, у наведеному вище випадку, ми могли б мати кнопку виконати дію перевірки імені користувача та пароля, які вводиться користувачем.
C # Привіт Світ
А тепер давайте розглянемо приклад того, як ми можемо реалізувати просте додаток «привіт світ» у 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 файли проекту
- Застосування форми під назвою Forms1.cs. Цей файл буде містити весь код програми Windows Form.
- Основна програма під назвою Program.cs - це файл коду за замовчуванням, який створюється при створенні нової програми у Visual Studio. Цей код міститиме стартовий код програми в цілому.
У лівій частині Visual Studio ви також побачите ToolBox. Набір інструментів містить усі елементи керування, які можна додати до Windows Forms. Елементи керування, такі як текстове поле або мітка, - це лише деякі елементи управління, які можна додати до Windows Forms.
Нижче наведено скріншот того, як виглядає Панель інструментів.
Крок 3) На цьому кроці ми тепер додамо ярлик до форми, який відображатиме "Hello World". На панелі інструментів вам потрібно буде вибрати елемент керування «Мітка» та просто перетягнути його на форму.
Перетягнувши мітку до форми, ви зможете побачити мітку, вбудовану у форму, як показано нижче.
Крок 4) Наступним кроком є перехід до властивостей елемента керування та зміна тексту на «Hello World».
Щоб перейти до властивостей елемента керування, потрібно клацнути елемент керування правою кнопкою миші та вибрати пункт меню Властивості
- Панель властивостей також відображається у Visual Studio. Отже, для елемента керування ярликом у елементі керування властивостями перейдіть до розділу Текст і введіть "Hello World".
- Кожен елемент керування має набір властивостей, що описують елемент керування.
Якщо виконати всі вищезазначені кроки та запустити програму у Visual Studio, ви отримаєте наступний результат
Вихід: -
На виході ви бачите, що відображається форма Windows. Ви також можете побачити, що на формі відображається "Hello World".
Додавання елементів керування до форми
Ми вже бачили, як додати елемент керування у форму, коли ми додали елемент керування ярликом у попередньому розділі, щоб відобразити "Hello World".
Давайте розглянемо інші елементи керування, доступні для форм Windows, і побачимо деякі їх загальні властивості.
У нашому додатку форми Windows на прикладах C # ми створимо одну форму, яка матиме такі функції.
- Можливість введення користувачем імені та адреси.
- Можливість вибрати місто, в якому проживає користувач
- Можливість для користувача ввести параметр для статі.
- Можливість вибрати курс, який користувач хоче вивчити. Там буде зроблено вибір як для C #, так і для ASP.Net
Тож давайте детально розглянемо кожен елемент керування та додамо його для побудови форми із зазначеною вище функціональністю.
Групова скринька
Групове поле використовується для логічного групування елементів керування в розділі. Давайте візьмемо приклад, якщо у вас була колекція елементів керування для введення таких даних, як ім’я та адреса людини. В ідеалі це дані про особу, тому ви хотіли б мати ці деталі в окремому розділі форми. Для цього ви можете мати групову скриньку. Давайте подивимося, як ми можемо реалізувати це на прикладі, показаному нижче
Крок 1) Першим кроком є перетягування елемента керування Groupbox у форму Windows із панелі інструментів, як показано нижче
Крок 2) Після додавання групової скриньки перейдіть до вікна властивостей, клацнувши на елементі керування груповою скринькою. У вікні властивостей перейдіть до властивості Text і змініть його на "Інформація про користувача".
Після внесення вищевказаних змін ви побачите наступний результат
Вихід: -
На виході ви можете чітко бачити, що Groupbox було додано до форми. Ви також можете помітити, що текст групового вікна було змінено на "Інформація про користувача".
Контроль етикетки
Далі йде контроль етикетки. Етикетка управління використовується для відображення тексту або повідомлення користувачеві у формі. Етикетка управління, як правило, використовується разом з іншими елементами управління. Поширені приклади, коли мітка додається разом із елементом керування текстовим полем.
Мітка вказує користувачеві на те, що передбачається заповнити в текстовому полі. Давайте подивимося, як ми можемо реалізувати це на прикладі, показаному нижче. Ми додамо 2 мітки, одна з яких називатиметься "ім'я", а інша - "адреса". Вони будуть використовуватися разом із елементами керування текстовим полем, які будуть додані в наступному розділі.
Крок 1) Першим кроком є перетягування елемента керування мітками у форму Windows із панелі інструментів, як показано нижче. Переконайтеся, що перетягнули елемент керування ярликом 2 рази, щоб ви могли мати одне для «імені», а інше для «адреси».
Крок 2) Після додавання мітки перейдіть до вікна властивостей, натиснувши елемент керування етикеткою. У вікні властивостей перейдіть до властивості Text кожного елемента керування мітками.
Після внесення вищевказаних змін ви побачите наступний результат
Вихід: -
Ви можете бачити елементи керування мітками, додані до форми.
Текстове вікно
Текстове поле використовується, щоб дозволити користувачеві ввести якийсь текст у програмі Windows на C #. Давайте подивимося, як ми можемо реалізувати це на прикладі, показаному нижче. До форми ми додамо 2 текстових поля, одне для імені, а інше для адреси, яку потрібно ввести для користувача
Крок 1) Першим кроком є перетягування елемента керування текстовим полем у форму Windows із панелі інструментів, як показано нижче
Крок 2) Після додавання текстових полів перейдіть до вікна властивостей, натиснувши елемент керування текстовим полем. У вікні властивостей перейдіть до властивості Name і додайте значуще ім’я до кожного текстового поля. Наприклад, назвіть текстове поле для користувача txtUser, а текстове - для адреси txtAddress. Для елементів керування слід створити конвенцію і стандарт іменування, оскільки стає легше додати додаткову функціональність до цих елементів управління, про що ми побачимо пізніше.
Після внесення вищевказаних змін ви побачите наступний результат
Вихід: -
На виході ви можете чітко помітити, що текстові поля були додані до форми.
Поле зі списком
Вікно списку використовується для демонстрації списку елементів у формі Windows. Давайте подивимося, як ми можемо реалізувати це на прикладі, показаному нижче. До форми ми додамо поле зі списком для зберігання деяких міст.
Крок 1) Першим кроком є перетягування елемента керування списком у форму Windows із панелі інструментів, як показано нижче
Крок 2) Після додавання вікна списку перейдіть до вікна властивостей, клацнувши на елемент керування списком.
- По-перше, змініть властивість елемента керування Boxbox List, у нашому випадку ми змінили це на lstCity
- Клацніть на властивість Items. Це дозволить вам додавати різні елементи, які можуть відображатися у вікні списку. У нашому випадку ми вибрали елементи "колекції".
- У спливаючому редакторі колекції рядків введіть назви міст. У нашому випадку ми ввели "Мумбаї", "Бангалор" та "Хайдарабад".
- Нарешті, натисніть кнопку «ОК».
Після внесення вищевказаних змін ви побачите наступний результат
Вихід: -
У вихідних даних ви бачите, що Listbox було додано до форми. Ви також можете помітити, що поле списку було заповнене значеннями міста.
Радіо-кнопка
Кнопка Радіо використовується для демонстрації списку предметів, з яких користувач може вибрати один. Давайте подивимося, як ми можемо реалізувати це на прикладі, показаному нижче. Ми додамо перемикач для варіанту для чоловіків / жінок.
Крок 1) Першим кроком є перетягування елемента керування «перемикачем» на форму Windows із панелі інструментів, як показано нижче.
Крок 2) Після додавання кнопки «Радіо» перейдіть до вікна властивостей, натиснувши кнопку управління кнопкою «Радіо».
- По-перше, вам потрібно змінити властивість тексту обох елементів управління радіо. Перейдіть у вікна властивостей і змініть текст на чоловічий одного перемикача, а текст іншого - на жіночий.
- Подібним чином змініть властивість імені обох елементів керування Radio. Перейдіть у вікна властивостей і змініть ім'я на "rdMale" однієї перемикача та на "rdfemale" для іншого.
Якщо ви внесете вищезазначені зміни, ви побачите наступний результат
Вихід: -
Ви побачите перемикачі, додані до форми Windows.
Прапорець
Прапорець використовується для надання списку опцій, в яких користувач може вибрати кілька варіантів. Давайте подивимося, як ми можемо реалізувати це на прикладі, показаному нижче. Ми додамо 2 прапорці до наших форм Windows. Ці прапорці дозволять користувачеві вибрати, чи бажають вони вивчати C # або ASP.Net.
Крок 1) Першим кроком є перетягування елемента керування прапорець у форму Windows із панелі інструментів, як показано нижче
Крок 2) Після додавання прапорця перейдіть до вікна властивостей, клацнувши елемент управління Checkbox.
У вікні властивостей
- По-перше, вам потрібно змінити властивість тексту обох елементів прапорця. Перейдіть у вікна властивостей і змініть текст на C # та ASP.Net.
- Подібним чином змініть властивість імені обох елементів керування Radio. Перейдіть у вікна властивостей і змініть ім'я на chkC одного прапорця та на chkASP для іншого.
Після внесення вищевказаних змін ви побачите наступний результат
Вихід: -
Кнопка
Кнопка використовується, щоб дозволити користувачеві натиснути кнопку, яка потім розпочне обробку форми. Давайте подивимося, як ми можемо реалізувати це на прикладі, показаному нижче. Ми додамо просту кнопку під назвою "Надіслати", яка буде використовуватися для подання всієї інформації у формі.
Крок 1) Першим кроком є перетягування кнопки керування у форму Windows із панелі інструментів, як показано нижче
Крок 2) Після додавання кнопки перейдіть до вікна властивостей, натиснувши кнопку управління.
- Спочатку потрібно змінити властивість тексту елемента керування кнопкою. Перейдіть у вікна властивостей і змініть текст на "надіслати".
- Подібним чином змініть властивість name елемента керування. Перейдіть у вікна властивостей і змініть назву на 'btnSubmit'.
Після внесення вищевказаних змін ви побачите наступний результат
Вихід: -
Вітаємо! Тепер у вас є перша основна форма Windows. Давайте тепер перейдемо до наступної теми, щоб побачити, як ми можемо обробляти події для елементів керування.
C # Обробка подій для елементів керування
Під час роботи з віконною формою ви можете додавати події до елементів керування. Подія - це те, що відбувається, коли виконується дія. Ймовірно, найпоширеніша дія - це натискання кнопки на формі. У C # Windows Forms ви можете додати код, який можна використовувати для виконання певних дій при натисканні кнопки на формі.
Зазвичай, коли на формі натискається кнопка, це означає, що має відбутися деяка обробка.
Давайте подивимось на одну з подій та на те, як з нею можна впоратися, перш ніж переходити до сценарію події кнопки.
Наведений нижче приклад продемонструє подію для елемента керування Listbox. Отже, кожного разу, коли елемент вибирається в елементі керування списком, має з’явитися вікно повідомлення, яке відображає вибраний елемент. Виконаймо наступні кроки для досягнення цього.
Крок 1) Двічі клацніть на поле списку у конструкторі форм . Роблячи це, Visual Studio автоматично відкриє файл коду для форми. І він автоматично додасть метод події до коду. Цей метод події запускатиметься щоразу, коли буде вибрано будь-який елемент у списку.
Вгорі наведено фрагмент коду, який автоматично додається Visual Studio, коли ви двічі клацаєте елементом керування списком у формі. Тепер додамо нижченаведений розділ коду до цього фрагмента коду, щоб додати необхідну функціональність до події списку.
- Це метод обробника подій, який автоматично створюється Visual Studio при подвійному клацанні елементом керування списком. Вам не потрібно турбуватися про складність назви методу або параметрів, переданих методу.
- Тут ми отримуємо SelectedItem через властивість lstCity.SelectedItem. Пам'ятайте, що lstCity - це ім'я нашого елемента керування Listbox. Потім ми використовуємо метод GetItemText, щоб отримати фактичне значення вибраного елемента. Потім ми присвоюємо це значення текстовій змінній.
- Нарешті, ми використовуємо метод MessageBox, щоб відобразити користувачеві значення текстової змінної.
Після внесення вищевказаних змін і запуску програми у Visual Studio ви побачите наступний результат
Вихід: -
З вихідних даних видно, що коли вибрано будь-який елемент зі списку, з’явиться вікно повідомлення. Це покаже вибраний елемент зі списку.
Тепер давайте розглянемо остаточний контроль, яким є метод натискання кнопки. Знову це слідує тій же філософії. Просто двічі клацніть кнопку у конструкторі форм, і він автоматично додасть метод для обробника подій кнопки. Тоді вам просто потрібно додати наведений нижче код.
- Це метод обробника подій, який автоматично створюється Visual Studio при подвійному клацанні кнопки керування. Вам не потрібно турбуватися про складність назви методу або параметрів, переданих методу.
- Тут ми отримуємо значення, введені в текстове поле імені та адреси. Значення можна взяти із властивості text текстового поля. Потім ми присвоюємо значення 2 змінним, імені та адресі відповідно.
- Нарешті, ми використовуємо метод MessageBox, щоб відобразити користувачеві значення імені та адреси.
Після внесення вищевказаних змін і запуску програми у Visual Studio ви побачите наступний результат
Вихід: -
- Спочатку введіть значення в поле імені та адреси.
- Потім натисніть кнопку Надіслати
Після натискання кнопки «Надіслати» з’явиться вікно повідомлення, яке правильно покаже, що ви ввели в розділі «Інформація про користувача».
Дерево та PictureBox Control
Є ще 2 елементи управління, які ми можемо розглянути, один - це «Дерево управління», а інший - «Керування зображеннями». Давайте розглянемо приклади того, як ми можемо реалізувати ці елементи управління
Контроль дерева
- Елемент керування деревом використовується для перерахування предметів у дереві, як це відбувається. Напевно, найкращий приклад - це коли ми бачимо сам Провідник Windows. Структура папок у Провіднику Windows схожа на деревоподібну структуру.
Давайте подивимося, як ми можемо реалізувати це на прикладі, показаному нижче.
Крок 1) Першим кроком є перетягування елемента керування Деревом у форму Windows із панелі інструментів, як показано нижче
Крок 2) Наступним кроком є початок додавання вузлів до колекції дерев, щоб вона могла відповідно з’явитися в дереві. Спочатку виконаймо наведені нижче підкроки, щоб додати кореневий вузол до колекції дерев.
- Перейдіть до панелі інструментів властивостей для елемента керування деревом. Клацніть на властивість Node. Це відкриє редактор TreeNode
- У редакторі TreeNode натисніть кнопку Додати корінь, щоб додати кореневий вузол до колекції дерев.
- Далі змініть текст кореневого вузла та надайте його як корінь і натисніть кнопку «OK». Це додасть кореневий вузол.
Крок 3) Наступним кроком є початок додавання дочірніх вузлів до колекції дерев. Давайте виконуватимемо наступні підкроки, щоб додати дочірній кореневий вузол до колекції дерев.
- Спочатку натисніть кнопку Додати дочірню кнопку. Це дозволить вам додавати дочірні вузли до колекції Tree.
- Для кожного дочірнього вузла змініть властивість тексту. Продовжуйте повторювати попередній крок і цей крок і додайте 2 додаткові вузли. Врешті-решт, у вас буде 3 вузли, як показано вище, з текстом як Label, Button та Checkbox відповідно.
- Натисніть кнопку ОК
Після внесення вищевказаних змін ви побачите наступний результат.
Вихід: -
Ви зможете побачити вид дерева, доданий до форми. Під час запуску програми форми Windows ви можете розгорнути кореневий вузол і побачити дочірні вузли у списку.
PictureBox Control
Цей елемент керування використовується для додавання зображень до Winforms C #. Давайте подивимося, як ми можемо реалізувати це на прикладі, показаному нижче.
Крок 1) Першим кроком є перетягування елемента керування PictureBox у форму C # Windows із набору інструментів, як показано нижче
Крок 2) Наступним кроком є фактичне прикріплення зображення до елемента керування графічним полем. Це можна зробити, виконавши наведені нижче дії.
- Спочатку клацніть на властивість Image для елемента керування PictureBox. Вискочить нове вікно.
- У цьому вікні натисніть кнопку Імпортувати. Це буде використано для прикріплення зображення до елемента керування Picturebox.
- З'явиться діалогове вікно, в якому ви зможете вибрати зображення для прикріплення вікна
- Натисніть кнопку ОК
Якщо ви внесете вищезазначені зміни, ви побачите наступний результат
Вихід: -
З вихідних даних видно, що зображення відображається у формі.
Резюме
- Форма Windows у програмі C # - це форма, яка працює на робочому столі комп’ютера. Форму Visual Studio разом із C # можна використовувати для створення програми Windows Forms.
- Елементи керування можна додати до форм Windows C # за допомогою Панелі інструментів у Visual Studio. Елементи керування, такі як мітки, прапорці, перемикачі тощо, можна додати до форми за допомогою панелі інструментів.
- Можна також використовувати розширені елементи керування, такі як керування деревом та PictureBox.
- Обробники подій використовуються для реагування на події, створені за допомогою елементів керування. Найпоширеніший - доданий для події, натиснутої на кнопку.