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

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

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

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

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

1. В Visual Studio создайте новый проект библиотеки элементов управления Windows Forms и назовите его ctlClockLib.

   Имя проекта, ctlClockLib, также назначается корневому пространству имен по умолчанию. Корневое пространство имен используется для определения имен компонентов в сборке. Например, если две сборки предоставляют компоненты с именем ctlClock, можно указать компонент ctlClock с помощью ctlClockLib.ctlClock.

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

   Замечание

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

3. В меню файла щелкните Сохранить все, чтобы сохранить проект.

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

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

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

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

2. На панели инструментов разверните узел Общие элементы управления, а затем дважды щелкните Метка.

   Элемент управления Label с именем label1 добавляется на поверхность конструктора в ваш элемент управления.

3. В конструкторе щелкните метку1. В окне "Свойства" задайте следующие свойства.

   Недвижимость	Изменить на
   Имя	lblDisplay
   Текст	(blank space)
   ВыравниваниеТекста	MiddleCenter
   Font.Size	14

4. В панели элементов разверните узел компонентов , а затем дважды щелкните таймер .

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

5. В конструкторе компонентов , щелкните таймер1 , а затем задайте для свойства Interval значение 1000, а свойство Enabled — true.

   Свойство Interval управляет частотой, с которой компонент Timer тикает. Каждый раз, когда timer1 тикнет, выполняется код в рамках события timer1_Tick. Интервал представляет количество миллисекунда между галками.

6. В конструкторе компонентов дважды щелкните таймер1 , чтобы перейти к событию timer1_Tick для ctlClock.

7. Измените код таким образом, чтобы он напоминал следующий пример кода. Обязательно измените модификатор доступа с private на protected.

   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, это событие будет происходить каждые тысячи миллисекунд, таким образом обновляя текущее время каждые секунды.

8. Измените метод, чтобы его можно было переопределить с помощью ключевого слова virtual. Дополнительные сведения см. в разделе "Наследование от пользовательского элемента управления" ниже.

   protected virtual void timer1_Tick(object sender, System.EventArgs e)
   

9. В меню файла щелкните Сохранить все, чтобы сохранить проект.

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

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

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

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

   Откроется редактор кода для вашего элемента управления.

2. Найдите инструкцию public partial class ctlClock. Под открывающей скобкой ({), введите следующий код.

   private Color colFColor;
   private Color colBColor;
   

   Эти инструкции создают частные переменные, которые будут использоваться для хранения значений для создаваемых свойств.

3. Введите или вставьте следующий код под объявлениями переменных из шага 2.

   // 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 обеспечивают хранение и получение значения свойства, а также код для реализации функциональных возможностей, соответствующих свойству.

4. В меню файла щелкните Сохранить все, чтобы сохранить проект.

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

Элементы управления не являются автономными приложениями; Они должны размещаться в контейнере. Испытайте поведение элемента управления во время выполнения и работайте с его свойствами с помощью тестового контейнера UserControl . Для получения дополнительной информации см. статью «Как протестировать поведение элемента управления Run-Time UserControl».

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

1. Нажмите F5, чтобы создать проект и запустить элемент управления в тестовом контейнере для UserControl.

2. В сетке свойств тестового контейнера найдите свойство ClockBackColor, а затем выберите свойство для отображения цветовой палитры.

3. Выберите цвет, щелкнув его.

   Цвет фона элемента управления изменяется на выбранный цвет.

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

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

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

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

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

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

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

   Диалоговое окно добавления нового элемента открывается.

2. Выберите шаблон унаследованного пользовательского элемента управления.

3. В поле Имя введите ctlAlarmClock.cs, а затем нажмите Добавить.

   Откроется диалоговое окно выбора наследования .

4. Под имени компонентадважды щелкните ctlClock.

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

   Замечание

   Файл с именем ctlAlarmClock.cs добавлен в текущий проект.

Добавление свойств сигнализации

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

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

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

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

   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;
       }
   }
   

Добавление в графический интерфейс контрола

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

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

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

   Конструктор для ctlAlarmClock открывается в главном окне.

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

   Замечание

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

   Замечание

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

3. Добавьте элемент управления под названием Label в свой составной элемент управления.

4. С помощью мыши перетащите элемент управления Label сразу под полем отображения. В окне "Свойства" задайте следующие свойства.

   Недвижимость	Настройки
   Имя	lblAlarm
   Текст	Тревога!
   ВыравниваниеТекста	MiddleCenter
   Видимый	false

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

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

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

1. В редакторе кода найдите оператор private bool blnAlarmSet;. Сразу под ним добавьте следующую инструкцию.

   private bool blnColorTicker;
   

2. В редакторе кода найдите закрывающую скобку (})) в конце класса. Перед фигурной скобкой добавьте следующий код.

   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.

Реализация метода отключения

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

   Откроется конструктор.

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

   Недвижимость	Ценность
   Имя	btnAlarmOff
   Текст	отключить сигнализацию

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

   редактор кода откроется в строке .

4. Измените этот метод таким образом, чтобы он напоминал следующий код.

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

5. В меню файла щелкните Сохранить все, чтобы сохранить проект.

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

Вы можете протестировать унаследованный элемент управления таким же образом, как вы протестировали элемент управления базовым классом, ctlClock: нажмите клавишу F5, чтобы создать проект и запустить элемент управления в контейнере тестирования UserControl. Для получения дополнительной информации см. статью «Как протестировать поведение элемента управления Run-Time UserControl».

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

Создание и добавление элемента управления в тестовую форму

1. В обозревателе решенийщелкните правой кнопкой мыши ctlClockLib, а затем щелкните Сборка.

2. Добавьте в решение новый проект приложения Windows Forms и назовите его Test.

3. В Обозревателе решенийщелкните правой кнопкой мыши узел Ссылки для вашего тестового проекта. Щелкните Добавить ссылку, чтобы отобразить диалоговое окно Добавить Ссылку. Щелкните вкладку, помеченную Проекты. Проект ctlClockLib будет указан в разделе Имя проекта. Дважды щелкните проект, чтобы добавить ссылку на тестовый проект.

4. В обозревателе решений щелкните правой кнопкой мыши тест, а затем щелкните Сборка.

5. Впанели элементов разверните узел компонентов ctlClockLib.

6. Дважды щелкните ctlAlarmClock, чтобы добавить копию ctlAlarmClock в вашу форму.

7. На панели элементовнайдите и дважды щелкните DateTimePicker, чтобы добавить элемент управления в форму, а затем добавьте элемент управления , дважды щелкнув Label.

8. Используйте мышь для размещения элементов управления в удобном месте формы.

9. Задайте свойства этих элементов управления следующим образом.

   Контроль	Недвижимость	Ценность
   label1	Текст	(blank space)
   	Имя	lblTest
   dateTimePicker1	Имя	dtpTest
   	Формат	Time

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

    Редактор кода .

11. Измените код таким образом, чтобы он выглядел следующим образом.

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

12. В обозревателе решенийнажмите правой кнопкой Тест, а затем выберите Установить как стартовый проект.

13. В меню отладки щелкните Начать отладку.

    Запускается тестовая программа. Обратите внимание, что текущее время обновляется в элементе управления ctlAlarmClock и что время начала отображается в элементе управления DateTimePicker.

14. Щелкните DateTimePicker, где отображаются минуты часа.

15. С помощью клавиатуры задайте значение для минут, которое на одну минуту больше текущего времени, указанного ctlAlarmClock.

    Время установки будильника отображается в lblTest. Подождите, пока отображаемое время достигнет времени настройки сигнализации. Когда отображаемое время достигает времени, на которое установлен сигнал, lblAlarm будет мигать.

16. Отключите сигнализацию, щелкнув btnAlarmOff. Теперь можно сбросить тревогу.

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

См. также

• Разновидности пользовательских элементов управления
• Как отобразить элемент управления в диалоговом окне выбора элементов панели инструментов
• Пошаговое руководство: Наследование элемента управления Windows Forms в Visual C#