Добавил:
ivanov666
Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз:
Предмет:
Файл:Программирование на языке C# Консольные и оконные приложения. Лабораторный практикум. Учебное пособие
.pdf
8. Как задать вид иконки на окне сообщения типа MessageBox?
9. Как получить код кнопки, которую нажал пользователь в окне сообщения типа
MessageBox? Как обработать этот код с целью выполнения соответствующих действий?
10. Какие константы определяют отдельные кнопки на окне сообщения? Типовые
комбинации кнопок?
11. Какие константы определяют вид иконки на окне сообщения?
12. Какие константы определяют результат закрытия окна сообщения?
Вариант задания
Доработать приложение по решению задачи из своего варианта предыдущей лабора-
торной. Приложение модифицировать так, чтобы исходный массив считывался из текстового
файла. Результат сохранить в текстовый файл. Данные должны читаться и сохраняться в
файлах, указанных пользователем.
71

Лабораторная работа № 15
Создание приложения с улучшенным интерфейсом в среде MS VS C#
Цель работы: приобрести практические навыки в использовании компонентов
ImageList и StatusBar для оформления окна приложения.
Методические указания
Приложения, разработанные для работы под управление ОС Windows или других, име-
ющих графический интерфейс, содержат большое количество графических элементов. Такие
элементы улучшают внешний вид программы. Они дополняют и постепенно замещают традиционные текстовые элементы – пункты меню, кнопки на панели инструментов, обычные
кнопки (тексты на кнопках).
Некоторые компоненты позволяют подключать пиктограммы непосредственно с диска,
в виде картинок в стандартном формате. Некоторые компоненты подключают к себе картинки из небольшой коллекции, в частности для единообразия оформления пунктов меню и
кнопок панели инструментов. Тогда оформление можно менять в ходе работы программы.
Подключение пиктограмм к пунктам меню
При разработке интерфейса программы легко можно пункты меню и панели инстру-
ментов, кнопки дополнить пиктограммами. Порядок подключения пиктограмм к пунктам
меню, как главного, так и контекстного, несколько отличается от подключения пиктограмм к
другим компонентам. Для подключения пиктограмм к пунктам меню необходимо выполнить
несколько шагов:
Шаг 1. С помощью растрового графического редактора, например Paint, нарисовать
картинки, которые потребуется разместить в пунктах меню в виде пиктограмм. Картинки
можно сохранить в формате .PNG или .BMP.
Шаг 2. Через редактор пунктов меню выбрать нужный пункт меню или такой пункт
меню прямо в дизайнере формы. В свойстве Image (Appearance) вызвать редактор коллекции
пиктограмм Select Resource.
Шаг 3. В редакторе ресурсов Select Resource в разделе Project Resource File добавить
несколько картинок. Для этого нажать кнопку Import (внизу). Выбрать картинку из папки
«Пиктограммы» (или предварительно нарисовать самостоятельно). Повторить этот шаг несколько раз. Этим пополняется файл ресурсов проекта. Позже этой коллекцией можно пользоваться для подключения этих же пиктограмм к другим
компонентам приложения.
Рис. 1. Окно редактора ресурсов
Шаг 4. В коллекции картинок выбрать необходимую и закрыть редактор ресурсов
Select Resource по кнопке OK.
Шаг 5. Выбрать другой нужный пункт меню. Из коллекции картинок выбрать необ-
ходимую и закрыть редактор ресурсов Select Resource по кнопке OK.
Для всех пунктов меню, которым требуется подключение пиктограммы, повторить этот
пункт. Если требуется пополнить коллекцию, то это можно сделать в любой момент, когда
открыт редактор ресурсов Select Resource.
72

Не забудьте в дизайнере (нижняя полоса с невизуальными компонентами) выбрать
главное меню (menuStrip1 – имя по умолчанию) и в его свойстве ImageScalingSize
(Appearance) (свойство можно раскрыть и увидеть его подсвойства), в полях Width и Height
установить значения 32 (т. к. предложенные картинки имеют формат 32 32 пикселя).
Аналогично дополняются пиктограммами и пункты контекстного меню
(ContextMenuStrip1 – имя по умолчанию; с другими номерами – когда их несколько).
(Только коллекция пиктограмм уже собрана.) И также указывается размер пиктограмм46.
Компонент ImageList
При разработке интерфейса программы кнопки тоже можно дополнить пиктограммами.
Но технология подключения несколько иная.
Картинки, отображаемые в виде пиктограмм, собирают в коллекцию, в компонент
ImageList.
Создание коллекции картинок происходит в несколько шагов:
Шаг 1. С помощью растрового графического редактора, например Paint, нарисовать
картинки, которые потребуется разместить в коллекции ImageList. Картинки можно сохранить в формате .PNG или .BMP.
Шаг 2. На форму приложения бросить компонент ImageList. Настроить парамет-
ры компонента – размеры картинок, возможно, поле Name и др.
Шаг 3. Открыть редактор коллекции через компонент ImageList. Добавить кар-
тинки в коллекцию. Отредактировать коллекцию, если требуется47.
Компонент ImageList (страница Components) размещают на форме (тогда появится метка imageList1 на нижней полосе дизайнера формы). Метка компонента позволяет открыть
свойства этого коллектора картинок, а также настраивать параметры этого компонента в
Properties.
Пополнение коллекции картинок
в компоненте ImageList
После размещения компонента ImageList на форме необходимо указать размеры
картинок, которые будут храниться в этой коллекции. Здесь предлагается установить значения свойств Height и Width равными 32, которые входят в свойство ImageSize.
Открыть редактор коллекции можно через свойство Images. В редакторе коллекции
(рис. 2) по кнопке Add открыть стандартное окно и выбрать файл с картинкой в формате PNG
или BMP. Справа указываются параметры выбранной в списке картинки.
Рис. 2. Окно редактора картинок ImageList
Ненужную картинку можно удалить. Тогда её необходимо выделить в списке и кнопкой Remove удалить. Потом вставить другую на замену.
46
Если указать другой размер, то картинка будет системой отмасштабирована, но качество будет похуже.
47
Редактируются состав и порядок расположения картинок, если требуется. Сами картинки могут быть отре-
дактированы только графическим редактором, а потом добавлены в коллекцию или удалены из нее.
73

Картинки можно пересортировать. Необходимо выделить строчку в списке и стрелками
(справа от списка) перемещать строку вверх и вниз по списку.
Подключение к кнопкам пиктограмм из компонента ImageList
Когда картинки собраны в коллекцию ImageList, тогда коллекцию и картинки можно подключать к элементам интерфейса.
Подключение картинок к кнопкам выполняется в два шага.
Шаг 1. У компонента button1 в поле ImageList (Appearance) указывается кол-
лекция imageList148 (или другая, имеющаяся на форме).
Шаг 2. В свойстве ImageKey выбирается нужная картинка по номеру. Выпадающий
список индексов в современной версии сопровождается картинками, так что соответствующий номер выбрать несложно. Возможно свойство TextImageRelation потребуется
установить в значение ImageBeforeText.
Есть и другие способы подключения пиктограмм к кнопке (но это для самостоятельного изучения).
Результат можно проконтролировать на форме. Подобная технология подключения
пиктограмм применяется и в некоторых иных компонентах.
Использование горячих подсказок в пунктах меню
Многие компоненты, в том числе и пункты меню, могут иметь горячие подсказки – маленькое всплывающее окно со строкой текста, когда мышь задерживается над компонентом
на несколько секунд неподвижно. Для подключения горячих подсказок к пунктам главного
меню необходимо выполнить два шага:
Шаг 1. Выделить компонент menuStrip1 на полосе дизайнера внизу. В свойстве
ShowItemToolTips (Behavior) установить значение true.
Шаг 2. Выделить пункты меню, в том числе и названия разделов меню, если и им
требуется горячая подсказка. Каждому пункту в свойстве ToolTipText (Behavior) написать текст горячей подсказки, объясняющей действие команды в несколько слов.
Аналогично горячие подсказки создаются и для контекстного меню.
Результат можно проконтролировать после отладки программы и запуска на исполнение.
Использование горячих подсказок для компонентов формы
Многие компоненты, в том числе кнопки, тоже могут иметь горячие подсказки. Но технология создания и внешний вид таких подсказок отличается от технологии для меню. Для
подключения горячих подсказок к кнопкам необходимо выполнить несколько шагов:
Шаг 1. На форме разместить компонент ToolTip (Common Control).
Шаг 2. Наcтроить свойства компонента toolTip1 (раздел Misc):
ToolTipTitle – текст. Окошко горячих подсказок будет иметь заголовок с та-
ким текстом;
IsBalloon – значение true. Тогда горячая подсказка будет отображаться не в
прямоугольнике, а облачке;
ShowAlways – значение true. Тогда подсказки будут высвечиваться даже на не-
активных элементах.
Шаг 3. Выделить кнопку button1 (или другую). В свойстве ToolTip on toolTip1
(Misc) указать текст подсказки для этой кнопки, объясняющей действие команды в несколько
слов.
Результат можно проконтролировать после отладки и запуска программы на исполнение.
Внимание! Возможны сбои в работе подсказок. Иногда требуется просто перекомпилиро-
вать программу, не внося изменений.
48
Таких коллекций может быть несколько для одной формы. Они могут содержать картинки разных форматов,
или разной тематики. Это определяет и реализует разработчик программы.
74

На форму можно бросить несколько ToolTip. У кнопок и других компонентов тогда
будет несколько строк-свойств типа ToolTip on toolTip2 и т. д., т. е. компоненты можно разделить на группы. И для разных групп компонентов в подсказках будут разные заголовки (и другие свойства, если они настроены по-разному у разных ToolTip).
Такую же подсказку можно подключить и к самому главному меню (не пунктам), и
к контекстному.
Для одного компонента можно вписать тексты в несколько ToolTip. Но смысла это не
имеет, т. к. они будут накрывать друг друга и читаться будет только последнее.
Отображение подсказок в строке статуса
Для отображения оперативной информации при действиях пользователя с интерфейсом
используется строка статуса StatusStrip (страница Menus & ToolBars).
Она размещается на форме. Выделить её для настройки свойств можно на форме или по
кнопке на полосе внизу.
Строка статуса может иметь сложное строение. Но основное и простое её назначение –
это показать наличие изменяемого размера окна (треугольник на правом конце).
В этой строке можно организовать отображение информации разного рода. Например,
отображать текстовые комментарии к выбираемым пунктам главного меню и другим элементам программы.
Свойство SizingGrip (Appearance) определяет, отображать или нет на правом конце
точечный треугольник, указывающий, что размер окна можно менять. Но это только картинка-подсказка. Можно ли менять размер формы или она имеет фиксированные размеры определяется параметрами самой формы.
Для организации возможности отображать подсказки в строке StatusStrip необходимо выполнить несколько шагов:
Шаг 1. Разместить на форме StatusStrip.
Шаг 2. Через свойство Items (Data) на строку статуса добавить текстовое поле
ToolStripStatusLabel.
Шаг 3. Выделить кнопки, пункты меню, в том числе и названия разделов меню, другие компоненты, которым требуется подсказка в строке статуса. Каждому компоненту в
обработчике события MouseHover (Mouse) вписать оператор, который компоненту
toolStripStatusLabel1 присваивает строку текста с разъяснениями. В свойстве
ToolTipText (Behavior) написать текст горячей подсказки, объясняющей действие ко-
манды в несколько слов, а обработчику события MouseLeave (Mouse) вписать оператор,
который компоненту toolStripStatusLabel1 присваивает пустую строку текста.
Пример написания обработчиков приведен в листинге.
Листинг. Пример обработчиков событий, для отображения строк-подсказок в строке
статуса:
private void button1_MouseHover(object sender, EventArgs e)
{
toolStripStatusLabel1.Text = "Старт решения задачи";
}
private void button1_MouseLeave(object sender, EventArgs e)
{
toolStripStatusLabel1.Text = "";
}
Логика разработки проста. Когда мышь замирает над компонентом, система вызывает
обработчик такого события для этого компонента. А когда мышь покидает область компонента, то вызывается другой обработчик.
75

Использование кнопок переключения и выбора
Иногда программа должна предоставить пользователю выбор одного из вариантов.
Для организации возможности выбора
49
на интерфейсе окна программы можно разместить
компонент ListBox или ComboBox со списком строк.
Для организации выбора из двух вариантов обычно используют компонент CheckBox
(Common Controls). Это стандартный элемент с возможностью включения/выключения галочки. Иногда в литературе (и Интернете) называют независимым переключателем.
Основные свойства компонента:
Text – текст около окошка переключения;
Checked – булевское значение true/false; признак того, что галочка включена.
Основной обработчик события – CheckedChange – щелкнули по компоненту, переключили галочку.
Основные способы применения в коде программы:
В обработчике события CheckedChange проверяется, установлена ли сейчас га-
лочка50. Когда пользователь щелкает по этому элементу, происходит переключение состояния галочки и значения поля Checked: а) галочка включается – поле имеет значение true;
б) галочка исчезает – поле имеет значение false. После этого вызывается обработчик, где
можно проверить текущее значение поля и выполнить соответствующие действия.
В любом месте кода программы. При выполнении какого-то фрагмента кода прове-
ряется значение поля Checked этого элемента и выполняется та или иная ветка кода программы, т. е. пользователь через такой элемент может регулировать порядок выполнения какого-то алгоритма.
Вместо этого обработчика можно использовать обработчик Click. В простейшем случае
получается программа с одинаковым поведением. (Вероятно, разница появляется, когда
свойство AutoCheck имеет значение false.)
Для организации выбора из нескольких вариантов обычно используют группу компонентов RadioButton (Common Controls). Одиночный такой элемент похож на CheckBox.
Но RadioButton работают только в виде группы взаимодействующих элементов – на любой можно поставить точку (выделить; аналог галочки), но снять точку можно только установив её на другом элементе группы. В группе элементов только один может быть отмечен
точкой. Иногда в литературе (и Интернете) его называют зависимым переключателем.
Основные свойства компонента те же, что и для CheckBox.
Рекомендуемый обработчик события
Основной способ применения – в обработчике события Click проверяется, установлена
ли сейчас галочка. Точнее обработчик и вызывается при щелчке по элементу. Точка устанавливается на этом элементе, вызывается обработчик Click. При щелчке по другому элементу
(TRadioButton из этой группы) галочка с этого снимается, но обработчик не вызывается.
Поэтому проверку на наличие точки можно и не делать, а просто писать код, который необходимо выполнить приложению, если точка на этом элементе установлена.
Второй способ здесь не удобен51, т. к. необходимо проверять все элементы и искать у
какого установлена точка, т. е. есть необходимо писать целую группу операторов if.
Вместо обработчика Click можно использовать обработчик события CheckedChange
(он и создается по умолчанию). Разница в том, что такой обработчик вызывается, когда меняется состояние точки – и при её установке, и при её снятии, когда щелкают по-другому
RadioButton из группы.
49
Без изменения списка вариантов выбора пользователем.
50
В таком варианте использование этого элемента аналогично кнопке, но с двумя вариантами работы – когда
галочка установлена и когда снята.
51
Но может быть алгоритм с большим количеством ветвей. Тогда каждый if проверяет точку в соответствую-
щей RadioButton и выполняет соответствующий алгоритм.
76

Иногда на форме (на одном окне) необходимо организовать несколько групп из
RadioButton. Но все элементы RadioButton, помещенные в один контейнер (Form,
Panel, GroupBox), будут образовывать только одну группу. Поэтому на форме у каждой
группы должен быть свой контейнер. Например, на форме разместить несколько GroupBox
и в каждом из них создать свой набор из RadioButton. Но комбинация из контейнеров
может быть самая произвольная. Например, одна группа из RadioButton может размещаться непосредственно на форме, другая – на панели Panel, третья – в GroupBox.
Рис. 3. Пример использования переключателей
И необходимо помнить, что элементы интерфейса при старте программы должны быть
проинициализированы. Для компонентов-переключателей это означает, что на стадии разработки в дизайнере или на старте программы (обработчик события Load) необходимо у некоторых компонентов CheckBox установить свойству Checked значение true. И в каждой
группе компонентов RadioButton у одного из них установить значение true в свойстве
Checked. Пример вида при открытии окна с двумя независимыми переключателями и двумя
группами зависимых показан на рис. 3.
Контрольные вопросы
1. Как подключить пиктограммы к пунктам меню? К пунктам контекстного меню?
2. Как подключить к форме строку статуса?
3. Как обеспечить отображение горячих подсказок для
пунктов меню?
4. Как обеспечить отображение горячих подсказок для компонентов формы?
5. Как обеспечить отображение подсказок для пунктов меню в строке статуса?
6. Для чего используется компонент CheckBox? Как с ним работать в программе?
7. Для чего используется компонент RadioButton? Как с ним работать в программе?
8. Как организовать на форме
две независимых группы кнопок типа RadioButton?
Вариант задания
Доработать приложение по решению задачи из предыдущей лабораторной работы.
Подключить пиктограммы к пунктам меню. Разместить на форме компонент StatusBar.
Добавить поле toolStripStatusLabel1. Для кнопок типа Button и нескольких пунктов меню написать обработчики MouseHover и MouseLeave, где формируются и очищаются тексты подсказок в строке статуса.
77

Заключение
В пособии представлены материалы для начального знакомства со средой Microsoft Visual Studio, изучены основные конструкции языка C#, порядок разработки приложений консоль-
ного и оконного типа, базовые элементы управления для проектирования интерфейса.
В настоящее время существует необходимость в обработке большого количества информации и принятия решения на основе результатов вычислительного эксперимента, выполнение которого осуществляется посредством компьютера. Существующие универсальные системы позволяют решать ограниченный круг задач. В связи с этим требуются специализированные программы, позволяющие снять эти ограничения. Основными требованиями к
разрабатываемым специализированным программам являются: предоставление доступа к
просмотру и корректировке параметров расчётов, возможность обрабатывать большое количество информации, запуск на выполнение и контроль результатов, дружественный интерфейс. Такие программы требуют интенсивного вмешательства пользователя, т. е. доступ к
редактированию параметров, и, как следствие, при разработке программы используется
большое количество разнообразных элементов интерфейса.
Изложенный материал лабораторного практикума рассчитан на студентов, имеющих
минимальный опыт в программировании и владеющих компьютером на уровне начинающего пользователя. Материал ориентирован на студентов, обучающихся по направлениям:
01.03.02 «Прикладная математика и информатика», 09.03.02 «Информационные системы и
технологии», 09.03.01 «Информатика и вычислительная техника», а также может быть полезным для студентов других IT-специальностей и направлений.
Авторы надеются, что элементы языка C# и приемы программирования интерфейса, показанные в пособии, помогут студентам быстро освоить процесс создания приложений и перейти к
разработке собственных программ для решения учебных, научных и инженерных задач.
78

Список литературы
1. Рихтер Д. CLR via C#. Программирование на платформе Microsoft.NET Framework
4.5 на языке С# / Д. Рихтер. – Санкт-Петербург : Питер, 2017. – 896 с.
2. Троелсен Э. Язык программирования C# 6.0 и платформа .NET 4.6 / Э. Троелсен. –
Москва : Вильямс, 2016. – 1440 с.
3. Рыбалка С.А. C++ Builder. Задачи и решения : учебное пособие / С.А. Рыбалка,
Г.И. Шкатова. – Режим доступа: http://www.lib.tpu.ru/fulltext2/m/2011/m01.pdf.
4. Дёмин А.Ю. Информатика. Лабораторный практикум : учебное пособие для при-
кладного бакалавриата / А.Ю. Дёмин, В.А. Дорофеев. – Москва : Юрайт, 2016. – 132 с.
5. Немировский В.Б. Информатика : учебное пособие / В.Б. Немировский, А.К. Стоя-
нов. – Томск : Изд-во ТПУ, 2012. – 314 с.
79

Учебное издание
РЫБАЛКА Сергей Анатольевич
ТИТАРЕНКО Екатерина Юрьевна
ГЕРГЕТ Ольга Михайловна
ПРОГРАММИРОВАНИЕ НА ЯЗЫКЕ C#:
КОНСОЛЬНЫЕ И ОКОННЫЕ ПРИЛОЖЕНИЯ
Лабораторный практикум
Учебное пособие
Корректура Е.Л. Тен
Компьютерная верстка С.А. Рыбалка, Д.В. Сотникова
Дизайн обложки Т.В. Буланова
Подписано к печати 17.05.2021. Формат 60×84/8. Бумага «Снегурочка».
Печать CANON. Усл. печ. л. 9,31. Уч.-изд. л. 8,42.
Заказ 88-21. Тираж 100 экз.
Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]
