Разработка пользовательского интерфейса
Принципы разработки интерфейсов:
– Стандартизация;
– Удобство и простота работы;
– Внешний дизайн;
– Неперегруженность форм;
– Группировка;
– Разреженность объектов форм.
Типы интерфейсов
Типы интерфейсов:
– однодокументный SDl (Single-Document Interface);
– многодокументный MDI (Multiple-Document Interface);
– интерфейс типа Проводник (Explorer).
Однодокументный интерфейс (SDI)
Рис.12.1. Пример интерфейса типа SDI
Многодокументный интерфейс (MDI)
Рис.12.2. Пример интерфейса типа MDI
Интерфейс типа проводник
Рис.12.3. Интерфейс типа Проводник (Explorer)
Элементы пользовательского интерфейса
Меню
Элементы управления для создания Главного меню формы: MainMenu и MenuStrip.
Элемент управления MenuStrip может содержать элементы: ToolStripMenuItem, ToolStripComboBox, ToolStripSeparator и ToolStripTextBox.
Рис.12.4. Главное меню
Items Collection Editor – встроенный редактор меню.
Пример использования префиксов mnu и имен, отражающих структуру меню:
File mnuFile
File/Open mnuFileOpen
File/Close mnuFileClose
Edit mnuEdit
Edit/Insert mnuEditInsert
Элементы управления для создания Контекстного меню объекта формы: ContextMenu и ContextMenuStrip.
Элемент управления ContextMenuStrip может содержать элементы: ToolStripMenuItem, ToolStripComboBox, ToolStripSeparator и ToolStripTextBox.
Панели инструментов
Элементы управления для создания Панели инструментов формы: ToolBar и ToolStrip.
Элемент управления ToolStrip может содержать элементы: ToolStripButton, ToolStripComboBox, ToolStripSplitButton, ToolStripLabel, ToolStripSeparator, ToolStripDropDownButton, ToolStripTextBox и ToolStripProgressBar.
Рис.12.5. Панель инструментов
Строка состояния
Элементы управления для создания Строки состояния формы: StatusBar и StatusStrip.
Элемент управления StatusStrip может содержать элементы: ToolStripSplitButton, ToolStripLabel, ToolStripDropDownButton, ToolStripStatusLabel и ToolStripProgressBar.
Рис.12.6. Строка состояния
Диалоговые окна
Стандартные диалоговые окна: FileDialog, ColorDialog, FontDialog, PageSetupDialog и PrintDialog. Все эти классы являются производными от абстрактного класса System.Windows.Forms.CommonDialog.
Класс FileDialog.
Абстрактный класс FileDialog, является базовым для двух специализированных подклассов: OpenFileDialog и SaveFileDialog.
Таблица 12.1. Метод и свойства класса OpenFileDialog
| Метод или свойства | Описание |
| ShowDialog | Выводит диалоговое окно |
| MultiSelect | Определяет, можно ли в диалоговом окне выделить несколько файлов |
| ShowReadOnly | Определяет, будет ли в диалоговом окне отображаться флажок "только для чтения" |
| ReadOnlyCheked | Определяет, установлен ли в диалоговом окне флажок "только для чтения" |
| Filter | Определяет, какие типы файлов будут отображаться в поле "Тип файлов:" |
| FilterIndex | Определяет фильтр, выбранный в диалоговом окне |
Таблица 12.2. Метод и свойства класса SaveFileDialog
| Метод или свойства | Описание |
| ShowDialog | Выводит диалоговое окно |
| CheckFileList | Определяет, существует ли файл, выделенный пользователем |
| FileName | Устанавливает в диалоговом окне имя файла, выбранного пользователем |
| Filter | Определяет, какие типы файлов будут отображаться в поле "Тип файлов:" |
| FilterIndex | Определяет фильтр, выбранный в диалоговом окне |
Класс ColorDialog.
Таблица 12.3. Метод и свойства класса ColorDialog
| Метод или свойство | Описание |
| ShowDialog | Выводит диалоговое окно |
| Color | Определяет цвет, выбранный пользователем |
| AllowFullOpen | Определяет, может ли пользователь добавлять в диалоговое окно свои цвета |
| SolidColorOnly | Определяет, может ли пользователь применять цветовой спектр (размытые цвета) |
Класс FontDialog.
Таблица 12.4. Метод и свойства класса FontDialog
| Метод или свойство | Описание |
| ShowDialog | Выводит диалоговое окно |
| Color | Определяет цвет шрифта, выбранный пользователем |
| Font | Определяет шрифт, его начертание, размер и эффекты |
Класс PageSetupDialog.
Таблица 12.5. Метод и свойства класса PageSetupDialog
| Метод или свойство | Описание |
| ShowDialog | Выводит диалоговое окно |
| Alloy/Margins | Определяет, можно ли выбирать размер полей |
| AllowOrientation | Определяет, можно ли выбирать ориентацию страницы |
| AllowPaper | Определяет, можно ли выбирать размер бумаги |
| Document | Определяет документ, для которого выбираются свойства страницы. Класс PrintDocument указывает документ, который будет отправлен на печать |
Класс PrintDiaiog.
Таблица 12.6. Метод и свойства класса PrintDialog
| Метод или свойство | Описание |
| ShowDialog | Выводит диалоговое окно |
| AllowPrintToFile | Определяет, установлен ли флажок "Print to File" |
| AllowSelection | Определяет, доступна ли кнопка выбора "From... To... Page" |
| AllowSomePages | Определяет, доступна ли кнопка выбора "Pages" |
Кроме указанных Visual Studio предусматривает и другие диалоговые окна:
FolderBrowserDialog – отображает окно для просмотра и выбора директорий или создания новых;
PrintPreviewDialog – отображает документ в режиме предварительного просмотра (перед печатью).
Использование стандартных элементов управления
Таблица 12.7. Элементы управления с панели Toolbox
| Название инструмента | Выполняемое им действие |
| Common Controls | |
| Label (Надпись) | Создает в окне формы надпись |
| LinkLabel (Ссылка) | Создает в окне формы гиперссылку |
| Button (Кнопка) | Создает прямоугольную кнопку |
| TextBox (Текстовое поле) | Создает поле, в котором пользователь может набирать текст |
| ListBox (Список) | Создает список |
| ComboBox (Раскрывающийся список) | Создает раскрывающийся список (поле со списком) |
| CheckBox (Флажок проверки) | Создает флажок |
| RadioButton (Переключатель) | Создает переключатель |
| ListView (Список объектов) | Создает список объектов |
| TreeView (Дерево) | Создает иерархический список, элементы которого имеют древовидную структуру |
| CheckedListBox (Список с флажками) | Создает список элементов, рядом с которыми (слева) находятся флажки |
| NumericUpDown | Создает комбинацию текстового поля и пары кнопок со стрелками для изменения числового значения |
| ProgressBar (Индикатор процесса) | Создает индикатор процесса для отображения хода выполнения длительных операций |
| RichTextBox | Создает текстовое поле с расширенными возможностями отображения и форматирования |
| MaskedTextBox (Текстовое поле с маской) | Создает текстовое поле с задаваемой маской для пользовательского ввода |
| PictureBox (Поле с рисунком) | Создает поле для отображения рисунков |
| DateTimePicker | Вызов окна выбора даты и времени и их просмотра в заданном формате |
| MonthCalendar | Вызов окна выбора даты из календаря на месяц |
| ToolTip (Всплывающая подсказка) | Отображение подсказки после задержки курсора мыши над каким-либо элементом управления |
| NotifyIcon | Создает значок на панели задач для отображения хода длительного процесса |
| WebBrowser (Web-браузер) | Отображение Web-страницы на форме пользователя |
| Containers | |
| GroupBox (Рамка) | Создает на форме рамку для группирования нескольких объектов |
| Panel (Панель) | Рисует прямоугольный блок, на котором могут размещаться другие объекты |
| TabControl (Вкладки) | Создание нескольких вкладок на форме для размещения других объектов |
| Data | |
| DataGridView (Таблица данных) | Создает таблицу для отображения информации из файла базы данных |
Таблица 12.8. Рекомендуемые префиксы для имен наиболее распространенных объектов
| Объект | Префикс | Объект | Префикс | Объект | Префикс | ||
| Button | btn | CheckedListBox | Panel | pnl | |||
| CheckBox | chk | ContextMenuStrip | ProgressBar | ||||
| ComboBox | cmb | DateTimePicker | RichTextBox | ||||
| DataGrid | dat | DataGridView | Splitter | ||||
| Form | frm | GroupBox | grp | StatusStrip | |||
| Label | lbl | HScrollBar | TabControl | tab | |||
| ListBox | lst | ImageList | img | Timer | tmr | ||
| MenuStrip | mnu | LinkLabel | lnk | ToolStrip | |||
| PictureBox | pic | ListView | ToolTip | ||||
| RadioButton | rad | MaskedTextBox | TrackBar | ||||
| TextВox | txt | MonthCalendar | TreeView | ||||
| NotifyIcon | VScrollBar | ||||||
| NumericUpDown | WebBrowser |