Przewodnik: tworzenie kontrolki złożonej za pomocą języka C#

Artykuł
12/18/2024

Kontrolki złożone umożliwiają tworzenie i ponowne używanie niestandardowych interfejsów graficznych. Kontrolka złożona jest zasadniczo składnikiem z reprezentacją wizualną. W związku z tym może składać się z co najmniej jednej kontrolki, składników lub bloków kodu systemu Windows Forms, które mogą rozszerzać funkcjonalność przez weryfikowanie danych wejściowych użytkownika, modyfikowanie właściwości wyświetlania lub wykonywanie innych zadań wymaganych przez autora. Kontrolki złożone można umieszczać w formularzach systemu Windows w taki sam sposób, jak w przypadku innych kontrolek. W pierwszej części tego przewodnika utworzysz prostą kontrolkę złożoną o nazwie ctlClock. W drugiej części przewodnika rozszerzysz funkcjonalność ctlClock przez dziedziczenie.

Tworzenie projektu

Podczas tworzenia nowego projektu należy określić jego nazwę, aby ustawić przestrzeń nazw katalogu głównego, nazwę zestawu i nazwę projektu oraz upewnić się, że domyślny składnik będzie znajdować się w prawidłowej przestrzeni nazw.

Aby utworzyć bibliotekę formantów ctlClockLib i kontrolkę ctlClock

W programie Visual Studio utwórz nowy projekt biblioteki kontrolek formularzy systemu Windows i nadaj mu nazwę ctlClockLib.

Nazwa projektu, ctlClockLib, jest również domyślnie przypisywana do głównej przestrzeni nazw. Główna przestrzeń nazw służy do kwalifikowania nazw składników w zestawie. Jeśli na przykład dwa zestawy zawierają składniki o nazwie ctlClock, możesz określić składnik ctlClock przy użyciu ctlClockLib.ctlClock.
W Eksploratorze rozwiązań kliknij prawym przyciskiem myszy na UserControl1.cs, a następnie kliknij Zmień nazwę. Zmień nazwę pliku na ctlClock.cs. Kliknij przycisk Tak, gdy zostaniesz zapytany, czy chcesz zmienić nazwę wszystkich odwołań do elementu kodu "UserControl1".

Notatka

Domyślnie kontrolka złożona dziedziczy z klasy UserControl dostarczonej przez system. Klasa UserControl udostępnia funkcje wymagane przez wszystkie kontrolki złożone i implementuje standardowe metody i właściwości.
W menu Plik kliknij Zapisz wszystkie, aby zapisać projekt.

Dodawanie kontrolek i składników systemu Windows do kontrolki złożonej

Interfejs wizualny jest istotną częścią kontrolki złożonej. Ten interfejs wizualny jest implementowany przez dodanie co najmniej jednej kontrolki Windows do obszaru projektanta. W poniższej demonstracji uwzględnisz kontrolki systemu Windows w kontrolce złożonej i napiszesz kod w celu zaimplementowania funkcji.

Aby dodać etykietę i czasomierz do kontrolki złożonej

W Eksploratorze rozwiązań kliknij prawym przyciskiem myszy ctlClock.cs, a następnie wybierz Projektant widoku.
W przybornikurozwiń węzeł Common Controls, a następnie dwukrotnie kliknij Label.

Kontrolka Label o nazwie label1 jest dodawana do twojej kontrolki na powierzchni projektanta.
W projektancie kliknij label1. W oknie Właściwości ustaw następujące właściwości.

Własność Zmień na

nazwa lblDisplay

Tekst (blank space)

textAlign MiddleCenter

Rozmiar czcionki 14
W przybornikurozwiń węzeł Komponenty, a następnie kliknij dwukrotnie Timer.

Ponieważ Timer jest składnikiem, nie ma wizualnej reprezentacji w czasie wykonywania. W związku z tym nie jest wyświetlany z kontrolkami na powierzchni projektanta, a zamiast tego w Projektancie składników (zasobnik u dołu powierzchni projektanta).
Wprojektanta składników kliknij timer1, a następnie ustaw właściwość na i właściwość na wartość .

Właściwość Interval kontroluje częstotliwość, z jaką Timer składnik odmierza czas. Za każdym razem, gdy timer1 tyka, wykonywany jest kod w zdarzeniu timer1_Tick. Interwał reprezentuje liczbę milisekund między znacznikami.
W Projektancie składnikówdwukrotnie kliknij timer1, aby przejść do zdarzenia timer1_Tick dla ctlClock.
Zmodyfikuj kod, tak aby był podobny do poniższego przykładu kodu. Pamiętaj, aby zmienić modyfikator dostępu z private na protected.
```
protected void timer1_Tick(object sender, System.EventArgs e)
{
    // Causes the label to display the current time.
    lblDisplay.Text = DateTime.Now.ToLongTimeString();
}
```
Ten kod spowoduje, że bieżący czas będzie wyświetlany w lblDisplay. Ponieważ interwał timer1 został ustawiony na 1000, to zdarzenie będzie występować co tysiąc milisekund, aktualizując bieżącą godzinę co sekundę.
Zmodyfikuj metodę tak, aby można ją było zastąpić za pomocą słowa kluczowego virtual. Aby uzyskać więcej informacji, zobacz sekcję "Dziedziczenie z kontrolki użytkownika" poniżej.
```
protected virtual void timer1_Tick(object sender, System.EventArgs e)
```
W menu Plik kliknij Zapisz wszystkie, aby zapisać projekt.

Własność	Zmień na
nazwa	`lblDisplay`
Tekst	`(blank space)`
textAlign	`MiddleCenter`
Rozmiar czcionki	`14`

Dodawanie właściwości do kontrolki złożonej

Kontrolka zegara hermetyzuje teraz kontrolkę Label i składnik Timer, z których każdy ma własny zestaw właściwości nieodłącznych. Chociaż poszczególne właściwości tych kontrolek nie będą dostępne dla kolejnych użytkowników kontrolki, można tworzyć i uwidaczniać właściwości niestandardowe, pisząc odpowiednie bloki kodu. W poniższej procedurze dodasz właściwości do kontrolki, które umożliwiają użytkownikowi zmianę koloru tła i tekstu.

Aby dodać właściwość do kontrolki złożonej

W eksploratorze rozwiązań kliknij prawym przyciskiem myszy ctlClock.cs, a następnie kliknij Wyświetl kod.

Edytor kodu dla Twojej kontrolki otwiera się.
Znajdź instrukcję public partial class ctlClock. Poniżej nawiasu klamrowego otwierającego ({)wpisz następujący kod.
```
private Color colFColor;
private Color colBColor;
```
Te instrukcje tworzą zmienne prywatne, które będą używane do przechowywania wartości właściwości, które wkrótce utworzysz.

Wprowadź lub wklej następujący kod pod deklaracjami zmiennych z kroku 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;
    }
}

Powyższy kod udostępnia dwie właściwości niestandardowe, ClockForeColor i ClockBackColor, dla kolejnych użytkowników tej kontrolki. Instrukcje get i set zapewniają przechowywanie i pobieranie wartości właściwości, a także kod w celu zaimplementowania funkcji odpowiednich dla właściwości.

Na menu Plik kliknij Zapisz Wszystkie, aby zapisać projekt.

Testowanie kontrolki

Kontrolki nie są aplikacjami autonomicznymi; muszą być hostowane w kontenerze. Przetestuj zachowanie kontrolki podczas działania i przetestować jej właściwości za pomocą kontenera testowego UserControl. Aby uzyskać więcej informacji, zobacz Jak: Testować Run-Time Zachowanie UserControl.

Aby przetestować kontrolkę

Naciśnij F5, aby skompilować projekt i uruchomić kontrolkę w kontenerze testowym UserControl.
W siatce właściwości kontenera testowego znajdź właściwość ClockBackColor, a następnie wybierz właściwość, aby wyświetlić paletę kolorów.
Wybierz kolor, klikając go.

Kolor tła kontrolki zmienia się na wybrany kolor.
Użyj podobnej sekwencji zdarzeń, aby sprawdzić, czy właściwość ClockForeColor działa zgodnie z oczekiwaniami.

W tej sekcji i w poprzednich sekcjach przedstawiono sposób łączenia składników i kontrolek systemu Windows z kodem i pakowaniem w celu zapewnienia niestandardowych funkcji w postaci złożonej kontrolki. Wiesz już, jak uwidaczniać właściwości w kontrolce złożonej i jak przetestować kontrolkę po jej zakończeniu. W następnej sekcji dowiesz się, jak utworzyć odziedziczoną kontrolkę złożoną przy użyciu ctlClock jako podstawy.

Dziedziczyć z kontrolki złożonej

W poprzednich sekcjach przedstawiono sposób łączenia kontrolek, składników i kodu systemu Windows w kontrolki złożone wielokrotnego użytku. Kontrolkę złożoną można teraz użyć jako podstawy, na której można skompilować inne kontrolki. Proces wyprowadzania klasy z klasy bazowej nazywany jest dziedziczeniem . W tej sekcji utworzysz złożoną kontrolkę o nazwie ctlAlarmClock. Ta kontrolka będzie pochodzić z kontrolki nadrzędnej, ctlClock. Dowiesz się, jak rozszerzyć funkcjonalność ctlClock przez zastąpienie metod nadrzędnych i dodanie nowych metod i właściwości.

Pierwszym krokiem tworzenia kontrolki dziedziczonej jest wywodzenie jej z elementu nadrzędnego. Ta akcja tworzy nową kontrolkę, która ma wszystkie właściwości, metody i graficzne cechy kontrolki nadrzędnej, ale może również działać jako podstawa dodawania nowych lub zmodyfikowanych funkcji.

Aby utworzyć dziedziczoną kontrolkę

W Eksploratorze rozwiązań kliknij prawym przyciskiem myszy ctlClockLib, wskaż polecenie Dodaj, a następnie kliknij Kontrolka użytkownika.

Zostanie otwarte okno dialogowe Dodawanie nowego elementu.
Wybierz szablon Dziedziczona kontrola użytkownika.
W polu Nazwa wpisz ctlAlarmClock.cs, a następnie kliknij przycisk Dodaj.

Pojawi się okno dialogowe selektora dziedziczenia.
W polu Nazwa składnika, kliknij dwukrotnie ctlClock.
W eksploratorze rozwiązań przejrzyj bieżące projekty.

Notatka

Plik o nazwie ctlAlarmClock.cs został dodany do bieżącego projektu.

Dodawanie właściwości alarmu

Właściwości są dodawane do dziedziczonej kontrolki w taki sam sposób, jak są dodawane do kontrolki złożonej. Teraz użyjesz składni deklaracji właściwości, aby dodać dwie właściwości do kontrolki: AlarmTime, która będzie przechowywać wartość daty i godziny, w której alarm ma zostać wyłączony, a AlarmSet, co wskaże, czy alarm jest ustawiony.

Aby dodać właściwości do kontrolki złożonej

W eksploratorze rozwiązań kliknij prawym przyciskiem myszy ctlAlarmClock, a następnie kliknij Wyświetl kod.

Znajdź instrukcję public class. Pamiętaj, że kontrola dziedziczy od ctlClockLib.ctlClock. Pod nawiasem klamrowym otwierającym ( instrukcja{) wpisz następujący kod.

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

Dodaj do interfejsu graficznego kontrolki

Dziedziczona kontrolka ma interfejs wizualny, który jest identyczny z kontrolką, po której dziedziczy. Posiada te same składowe kontrolki co jego kontrolka nadrzędna, ale właściwości kontrolek składowych nie będą dostępne, chyba że zostały one specjalnie ujawnione. Możesz dodawać do interfejsu graficznego dziedziczonej kontrolki złożonej w taki sam sposób, jak do dowolnej kontrolki złożonej. Aby kontynuować ulepszanie interfejsu wizualnego zegara alarmowego, należy dodać element etykiety, który będzie migotać, gdy alarm brzmi.

Aby dodać kontrolkę etykiety

W Eksploratorze rozwiązań kliknij prawym przyciskiem myszy ctlAlarmClock, a następnie kliknij Zobacz projektanta.

Projektant dla ctlAlarmClock otwiera się w oknie głównym.
Kliknij część wyświetlaną kontrolki i wyświetl okno Właściwości.

Notatka

Podczas wyświetlania wszystkich właściwości są one wygaszone. Oznacza to, że te właściwości są natywne dla lblDisplay i nie można ich modyfikować ani uzyskiwać do nich dostępu w oknie Właściwości. Domyślnie kontrolki zawarte w kontrolce złożonej są private, a ich właściwości nie są dostępne w żaden sposób.

Notatka

Jeśli chcesz, aby kolejni użytkownicy kontrolki złożonej mieli dostęp do swoich wewnętrznych kontrolek, zadeklaruj ich jako public lub protected. Pozwoli to ustawić i zmodyfikować właściwości kontrolek zawartych w kontrolce złożonej przy użyciu odpowiedniego kodu.
Dodaj kontrolkę Label do kontrolki złożonej.
Za pomocą myszy przeciągnij kontrolkę Label bezpośrednio pod polem wyświetlania. W oknie Właściwości ustaw następujące właściwości.

Własność Ustawienie

Nazwa lblAlarm

tekst Alarm!

TextAlign MiddleCenter

widoczne false

Własność	Ustawienie
Nazwa	`lblAlarm`
tekst	Alarm!
TextAlign	`MiddleCenter`
widoczne	`false`

Dodawanie funkcji alarmu

W poprzednich procedurach dodano właściwości i kontrolkę, która umożliwi korzystanie z funkcji alarmu w kontrolce złożonej. W tej procedurze dodasz kod, aby porównać bieżący czas z czasem alarmu i, jeśli są one takie same, aby uruchomić miganie alarmu. Przesłaniając metodę timer1_Tick w ctlClock i dodając dodatkowy fragment kodu, rozszerzysz możliwości ctlAlarmClock, a jednocześnie zachowasz wszystkie nieodłączne funkcje ctlClock.

Aby zastąpić metodę timer1_Tick w ctlClock

W edytorze kodu znajdź instrukcję private bool blnAlarmSet;. Bezpośrednio pod nim dodaj następującą instrukcję.
```
private bool blnColorTicker;
```

W edytorze kodu , znajdź zamykający nawias klamrowy (}) na końcu klasy. Tuż przed nawiasem klamrowym dodaj następujący kod.

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

Dodanie tego kodu realizuje kilka zadań. Instrukcja override kieruje kontrolkę do używania tej metody zamiast metody dziedziczonej z kontrolki podstawowej. Po wywołaniu tej metody wywołuje metodę, którą zastępuje, wywołując instrukcję base.timer1_Tick, zapewniając, że wszystkie funkcje włączone w oryginalnej kontrolce są odtwarzane w tej kontrolce. Następnie uruchamia dodatkowy kod w celu włączenia funkcji alarmu. Gdy wystąpi alarm, pojawi się migająca kontrolka.

Sterowanie zegarem alarmu jest prawie kompletne. Jedyną rzeczą, która pozostaje, jest zaimplementowanie sposobu, aby go wyłączyć. W tym celu dodasz kod do metody lblAlarm_Click.

Aby zaimplementować metodę zamykania

W Eksploratorze rozwiązań kliknij prawym przyciskiem myszy ctlAlarmClock.cs, a następnie wybierz Wyświetl projektanta.

Projektant się otwiera.
Dodaj przycisk do kontrolki. Ustaw właściwości przycisku w następujący sposób.

Własność Wartość

nazwa btnAlarmOff

tekst Wyłącz alarm
W designerze kliknij dwukrotnie btnAlarmOff.

Edytor kodu zostanie otwarty w wierszu private void btnAlarmOff_Click.

Własność	Wartość
nazwa	`btnAlarmOff`
tekst	Wyłącz alarm

Zmodyfikuj tę metodę tak, aby przypominała następujący kod.

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

W menu plik kliknij Zapisz wszystkie, aby zapisać projekt.

Używanie kontrolki dziedziczonej w formularzu

Możesz przetestować odziedziczoną kontrolkę w taki sam sposób, w jaki testowałeś kontrolkę klasy bazowej, ctlClock: naciśnij F5, aby skompilować projekt i uruchomić kontrolkę w kontenerze testowym UserControl . Aby uzyskać więcej informacji, zobacz Jak przetestować Run-Time zachowanie kontrolki użytkownika.

Aby użyć kontrolki, musisz umieścić ją w formularzu. Podobnie jak w przypadku standardowej kontrolki złożonej, dziedziczona kontrolka złożona nie może działać samodzielnie i musi być hostowana w formularzu lub innym kontenerze. Ponieważ ctlAlarmClock ma większą głębię funkcjonalności, do przetestowania jest wymagany dodatkowy kod. W tej procedurze napiszesz prosty program do testowania funkcjonalności ctlAlarmClock. Napiszesz kod, aby ustawić i wyświetlić właściwość AlarmTime obiektu ctlAlarmClockoraz przetestujesz jej funkcje wbudowane.

Aby skompilować i dodać kontrolkę do formularza testowego

W eksploratorze rozwiązań kliknij prawym przyciskiem myszy ctlClockLib, a następnie kliknij pozycję Kompilacja.
Dodaj nowy projekt Windows Forms Application do rozwiązania i nadaj mu nazwę Test.
W eksploratorze rozwiązań kliknij prawym przyciskiem myszy węzeł Odwołania dla projektu testowego. Kliknij przycisk Dodaj odwołanie, aby wyświetlić okno dialogowe Dodaj odwołanie. Kliknij kartę o etykiecie Projects. Projekt ctlClockLib zostanie umieszczony pod Nazwą Projektu . Kliknij dwukrotnie projekt, aby dodać odwołanie do projektu testowego.
W eksploratorze rozwiązań kliknij prawym przyciskiem myszy pozycję Test, a następnie kliknij pozycję Build.
W przyborniku rozwiń węzeł komponentów ctlClockLib.
Kliknij dwukrotnie ctlAlarmClock, aby dodać kopię ctlAlarmClock do formularza.
Wprzybornika znajdź i kliknij dwukrotnie DateTimePicker, aby dodać kontrolkę do formularza, a następnie dodaj kontrolkę , klikając dwukrotnie Etykieta.
Użyj myszy, aby umieścić kontrolki w wygodnym miejscu w formularzu.
Ustaw właściwości tych kontrolek w następujący sposób.

Kontrola Własność Wartość

label1 Tekst (blank space)

Nazwa lblTest

dateTimePicker1 nazwa dtpTest

Format Time
W projektancie kliknij dwukrotnie dtpTest.

Edytor kodu otwiera się na private void dtpTest_ValueChanged.

Kontrola	Własność	Wartość
`label1`	Tekst	`(blank space)`
	Nazwa	`lblTest`
`dateTimePicker1`	nazwa	`dtpTest`
	Format	Time

Zmodyfikuj kod, tak aby był podobny do poniższego.

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

W Eksploratorze rozwiązań kliknij prawym przyciskiem myszy Test, a następnie kliknij Ustaw jako projekt startowy.
Na menu Debug kliknij pozycję Rozpocznij debugowanie.

Zostanie uruchomiony program testowy. Należy pamiętać, że bieżący czas jest aktualizowany w kontrolce ctlAlarmClock i że czas rozpoczęcia jest wyświetlany w kontrolce DateTimePicker.
Kliknij DateTimePicker, gdzie wyświetlane są minuty godziny.
Za pomocą klawiatury ustaw wartość minut, która jest minutą większą niż bieżąca godzina wyświetlana przez ctlAlarmClock.

Czas ustawienia alarmu jest wyświetlany w lblTest. Poczekaj na wyświetlony czas osiągnięcia czasu ustawienia alarmu. Gdy wyświetlany czas osiągnie czas, do którego ustawiono alarm, lblAlarm będzie migać.
Wyłącz alarm, klikając pozycję btnAlarmOff. Teraz możesz zresetować alarm.

W tym artykule opisano szereg kluczowych pojęć. Nauczyłeś się tworzyć kontrolkę złożoną, łącząc kontrolki i składniki w jeden kontener kontrolki złożonej. Wiesz już, jak dodawać właściwości do kontrolki i pisać kod w celu zaimplementowania funkcji niestandardowych. W ostatniej sekcji przedstawiono rozszerzanie funkcjonalności danej złożonej kontrolki przez dziedziczenie i zmianę funkcjonalności metod hostów przez zastąpienie tych metod.

Udostępnij za pośrednictwem