Пример. Создание составного элемента управления с помощью C#

Статья
08/11/2011

Составные элементы управления являются тем средством, с помощью которого можно создавать и многократно использовать пользовательские графические интерфейсы. Составной элемент управления — это компонент, имеющий визуальное представление. Он может состоять из одного или нескольких элементов управления форм Windows Forms, компонентов или блоков кода, позволяющих расширить функциональные возможности (например, проверять допустимость вводимых пользователем данных, изменять свойства отображения или выполнять другие действия, необходимые разработчику). Составные элементы управления можно поместить в формы Windows Forms точно так же, как и другие элементы управления. В первой части пошагового руководства будет создан простой составной элемент управления ctlClock. Во второй части пошагового руководства функциональные возможности элемента ctlClock будут расширены с помощью наследования.

Примечание

Отображаемые диалоговые окна и команды меню могут отличаться от описанных в справке в зависимости от текущих настроек или выпуска.Чтобы изменить параметры, выберите в меню Сервис пункт Импорт и экспорт параметров.Дополнительные сведения см. в разделе Работа с параметрами.

Создание проекта

При создании нового проекта следует задать его имя, чтобы были установлены корневое пространство имен, имя сборки и имя проекта, а компонент, создаваемый по умолчанию, был помещен в нужное пространство имен.

Чтобы создать библиотеку элементов управления ctlClockLib и элемент управления ctlClock

В меню Файл выберите Создать и выберите пункт Проект, чтобы открыть диалоговое окно Новый проект.
Из списка проектов Visual C# выберите шаблон проекта Библиотека элементов управления Windows Forms и в поле Имя введите ctlClockLib, затем нажмите кнопку OK.

Имя проекта (ctlClockLib) также назначается по умолчанию корневому пространству имен. Для определения имен компонентов в сборке используется корневое пространство имен. Например, если в двух сборках содержатся компоненты с именем ctlClock, то можно указать свой компонент ctlClock, используя имя ctlClockLib.ctlClock. .
В обозревателе решений щелкните правой кнопкой мыши файл UserControl1.cs и затем нажмите Переименовать. Измените имя файла на ctlClock.cs. Нажмите кнопку Да, чтобы переименовать все ссылки на элемент кода UserControl1.

Примечание

По умолчанию составной компонент является наследником класса UserControl, предоставляемого системой.Класс UserControl обеспечивает функциональность, необходимую всем составным элементам управления, и реализует стандартные методы и свойства.
В меню Файл выберите команду Сохранить все для сохранения проекта.

Добавление элементов управления и компонентов Windows в составной элемент управления

Визуальный интерфейс — это важная часть составного элемента управления. Он создается путем добавления одного или нескольких элементов управления Windows на поверхность конструктора. В приведенном ниже примере будет показано, как добавлять элементы управления Windows в составной элемент управления и реализовывать необходимые функциональные возможности с помощью написания кода.

Чтобы добавить элементы управления Label и Timer в составной элемент управления

В обозревателе решений щелкните правой кнопкой мыши элемент ctlClock.cs и выберите пункт Конструктор представлений.
На панели элементов разверните узел Общие элементы управления и дважды щелкните элемент Надпись.

Элемент управления Label с именем label1 будет добавлен в созданный элемент управления на поверхности конструктора.
Выберите в конструкторе элемент label1. В окне свойств задайте значения для следующих свойств.

Свойство

Значение

Name

lblDisplay

Text

(пробел)

TextAlign

MiddleCenter

Font.Size

14
На панели элементов разверните узел Компоненты и дважды щелкните элемент Таймер.

Поскольку Timer является компонентом, он не имеет визуального представления во время выполнения. Поэтому он отображается не с элементами управления на поверхности конструктора, а в Конструкторе компонентов (область в нижней части поверхности конструктора).
В Конструкторе компонентов щелкните компонент timer1 и установите значение свойства Interval равным 1000, а значение свойства Enabled равным true.

Свойство Interval управляет частотой тиканья компонента Timer. Каждый раз, когда компонент timer1 тикает, выполняется код события timer1_Tick. Значение этого свойства — это количество миллисекунд между событиями Tick.
В Конструкторе компонентов дважды щелкните компонент timer1, чтобы перейти к событию timer1_Tick компонента ctlClock.
Измените код, как указано ниже. Обязательно измените модификатор доступа с private на protected.

[C#]
```
protected void timer1_Tick(object sender, System.EventArgs e)
{
    // Causes the label to display the current time.
    lblDisplay.Text = DateTime.Now.ToLongTimeString(); 
}
```
Этот код позволяет отобразить текущее время в элементе управления lblDisplay. Поскольку интервал для компонента timer1 был задан как 1000, эти события возникают через каждую тысячу миллисекунд, то есть текущее время обновляется каждую секунду.
Измените этот метод, указав ключевое слово virtual, чтобы сделать его доступным для переопределения. Дополнительные сведения см. ниже в разделе "Наследование из пользовательского элемента управления".
```
protected virtual void timer1_Tick(object sender, System.EventArgs e)
```
В меню Файл выберите команду Сохранить все для сохранения проекта.

Свойство	Значение
Name	lblDisplay
Text	(пробел)
TextAlign	MiddleCenter
Font.Size	14

Добавление свойств в составной элемент управления

Созданный элемент управления часы теперь инкапсулирует элемент управления Label и компонент Timer, каждый из которых имеет собственный набор наследуемых свойств. Хотя свойства этих элементов управления не будут доступны пользователям создаваемого элемента управления, можно создать и предоставить другим приложениям настраиваемые свойства, написав соответствующие блоки кода. В следующей процедуре показано, как добавить в элемент управления свойства, позволяющие пользователю изменять цвет фона и текста.

Для добавления свойства в составной элемент управления выполните следующие действия.

В обозревателе решений щелкните правой кнопкой мыши элемент ctlClock.cs и выберите пункт Просмотреть код.

Откроется Редактор кода для выбранного элемента управления.
Найдите оператор public partial class ctlClock. Под открывающей скобкой ({)) введите следующий код:

[C#]
```
private Color colFColor;
private Color colBColor;
```
Эти операторы создают закрытые переменные. В них будут храниться значения создаваемых свойств.

Введите следующий код под объявлениями переменных, созданными на этапе 2:

[C#]

// Declares the name and type of the property.
public Color ClockBackColor
{
    // Retrieves the value of the private variable colBColor.
    get
    {
        return colBColor;
    }
    // Stores the selected value in the private variable colBColor, and 
    // updates the background color of the label control lblDisplay.
    set
    {
        colBColor = value;
        lblDisplay.BackColor = colBColor;   
    }
}
// Provides a similar set of instructions for the foreground color.
public Color ClockForeColor
{
    get
    {
        return colFColor;
    }
    set
    {
        colFColor = value;
        lblDisplay.ForeColor = colFColor;
    }
}

Приведенный выше код позволяет пользователям этого элемента управления получить доступ к настраиваемым свойствам ClockForeColor и ClockBackColor. Операторы get и set соответственно сохраняют и извлекают значение свойства, а также выполняют код, реализующий необходимую функцию.

В меню Файл выберите команду Сохранить все для сохранения проекта.

Проверка элемента управления

Элементы управления не являются автономными приложениями; они должны быть включены в контейнер. Проверьте поведение созданного элемента управления и испытайте его свойства с помощью Тестового контейнера пользовательских элементов управления. Дополнительные сведения см. в разделе Практическое руководство. Тестирование поведения элемента UserControl во время выполнения.

Чтобы протестировать элемент управления

Нажмите клавишу F5 для построения проекта и запустите элемент управления в Тестовом контейнере пользовательских элементов управления.
В таблице свойств тестового контейнера выберите свойство ClockBackColor, чтобы вывести на экран цветовую палитру.
Выберите цвет с помощью щелчка мыши.

Цвет фона элемента управления изменится на выбранный цвет.
С помощью аналогичной последовательности событий проверьте, что свойство ClockForeColor работает правильно.

В этом и предыдущем разделе было показано, как компоненты и элементы управления Windows можно объединить с кодом и упаковкой, чтобы предоставить пользовательские функциональные возможности в виде составного элемента управления. Было продемонстрировано, как предоставлять свойства составного элемента управления и тестировать элемент управления после завершения его разработки. В следующем разделе содержатся сведения о построении наследуемого составного элемента управления на базе элемента управления ctlClock.

Наследование из составного элемента управления

В предыдущих разделах рассказывалось, как объединить компоненты, элементы управления Windows и код, чтобы создать составные элементы управления, доступные для многократного использования. В этом разделе будет показано, как на основе составного элемента управления построить другие элементы управления. Процесс создания производного класса на основе базового класса называется наследованием. В этом разделе будет создан составной элемент управления ctlAlarmClock. Он будет производным от родительского элемента управления ctlClock. Также будет показано, как расширить функциональные возможности элемента ctlClock путем переопределения методов родительского класса и добавления новых методов и свойств.

Первым шагом для создания наследуемого элемента управления является наследование от родительского элемента управления. При этом создается новый элемент управления, который не только имеет все свойства, методы и графические характеристики родительского элемента управления, но и служит основой для добавления или изменения функциональных возможностей.

Чтобы создать наследуемый элемент управления

В обозревателе решений щелкните проект правой кнопкой мыши элемент ctlClockLib, укажите Добавить и выберите Пользовательский элемент управления.

Открывается диалоговое окно Добавление нового элемента.
Выберите шаблон Наследуемый пользовательский элемент управления.
В поле Имя введите ctlAlarmClock.cs и нажмите кнопку Добавить.

Откроется диалоговое окно Выбор компонентов для наследования.
Дважды щелкните ctlClock под строкой Имя компонента.
В обозревателе решений просмотрите список текущих проектов.

Примечание

В текущий проект был добавлен файл ctlAlarmClock.cs.

Добавление свойств будильника

Добавление свойств в наследуемый элемент управления выполняется точно так же, как и в случае с составным элементом управления. Теперь будет использован синтаксис объявления свойства для добавления двух свойств в элемент управления: AlarmTime, хранящее значение даты и времени срабатывания будильника, и AlarmSet, показывающее, установлен ли будильник.

Для добавления свойств в составной элемент управления выполните следующие действия.

В обозревателе решений щелкните правой кнопкой мыши элемент ctlAlarmClock и выберите пункт Просмотреть код.

Найдите оператор public class. Обратите внимание, что элемент управления наследует от ctlClockLib.ctlClock. Под открывающей скобкой оператора ({) введите следующий код:

[C#]

private DateTime dteAlarmTime;
private bool blnAlarmSet;
// These properties will be declared as public to allow future 
// developers to access them.
public DateTime AlarmTime
{
    get
    {
        return dteAlarmTime;
    }
    set
    {
        dteAlarmTime = value;
    }
}
public bool AlarmSet
{
    get
    {
        return blnAlarmSet;
    }
    set
    {
        blnAlarmSet = value;
    }
}

Добавление графического интерфейса в элемент управления

Наследуемый элемент управления имеет такой же визуальный интерфейс, как и его родительский элемент управления. Наследуемый элемент управления также наследует все элементы управления, содержащиеся в родительском элементе управления, но их свойства недоступны из наследуемого элемента, если они не были предоставлены явным образом. В графический интерфейс наследуемого составного элемента управления можно добавлять элементы так же, как и в графический интерфейс любого другого составного элемента управления. Далее в визуальный интерфейс будильника будет добавлен элемент управления надпись, который будет мигать при срабатывании будильника.

Чтобы добавить элемент управления надпись

В обозревателе решений щелкните правой кнопкой мыши элемент ctlAlarmClock и выберите пункт Конструктор представлений.

В главном окне откроется конструктор элемента управления ctlAlarmClock.
Щелкните область отображения элемента управления и изучите окно "Свойства".

Примечание

Хотя все свойства отображаются, они затенены.Это означает, что эти свойства являются собственными свойствами для lblDisplay и в окне свойств нельзя ни изменить их, ни обратиться к ним.Элементы управления, содержащиеся в составном элементе управления, по умолчанию являются закрытыми (private), и их свойства недоступны.

Примечание

Чтобы пользователи элемента управления имели доступ к его внутренним элементам управления, эти элементы управления должны быть объявлены как public или protected.Это позволит устанавливать и изменять свойства элементов управления, содержащихся в составном элементе управления, с помощью написания соответствующего кода.
Для добавления элемента управления Label в составной элемент управления выполните следующие действия.
С помощью мыши перетащите элемент управления Label непосредственно под поле отображения. В окне свойств задайте значения для следующих свойств.

Свойство

Параметр

Name

lblAlarm

Text

Будильник!

TextAlign

MiddleCenter

Visible

false

Свойство	Параметр
Name	lblAlarm
Text	Будильник!
TextAlign	MiddleCenter
Visible	false

Добавление функциональных возможностей будильника

Свойства и элемент управления, добавленные в предыдущих процедурах, позволяют реализовать функциональные возможности будильника в составном элементе управления. В этой процедуре в пользовательский элемент управления будет добавлен код, в котором текущее время сравнивается со временем срабатывания будильника. Если они совпадают, будильник начинает мигать. Переопределив метод timer1_Tick элемента управления ctlClockи добавив в него дополнительный код, можно расширить функциональные возможности наследуемого элемента управления ctlAlarmClock, сохранив в то же время все функциональные возможности элемента ctlClock.

Чтобы переопределить метод timer1_Tick компонента ctlClock

В Редакторе кода найдите оператор private bool blnAlarmSet;. Непосредственно после него добавьте следующий оператор.

[C#]
```
private bool blnColorTicker;
```
В Редакторе кода найдите закрывающую фигурную скобку (}) в конце класса. Непосредственно перед этой скобкой добавьте следующий код.

[C#]
```
protected override void timer1_Tick(object sender, System.EventArgs e)
{
    // Calls the Timer1_Tick method of ctlClock.
    base.timer1_Tick(sender, e);
    // Checks to see if the alarm is set.
    if (AlarmSet == false)
        return;
    else
        // If the date, hour, and minute of the alarm time are the same as
        // the current time, flash an alarm. 
    {
        if (AlarmTime.Date == DateTime.Now.Date && AlarmTime.Hour == 
            DateTime.Now.Hour && AlarmTime.Minute == DateTime.Now.Minute)
        {
            // Sets lblAlarmVisible to true, and changes the background color based on
            // the value of blnColorTicker. The background color of the label 
            // will flash once per tick of the clock.
            lblAlarm.Visible = true;
            if (blnColorTicker == false) 
            {
                lblAlarm.BackColor = Color.Red;
                blnColorTicker = true;
            }
            else
            {
                lblAlarm.BackColor = Color.Blue;
                blnColorTicker = false;
            }
        }
        else
        {
            // Once the alarm has sounded for a minute, the label is made 
            // invisible again.
            lblAlarm.Visible = false;
        }
    }
}
```
Этот код выполняет несколько задач. Оператор override указывает, что элемент управления должен использовать этот метод вместо метода, унаследованного от базового элемента управления. При вызове этого метода он вызывает переопределяемый им метод (с помощью вызова оператора base.timer1_Tick). Благодаря этому все функциональные возможности исходного элемента управления реализуются и в этом элементе. Затем выполняется дополнительный код, реализующий функциональные возможности будильника. При наступлении времени срабатывания будильника появляется мигающий элемент управления "Надпись".

Теперь разработка будильника почти завершена. Необходимо только реализовать возможность его отключения. Для этого необходимо добавить код в метод lblAlarm_Click.

Чтобы реализовать метод отключения будильника

В обозревателе решений щелкните правой кнопкой мыши элемент ctlAlarmClock.cs и выберите пункт Конструктор представлений.

Откроется окно конструктора.
Добавьте кнопку в элемент управления. Установите свойства кнопки следующим образом.

Свойство

Значение

Name

btnAlarmOff

Text

Отключить предупреждение
В конструкторе дважды щелкните компонент btnAlarmOff.

В Редакторе кода откроется строка private void btnAlarmOff_Click.

Свойство	Значение
Name	btnAlarmOff
Text	Отключить предупреждение

Измените этот метод, как указано ниже.

[C#]

private void btnAlarmOff_Click(object sender, System.EventArgs e)
{
    // Turns off the alarm.
    AlarmSet = false;
    // Hides the flashing label.
    lblAlarm.Visible = false;
}

В меню Файл выберите команду Сохранить все для сохранения проекта.

Использование наследуемого элемента управления в форме

Проверить наследуемый элемент управления можно таким же образом, как был проверен элемент управления базового класса, ctlClock: нажмите клавишу F5 для построения проекта и напустите элемент управления в Тестовом контейнере пользовательских элементов управления. Дополнительные сведения см. в разделе Практическое руководство. Тестирование поведения элемента UserControl во время выполнения.

Для использования элемента управления необходимо включить его в форму. Как и стандартный составной элемент управления, наследуемый составной элемент управления не может быть автономным и должен быть включен в форму или другой контейнер. Поскольку элемент управления ctlAlarmClock имеет дополнительные функциональные возможности, для его тестирования требуется дополнительный код. В этой процедуре будет написана простая программа для проверки функциональных возможностей элемента управления ctlAlarmClock. Она будет устанавливать и отображать значение свойства AlarmTime элемента ctlAlarmClock и тестировать его функции.

Чтобы построить элемент управления и добавить его в тестовую форму

В обозревателе решений щелкните правой кнопкой мыши ctlClockLib и затем выберите Построить.
Добавьте в решение новый проект Приложение Windows и назовите его Test.
В обозревателе решений щелкните правой кнопкой мыши узел Ссылки создаваемого тестового проекта. Нажмите кнопку Добавить ссылку для открытия диалогового окна Добавление ссылки. Перейдите на вкладку Проекты. Под строкой Имя проекта будет отображен проект ctlClockLib. Дважды щелкните проект, чтобы добавить ссылку на тестовый проект.
В обозревателе решений щелкните правой кнопкой мыши Test и затем выберите Построить.
На панели элементов разверните узел Компоненты ctlClockLib.
Дважды щелкните ctlAlarmClock, чтобы добавить копию ctlAlarmClock в форму.
На панели элементов найдите элемент DateTimePicker и дважды щелкните его, чтобы добавить элемент управления DateTimePicker в форму, а затем добавьте элемент управления Label, дважды щелкнув элемент Надпись.
С помощью мыши удобно расположите элементы управления в форме.
Установите свойства этих элементов управления следующим образом.

Элемент управления

Свойство

Значение

label1

Text

(пробел)

Name

lblTest

dateTimePicker1

Name

dtpTest

Format

Time
В конструкторе дважды щелкните компонент dtpTest.

В редакторе кода откроется private void dtpTest_ValueChanged.

Элемент управления	Свойство	Значение
label1	Text	(пробел)
	Name	lblTest
dateTimePicker1	Name	dtpTest
	Format	Time

Измените код, как показано ниже.

[C#]

private void dtpTest_ValueChanged(object sender, System.EventArgs e)
{
    ctlAlarmClock1.AlarmTime = dtpTest.Value;
    ctlAlarmClock1.AlarmSet = true;
    lblTest.Text = "Alarm Time is " +
        ctlAlarmClock1.AlarmTime.ToShortTimeString();
}

В обозревателе решений щелкните правой кнопкой мыши Test и выберите Назначить автозагружаемым проектом.
В меню Отладка щелкните Начать отладку.

Начнется выполнение тестовой программы. Обратите внимание, что в элементе управления ctlAlarmClock отображается текущее время (которое постоянно обновляется), а в элементе управления DateTimePicker — начальное время.
Щелкните поле элемента DateTimePicker, в котором отображаются минуты.
С помощью клавиатуры измените значение этого поля таким образом, чтобы оно было на одну минуту больше текущего времени, отображаемого элементом ctlAlarmClock.

Время включения будильника показано в элементе lblTest. Дождитесь, когда текущее время станет равным времени срабатывания будильника. В этот момент элемент lblAlarm начнет мигать.
Отключите будильник, нажав btnAlarmOff. Теперь можно переустановить будильник.

В этом пошаговом руководстве был проиллюстрирован ряд ключевых положений. В частности, в нем было показано, как создавать составной элемент управления посредством объединения элементов управления и компонентов в контейнер составного элемента управления. Также было описано, как добавлять свойства в элемент управления и писать код, реализующий пользовательские функциональные возможности. В последнем разделе было продемонстрировано, как расширять функциональные возможности составного элемента управления с помощью наследования и как изменять функциональные возможности базового элемента управления посредством переопределения методов.

См. также

Поделиться через

Пример. Создание составного элемента управления с помощью C#

Создание проекта

Чтобы создать библиотеку элементов управления ctlClockLib и элемент управления ctlClock

Добавление элементов управления и компонентов Windows в составной элемент управления

Чтобы добавить элементы управления Label и Timer в составной элемент управления

Добавление свойств в составной элемент управления

Для добавления свойства в составной элемент управления выполните следующие действия.

Проверка элемента управления

Чтобы протестировать элемент управления

Наследование из составного элемента управления

Чтобы создать наследуемый элемент управления

Добавление свойств будильника

Для добавления свойств в составной элемент управления выполните следующие действия.

Добавление графического интерфейса в элемент управления

Чтобы добавить элемент управления надпись

Добавление функциональных возможностей будильника

Чтобы переопределить метод timer1_Tick компонента ctlClock

Чтобы реализовать метод отключения будильника

Использование наследуемого элемента управления в форме

Чтобы построить элемент управления и добавить его в тестовую форму

См. также

Задачи

Основные понятия

Другие ресурсы

Дополнительные ресурсы