В этом руководстве по программированию на C # я сосредоточусь на расширенных элементах управления, таких как ComboBoxes, Grids и ListViews, и покажу вам, как вы, скорее всего, будете их использовать. Я не касаюсь данных и связывания до следующего урока. Давайте начнем с простого элемента управления, ComboBox.
В основе комбо лежит коллекция предметов, и самый простой способ заполнить это - перетащить комбо на экран, выбрать свойства (если вы не видите окна свойств, нажмите «Вид» в верхнем меню, а затем «Окно свойств»), найдите элементы и нажмите на эллипсы кнопка. Затем вы можете набрать строки, скомпилировать программу и потянуть комбо вниз, чтобы увидеть варианты.
Теперь остановите программу и добавьте еще несколько чисел: четыре, пять.. до десяти. При запуске вы увидите только 8, потому что это значение по умолчанию MaxDropDownItems. Не стесняйтесь, чтобы установить его на 20 или 3, а затем запустите его, чтобы посмотреть, что он делает.
Раздражает, что когда он открывается, он говорит comboBox1, и вы можете редактировать его. Это не то, что мы хотим. Найдите свойство DropDownStyle и измените DropDown на DropDownList. (Это комбо!). Теперь нет текста, и он не редактируется. Вы можете выбрать один из номеров, но он всегда открывается пустым. Как выбрать номер для начала? Ну, это не свойство, которое вы можете установить во время разработки, но добавление этой строки сделает это.
Добавьте эту строку в конструктор Form1 (). Вы должны просмотреть код формы (в обозревателе решений щелкните правой кнопкой мыши From1.cs и выберите View Code. Найти InitializeComponent (); и добавьте эту строку сразу после этого.
Если вы установите свойство DropDownStyle для комбо на Simple и запустите программу, вы ничего не получите. Он не будет выбирать или щелкнуть или ответить. Почему? Потому что во время разработки вы должны взять нижнюю ручку растяжения и сделать весь контроль выше.
В примере 2 я переименовал ComboBox в combo, изменил комбо DropDownStyle обратно на DropDown, чтобы его можно было редактировать, и добавил кнопку Add с именем btnAdd. Я дважды щелкнул кнопку добавления, чтобы создать обработчик события btnAdd_Click (), и добавил эту строку события.
Теперь, когда вы запустите программу, введите новый номер, скажем, одиннадцать и нажмите кнопку Добавить. Обработчик событий принимает текст, который вы ввели (в комбо. Текст) и добавляет его в коллекцию предметов Комбо. Нажмите на комбо, и теперь у нас есть новая запись Одиннадцать. Вот как вы добавляете новую строку в Combo. Удалить его немного сложнее, так как вам нужно найти индекс строки, которую вы хотите удалить, а затем удалить ее. Метод RemoveAt, показанный ниже, является методом сбора для этого. вам просто нужно указать, какой элемент в параметре Removeindex.
удалит строку в позиции RemoveIndex. Если в комбо есть n элементов, то допустимые значения от 0 до n-1. Для 10 позиций значения 0..9.
Если это не находит текст, он возвращает -1, в противном случае он возвращает индекс на основе 0 строки в комбинированном списке. Есть также перегруженный метод FindStringExact, который позволяет вам указать, откуда вы начинаете поиск, так что вы можете пропустить первый и т. Д., Если у вас есть дубликаты. Это может быть удобно для удаления дубликатов в списке.
Нажатие btnAddMany_Click () очищает текст от комбо, затем очищает содержимое коллекции Combo Items и вызывает комбо. AddRange (чтобы добавить строки из массива значений. После этого он устанавливает SelectedIndex комбо на 0. Это показывает первый элемент в комбо. Если вы делаете добавление или удаление элементов в ComboBox, то лучше отслеживать, какой элемент выбран. Установка SelectedIndex в -1 скрывает выбранные элементы.
Кнопка «Добавить лоты» очищает список и добавляет 10 000 номеров. Я добавил комбо. BeginUpdate () и combo, EndUpdate () вызывает цикл, чтобы предотвратить любое мерцание со стороны Windows, пытающейся обновить элемент управления. На моем трехлетнем ПК добавление 100 000 номеров в комбо занимает чуть более секунды.
Это удобный элемент управления для отображения табличных данных без сложности сетки. Вы можете отображать элементы в виде больших или маленьких значков, в виде списка значков в вертикальном списке или, что наиболее полезно, в виде списка элементов и подпунктов в сетке, и именно это мы и сделаем здесь.
После добавления ListView в форму щелкните свойство столбцов и добавьте 4 столбца. Это будут TownName, X, Y и Pop. Установите текст для каждого ColumnHeader. Если вы не видите заголовки в ListView (после того, как вы добавили все 4), установите для свойства ViewView ListView значение Details. Если вы просматриваете код для этого примера, перейдите туда, где написано «Код конструктора форм Windows», и разверните область, в которой вы видите код, который создает ListView. Полезно посмотреть, как работает система, и вы можете скопировать этот код и использовать его самостоятельно.
Вы можете установить ширину для каждого столбца вручную, наведя курсор на заголовок и перетащив его. Или вы можете сделать это в коде, видимом после расширения области конструктора форм. Вы должны увидеть такой код:
Для столбца заполненности изменения в коде отражаются в конструкторе и наоборот. Обратите внимание, что даже если для свойства Locked установлено значение true, это влияет только на конструктор, и во время выполнения вы можете изменять размеры столбцов.
ListViews также имеют ряд динамических свойств. Нажмите (Динамические свойства) и отметьте свойство, которое вы хотите. Когда вы устанавливаете свойство как динамическое, оно создает XML-файл .config и добавляет его в Solution Explorer.
Вносить изменения во время разработки - это одно, но нам действительно нужно это делать во время работы программы. ListView состоит из 0 или более элементов. Каждый элемент (ListViewItem) имеет свойство text и коллекцию SubItems. В первом столбце отображается текст элемента, в следующем столбце отображается SubItem [0] .text, затем SubItem [1] .text и т. Д.
Я добавил кнопку, чтобы добавить строку и поле для редактирования названия города. Введите любое имя в поле и нажмите Добавить строку. Это добавляет новую строку в ListView с названием города, помещенным в первый столбец и следующие три столбца. (Подэлементы [0..2]) заполняются случайными числами (преобразуются в строки) путем добавления этих строк в их.
Теперь установите для свойства ListView Multiselect значение false. Мы хотим выбрать только один элемент за раз, хотя, если вы хотите удалить больше за один раз, это похоже на то, за исключением того, что вы должны перебирать в обратном порядке. (Если вы выполняете цикл в обычном порядке и удаляете элементы, то последующие элементы не синхронизируются с выбранными индексами).
Меню правой кнопки мыши еще не работает, так как у нас нет пунктов меню для отображения на нем. Поэтому щелкните правой кнопкой мыши PopupMenu (под формой), и вы увидите контекстное меню в верхней части формы, где появляется обычный редактор меню. Щелкните по нему и там, где написано «Введите здесь», введите «Удалить элемент». Окно свойств покажет MenuItem, поэтому переименуйте его в mniRemove. Дважды щелкните этот пункт меню, и вы должны получить функцию кода обработчика события menuItem1_Click. Добавьте этот код, чтобы он выглядел следующим образом.
Если вы упустили из виду удаление элемента, просто щелкните элемент управления PopupMenu самостоятельно в форме в конструкторе форм. Это вернет это в поле зрения.
Однако, если вы запустите его и не добавите элемент и не выделите его, при щелчке правой кнопкой мыши по меню и выборе пункта «Удалить элемент» будет выдано исключение, поскольку выбранный элемент отсутствует. Это плохое программирование, поэтому вот как это исправить. Дважды щелкните всплывающее событие и добавьте эту строку кода.
DataGridView - это и самый сложный, и самый полезный компонент, предоставляемый бесплатно с C #. Он работает как с источниками данных (то есть данными из базы данных), так и без них (т.е. данными, которые вы добавляете программно). В оставшейся части этого урока я покажу, как использовать его без источников данных. Для более простого отображения вам может пригодиться простой ListView.
Если вы использовали более старый элемент управления DataGrid, то это только один из стероидов: он дает вам больше встроенных типов столбцов, может работать с внутренние, а также внешние данные, больше настроек отображения (и событий) и дает больший контроль над обработкой ячеек с помощью замораживания строк и колонны.
Когда вы проектируете формы с данными сетки, чаще всего указываются разные типы столбцов. У вас могут быть флажки в одном столбце, текст для чтения или редактируемый текст в другом, а также номера курсов. Эти типы столбцов также обычно выровнены по-разному с числами, обычно выровненными по правому краю, так что десятичные точки выстраиваются в линию. На уровне столбца вы можете выбрать из кнопки, флажок, ComboBox, изображение, TextBox и ссылки. если этого недостаточно, вы можете определить свои собственные типы.
Самый простой способ добавить столбцы - это проектирование в IDE. Как мы видели ранее, это просто пишет код для вас, и когда вы сделали это несколько раз, вы можете добавить код самостоятельно. Когда вы сделаете это несколько раз, вы получите представление о том, как сделать это программно.
Давайте начнем с добавления нескольких столбцов, перетащите DataGridView на форму и нажмите маленькую стрелку в верхнем правом углу. Затем нажмите Добавить столбец. Сделайте это три раза. Появится диалоговое окно «Добавить столбец», в котором вы задаете имя столбца, текст для отображения в верхней части столбца и позволяете выбрать его тип. Первый столбец - YourName, и это TextBox по умолчанию (dataGridViewTextBoxColumn). Установите текст заголовка на ваше имя. Сделайте второй столбец Age и используйте ComboBox. Третий столбец Разрешен и является столбцом CheckBox.
После добавления всех трех вы должны увидеть строку из трех столбцов с комбо в середине (возраст) и флажок в столбце «Разрешено». Если вы щелкнете по DataGridView, то в инспекторе свойств вы должны найти столбцы и щелкнуть (коллекция). Появится диалоговое окно, в котором вы можете установить свойства для каждого столбца, такие как отдельные цвета ячеек, текст всплывающей подсказки, ширина, минимальная ширина и т. Д. Если вы скомпилируете и запустите, вы заметите, что можете изменить ширину столбцов и время выполнения. В инспекторе свойств для основного DataGridView вы можете установить AllowUser для resizeColumns в false, чтобы предотвратить это.
Мы собираемся добавить строки в элемент управления DataGridView в коде, и ex3.cs в файле примеров содержит этот код. Начнем с добавления поля TextEdit, ComboBox и кнопки в форму с DataGridView на нем. Установите для свойства DataGridView AllowUserto AddRows значение false. Я также использую метки и называю их списком cbAges, кнопкой btnAddRow и TextBox tbName. Я также добавил кнопку «Закрыть» для формы и дважды щелкнул ее, чтобы сгенерировать скелет обработчика событий btnClose_Click. Добавление слова Close () делает эту работу.
По умолчанию свойство кнопки «Добавить строку» включено при запуске. Мы не хотим добавлять какие-либо строки в DataGridView, если в поле Name TextEdit и в ComboBox нет текста. Я создал метод CheckAddButton, а затем сгенерировал обработчик события Leave для поля ввода «Текст имени», дважды щелкнув рядом со словом «Оставить» в свойствах, когда он отображал события. Окно свойств показывает это на рисунке выше. По умолчанию в окне «Свойства» отображаются свойства, но вы можете увидеть обработчики событий, нажав кнопку с молнией.
Вы могли бы использовать вместо этого событие TextChanged, хотя это вызовет CheckAddButton () метод для каждого нажатия клавиши, а не когда управление прекращается, т.е. когда другой элемент управления получает фокус. В Ages Combo я использовал событие TextChanged, но выбрал обработчик события tbName_Leave вместо двойного щелчка, чтобы создать новый обработчик события.
Не все события совместимы, потому что некоторые события предоставляют дополнительные параметры, но если вы видите ранее сгенерированный обработчик, тогда да, вы можете использовать его. Это в основном вопрос предпочтений, вы можете иметь отдельный обработчик событий для каждого элемента управления, который вы использовать или совместно использовать обработчики событий (как я сделал), когда они имеют общую сигнатуру события, то есть параметры являются одна и та же.
Для краткости я переименовал компонент DataGridView в dGView и дважды щелкнул AddRow, чтобы сгенерировать скелет обработчика событий. Этот код ниже добавляет новую пустую строку, получает индекс этих строк (это RowCount-1, поскольку он был только что добавлен, а RowCount равен 0 на основе), а затем обращается к этой строке через свой индекс и устанавливает значения в ячейках этой строки для столбцов YourName и Возраст.
При разработке формы вам следует подумать о контейнерах и элементах управления, а также о том, какие группы элементов управления следует хранить вместе. В любом случае, в западных культурах люди читают от верхнего левого до нижнего правого угла, поэтому так легче читать.
Контейнер - это любой элемент управления, который может содержать другие элементы управления. Среди найденных в панели инструментов: Panel, FlowLayoutpanel, SplitContainer, TabControl и TableLayoutPanel. Если вы не видите панель инструментов, используйте меню «Вид», и вы найдете его. Контейнеры удерживают элементы управления вместе, и если вы переместите или измените размер контейнера, это повлияет на расположение элементов управления. Просто переместите элементы управления над контейнером в конструкторе форм, и он узнает, что контейнер теперь отвечает.
Панель похожа на GroupBox, но GroupBox не может прокручиваться, но может отображать заголовок и по умолчанию имеет рамку. Панели могут иметь границы, но по умолчанию их нет. Я использую GroupBoxes, потому что они выглядят лучше, и это важно, потому что:
Панели также удобны для группировки контейнеров, поэтому на панели может быть два или более групповых ящика.
Вот совет для работы с контейнерами. Поместите разделенный контейнер в форму. Нажмите на левую панель, затем на правую. Теперь попробуйте удалить SplitContainer из формы. Это сложно, пока вы не щелкнете правой кнопкой мыши на одной из панелей и затем не нажмете кнопку «Выбрать SplitContainer1». Как только все это выбрано, вы можете удалить его. Еще один способ, который применяется ко всем элементам управления и контейнерам нажмите клавишу Esc выбрать родителя.
Контейнеры также могут быть вложены друг в друга. Просто перетащите маленькую вершину на большую, и вы увидите, что на короткое время появляется тонкая вертикальная линия, показывающая, что одна находится внутри другой. Когда вы перетаскиваете родительский контейнер, ребенок перемещается вместе с ним. Пример 5 показывает это. По умолчанию светло-коричневая панель не находится внутри контейнера, поэтому, когда вы нажимаете кнопку перемещения, групповой блок перемещается, а панель - нет. Теперь перетащите панель на GroupBox, чтобы она полностью оказалась внутри Groupbox. Когда вы скомпилируете и запустите на этот раз, нажатие кнопки Move переместит оба вместе.
TableLayoutpanel - интересный контейнер. Это структура таблицы, организованная как двумерная сетка ячеек, где каждая ячейка содержит только один элемент управления. Вы не можете иметь более одного элемента управления в ячейке. Вы можете указать, как будет расти таблица, когда добавляется больше элементов управления или даже если она не увеличивается. Кажется, что она смоделирована для таблицы HTML, поскольку ячейки могут занимать столбцы или строки. Даже поведение привязки дочерних элементов управления в контейнере зависит от параметров Margin и Padding. Подробнее о якорях мы увидим на следующей странице.
В примере Ex6.cs я начал с базовой таблицы из двух столбцов и задал ее в диалоговом окне «Стили элементов управления и строк» (выберите элемент управления и щелкните маленький вправо-треугольник, расположенный в правом верхнем углу, чтобы увидеть список задач и нажать на последнюю), что левый столбец составляет 40%, а правый столбец 60% от ширина. Он позволяет вам указывать ширину столбца в абсолютных пиксельных терминах, в процентах, или вы можете просто разрешить его автоматическое изменение размера. Чтобы быстрее добраться до этого диалогового окна, просто щелкните «Коллекция» рядом со столбцами в окне «Свойства».
Я добавил кнопку AddRow и оставил свойству GrowStyle значение по умолчанию AddRows. Когда таблица заполняется, она добавляет еще одну строку. В качестве альтернативы вы можете установить его значения в AddColumns и FixedSize, чтобы он больше не рос. В Ex6, когда вы нажимаете кнопку Add Controls, он вызывает метод AddLabel () три раза и AddCheckBox () один раз. Каждый метод создает экземпляр элемента управления и затем вызывает tblPanel. Органы управления. Add () После добавления 2-го элемента управления третий элемент управления вызывает рост таблицы. На рисунке это показано после того, как кнопка «Добавить управление» была нажата один раз.
В случае, если вам интересно, откуда взяты значения по умолчанию в методах AddCheckbox () и AddLabel (), которые я вызываю, элемент управления был изначально вручную добавлен в таблицу в конструкторе, а затем код для его создания и инициализации был скопирован из этого область. Вы найдете код инициализации в вызове метода InitializeComponent, как только вы нажмете + слева от области ниже:
Вы можете выбрать несколько элементов управления одновременно, удерживая клавишу Shift при выборе второго и последующих элементов управления, даже элементов управления разных типов. В окне «Свойства» отображаются только те свойства, которые являются общими для обоих, поэтому вы можете установить для них одинаковый размер, цвет, текстовые поля и т. Д. Даже одни и те же обработчики событий могут быть назначены нескольким элементам управления.
В зависимости от использования, некоторые формы часто изменяются пользователем. Ничто не выглядит хуже, чем изменение размера формы и видимость элементов управления в одном и том же положении. Все элементы управления имеют привязки, которые позволяют вам «прикрепить» их к 4 ребрам, чтобы элемент управления перемещался или растягивался при перемещении присоединенного края. Это приводит к следующему поведению, когда форма вытянута от правого края:
Для кнопок типа «Закрыть», которые традиционно находятся внизу справа, необходимо поведение 3. ListViews и DataGridViews лучше всего использовать с 2, если количество столбцов достаточно для переполнения формы и требует прокрутки). Верхний и левый якоря используются по умолчанию. Окно свойств включает в себя небольшой редактор, который выглядит как флаг Англии. Просто нажмите на любую из полос (две горизонтальные и две вертикальные), чтобы установить или очистить соответствующую привязку, как показано на рисунке выше.
Одно свойство, которое не получает большого упоминания, это свойство Tag, и все же оно может быть невероятно полезным. В окне свойств вы можете только назначить текст, но в вашем коде вы можете иметь любое значение, которое происходит от объекта.
Я использовал Tag для хранения всего объекта, показывая только несколько его свойств в ListView. Например, вы можете указать имя и номер клиента только в списке клиентов. Но щелкните правой кнопкой мыши на выбранном клиенте, а затем откройте форму со всеми данными клиента. Это легко сделать, если вы создаете список клиентов, читая все данные клиента в памяти и назначая ссылку на объект класса клиента в теге. Все элементы управления имеют тег.
TabControl - это удобный способ сохранить пространство формы, используя несколько вкладок. Каждая вкладка может иметь значок или текст, и вы можете выбрать любую вкладку и отобразить ее элементы управления. TabControl - это контейнер, но он содержит только TabPages. Каждая вкладка также является контейнером, к которому можно добавить обычные элементы управления.
В примере x7.cs я создал панель с двумя вкладками, первая вкладка «Элементы управления» имеет три кнопки и флажок. Вторая вкладка помечена как «Журналы» и используется для отображения всех зарегистрированных действий, включая нажатие кнопки или переключение флажка. Метод Log () вызывается для регистрации каждого нажатия кнопки и т. Д. Добавляет предоставленную строку в ListBox.
Я также добавил два обычных всплывающих меню в TabControl обычным способом. Сначала добавьте ContextMenuStrip в форму и установите его в свойстве ContextStripMenu объекта TabControl. Два варианта меню: Добавить новую страницу и Удалить эту страницу. Однако я ограничил удаление страницы, поэтому можно удалить только новые добавленные вкладки, а не две оригинальные.
Это просто, просто создайте новую вкладку, присвойте ей текстовую подпись для вкладки и добавьте ее в коллекцию TabPages в Tabs TabControl
Удаление страницы - это просто вызов TabPages. RemoveAt (), используя вкладки. SelectedIndex, чтобы получить текущую выбранную вкладку.
В этом уроке мы увидели, как работают некоторые из более сложных элементов управления и как их использовать. В следующем уроке я продолжу тему GUI, посмотрю на фоновый рабочий поток и покажу, как его использовать.