как сделать меню в visual studio c
BestProg
Пример создания меню в C#. Элемент управления menuStrip
Содержание
Поиск на других ресурсах:
Условие задачи
Рис. 1. Меню, которое нужно создать
Выполнение
1. Запустить Microsoft Visual Studio. Создать проект по шаблону Windows Forms Application
Сохранить проект под произвольным именем.
2. Элемент управления MenuStrip
Рис. 2. Элемент управления MenuStrip
Рис. 3. Форма приложения после размещения компонента MenuStrip
Рис. 4. Типы элементов меню
Рис. 5. Создание подменю File
После создания всех элементов меню, форма приложения примет вид, как показано на рисунке 6.
Рис. 6. Форма приложения после создания меню
Следующими шагами есть программирование событий, связанных с выбором конкретного элемента меню.
Необходимые знания:
Целью данной части главы будет закрепление навыков работы с оконными приложениями. Мы рассмотрим на примере, как создаются элементы меню, панели инструментов, увидим, как создаются и вызываются дополнительные диалоговые окна, как работать с окнами выбора файлов. Также мы познакомимся еще с несколькими элементами управления и научимся динамически загружать изображения в форму.
Дайте название подэлементу меню File “Выход”, как показано на рисунке 4. После этого назовите еще один раздел меню – «загрузить». В меню загрузить добавьте подэлемент «загрузить изображение» и в раскрывающемся меню назначьте ему 2 подэлемента: «В формате JPG» и «В формате PNG». Выглядеть меню будет следующим образом (рис. 4):
Рисунок 4. Заполнение разделов создаваемого меню.
Теперь рассмотрим то, как просто добавить обработчик события меню. Для этого перейдите к меню «Выход». Теперь сделайте двойной щелчок левой клавишей мыши – MS Visual Studio автоматически создаст код функции обработчика и настроит событие обработки.
Перед нами откроется код функции обработчика:
Так как этот элемент меню отвечает за выход из приложения, добавим в него код, который будет генерировать MessageBox с вопросом о подтверждении выхода из приложения. Если пользователь подтвердит выход – приложение будет завершено.
Новый код функции с комментариями:
Теперь можно откомпилировать приложение и проверить работоспособность кнопки.
Часто панель управления (Toolbar) дублирует элементы меню для быстрого к ним доступа.
Таким образом, на панели разместятся 3 кнопки, как показано на рисунке 10.
Рисунок 10. Пример добавленных кнопок с установленными размерами.
Теперь назначим изображения для данных картинок. В качестве изображений можно использовать все современные форматы, в том числе и png24 с поддержкой прозрачности.
Мы будем использовать 3 следующих изображения:
Изображение для кнопки 1: будет назначено кнопке, отвечающей за открытие дополнительного диалогового окна.
Два следующих изображения будут назначены кнопкам, которые будут отвечать за загрузку файлов jpg и png.
Изображение для кнопки 2.
Изображение для кнопки 3.
(. ) Обратите внимание, что у данных изображений прозрачный фон.
2 кнопки будут дублировать меню с функциями загрузки изображений, 1-я кнопка будет предназначена для вызова окна, с отображением картинки, которую мы загрузили.
Теперь для установки изображений необходимо перейти в свойства картинки, после чего мы установим значение параметра ImageScaling равным none, чтобы изображение не масштабировалось. Теперь в параметре Image мы можем выбрать изображение для загрузки, как показано на рисунке 11.
Рисунок 11. Установка изображений на кнопки.
В процессе выбора откроется окно, показанное на рисунке 12.
Рисунок 12. Импорт рисунка для установки на кнопке.
Теперь щелкните на кнопке Import и выберите необходимый рисунок. Аналогично повторите с другими рисунками. В результате вы получите 3 красивые кнопки, как показано на рисунке 13.
Рисунок 13. Пример созданной панели инструментов.
Для того чтобы создать обработчики нажатий на кнопки этого ToolBox‘а, достаточно совершить двойной щелчок мыши на каждом из них – MS Visual Studio автоматически сгенерирует код обработчик события и заготовки функций.
В будущем мы добавим вызов необходимых нам функций из этого обработчика.
Теперь мы разместим на форме элемент PictureBox и настроим размеры окна, чтобы оно выглядело следующем образом (рис. 14).
Рисунок 14. Расположение элемента PictureBox в окне программы.
В свойствах добавленного элемента PictureBox установите параметр SizeMode, равный StretchImage. Теперь, когда мы реализуем загрузку изображения, оно будет масштабироваться под размеры нашего элемента PictureBox.
Чтобы пользователь мог выбирать файл для загрузки через стандартное в Windows окно загрузки файлов, мы выполним следующие действия.
Перейдите к окну ToolBox (Панель элементов).
Теперь перетащите элемент управления OpenFileDialog (рис. 15) на форму.
Рисунок 15. Добавление элемента OpenFileDialog.
Местоположение, куда вы перетащите элемент, неважно: он добавится в поле под окном, к другим специфическим объектам (рис. 16).
Рисунок 16. Элемент OpenFileDialog, расположенный под редактируемой формой.
Как видно из рисунка 16, к дополнительным элементам, уже установленным на наше окно (меню и ToolBox), добавился еще и элемент OpenFileDialog1.
Теперь мы реализуем код открытия окна выбора файла, с необходимыми нам параметрами.
Если вы еще не создали обработчики нажатия на кнопки загрузки и элементы меню, так же предназначенные для загрузки, сделайте это с помощью двойных щелчков по ним.
Код сгенерированных функций выглядит следующим образом:
Теперь напишем следующую функцию LoadImage.
Функция LoadImage в качестве входного параметра будет получать флаг о том, какой фильтр для выбора файлов необходимо выбрать. Далее вызывается окно выбора файла и если оно при закрытии возвращает результат DialogResult.OK, то мы пытаемся загрузить и установить выбранную картинку в поле PictureBox. Конструкция try catch необходима нам здесь по следующей причине: если загрузка прошла неудачно, то мы получим сообщение об ошибке, но на выполнение программы это не повлияет, и мы сможем продолжить ее выполнение.
Далее функции обработчики нажатий пунктов меню и кнопок на панели управления реализуют вызов функции загрузки с необходимым флагом.
Теперь, если откомпилировать приложение (F5), то можно попробовать загрузить изображение. Обратите внимание, что загрузка png24 с альфа-каналом тоже работает (рис. 17).
Рисунок 17. Пример загруженного изображения.
Как видите, наше изображение масштабируется под размер элемента PictureBox. Поэтому сейчас мы добавим в проект еще одну форму, на которой мы будем отображать изображение в его истинном размере.
Добавление и вызов дополнительного диалогового окна
Для этого перейдите к окну Solution Explorer (Обозреватель решений), после чего щелкните на названии проекта правой кнопкой мыши и в открывшемся контекстном меню выберите Add->Form, как показано на рисунке 18.
Рисунок 18. Добавление в проект нового диалогового окна.
В открывшемся окне введите названия класса, который будет отвечать за генерацию нашего вспомогательного окна – Preview.cs (рис. 19).
Рисунок 19. Установка названия создаваемой формы для нового диалогового окна.
Теперь измените размер окна так, как показано на рисунке 20. Затем на форме разместите элемент panel. Внутри элемента panel разместите элемент pictureBox, как показано на рисунке 20.
Рисунок 20. Размещение элементов panel и picturebox на созданном диалоговом окне.
Данное окно будет получать при загрузке в качестве параметра ссылку на наше загруженное изображение. Затем оно будет устанавливать границы элемента pictureBox равными размерам полученного изображения, после чего устанавливать его в элемент pictureBox.
Перейдите к свойствам элемента panel и установите значение параметра AutoScroll равное true. Теперь, в том случае, если размер изображения будет превышать размер элемента panel1, будут появляться вертикальная и горизонтальная полоса прокрутки, с помощью которых можно будет просмотреть изображение.
Теперь рассмотрим исходный код, необходимый для реализации данных возможностей.
Первым делом назначим обработчик кнопки с изображением стрелки направленной вправо на нашем главном окне. Щелкните по ней дважды, после чего вы перейдете к редактированию кода функции, которая будет вызвана при щелчке по данной кнопке.
Он будет выглядеть следующим образом:
Как видно из исходного кода, класс Preview получает в качестве параметра наше загруженное изображение. Для правильной работы программы мы должны изменить конструктор класса Preview, а также реализовать остальную функциональность программы.
Перейдите к окну Preview, после чего сделайте двойной щелчок левой клавшей мыши на нем (НЕ на размещенных на нем объектах).
Откроется для редактирования функция:
Но мы сначала изменим код конструктора класса, теперь он будет выглядеть следующим образом:
Теперь отредактируем код функции Preview_Load. Он будет выглядеть следующим образом:
В заключении, самостоятельно добавьте обработчик нажатия кнопки закрыть. Функция закрытия будет выглядеть следующим образом:
Вот и все. Теперь, если будет загружено большое изображение, его отображение в дополнительном окне будет снабжено полосами прокрутки (рис. 21).
Рисунок 21. Изображение с полосами прокрутки.
Откомпилируйте приложение (F5), чтобы проверить его.
В следующей главе мы познакомимся с методами создания многопоточных приложений на примере разработки двух приложений.