Návod: Vytvoření složeného ovládacího prvku pomocí jazyka C#

  • Článek

Složené ovládací prvky poskytují prostředky, pomocí kterých je možné vytvářet a opakovaně používat vlastní grafická rozhraní. Složený ovládací prvek je v podstatě komponenta s vizuální reprezentací. Může se tak skládat z jednoho nebo více ovládacích prvků model Windows Forms, součástí nebo bloků kódu, které můžou rozšířit funkce ověřováním uživatelského vstupu, úpravou vlastností zobrazení nebo prováděním jiných úloh vyžadovaných autorem. Složené ovládací prvky lze umístit na model Windows Forms stejným způsobem jako jiné ovládací prvky. V první části tohoto návodu vytvoříte jednoduchý složený ovládací prvek s názvem ctlClock. V druhé části návodu rozšíříte funkce ctlClock prostřednictvím dědičnosti.

Vytvoření projektu

Při vytváření nového projektu zadáte jeho název pro nastavení kořenového oboru názvů, názvu sestavení a názvu projektu a ujistěte se, že výchozí komponenta bude ve správném oboru názvů.

Vytvoření knihovny ovládacích prvků ctlClockLib a ovládacího prvku ctlClock

  1. V sadě Visual Studio vytvořte nový projekt knihovny ovládacích prvků model Windows Forms a pojmenujte ho ctlClockLib.

    Název projektu , ctlClockLibje také přiřazen ke kořenovému oboru názvů ve výchozím nastavení. Kořenový obor názvů slouží k určení názvů komponent v sestavení. Pokud například dvě sestavení poskytují součásti s názvem ctlClock, můžete určit komponentu ctlClock pomocí ctlClockLib.ctlClock.

  2. V Průzkumník řešení klepněte pravým tlačítkem myši UserControl1.cs a potom klepněte na tlačítko Přejmenovat. Změňte název souboru na ctlClock.cs. Po zobrazení výzvy, zda chcete přejmenovat všechny odkazy na element kódu UserControl1, klikněte na tlačítko Ano.

    Poznámka:

    Složený ovládací prvek ve výchozím nastavení dědí z UserControl třídy poskytované systémem. Třída UserControl poskytuje funkce vyžadované všemi složenými ovládacími prvky a implementuje standardní metody a vlastnosti.

  3. V nabídce Soubor klepněte na tlačítko Uložit vše uložit projekt.

Přidání ovládacích prvků a komponent systému Windows do složeného ovládacího prvku

Vizuální rozhraní je základní součástí složeného ovládacího prvku. Toto vizuální rozhraní je implementováno přidáním jednoho nebo více ovládacích prvků Windows na plochu návrháře. V následující ukázce začleníte ovládací prvky Windows do složeného ovládacího prvku a napíšete kód pro implementaci funkcí.

Přidání popisku a časovače do složeného ovládacího prvku

  1. V Průzkumník řešení klepněte pravým tlačítkem myši ctlClock.cs a potom klepněte na tlačítko Návrhář zobrazení.

  2. Na panelu nástrojů rozbalte uzel Společné ovládací prvky a poklikejte na Popisek.

    Ovládací Label prvek s názvem label1 se přidá do vašeho ovládacího prvku na ploše návrháře.

  3. V návrháři klikněte na popisek1. V okno Vlastnosti nastavte následující vlastnosti.

    Vlastnost Změňte na
    Název lblDisplay
    Text (blank space)
    Textalign MiddleCenter
    Font.Size 14

  4. V sadě nástrojů rozbalte uzel Součásti a poklikejte na časovač.

    Timer Vzhledem k tomu, že je součástí, nemá vizuální reprezentaci za běhu. Proto se nezobrazuje s ovládacími prvky na ploše návrháře, ale spíše v Návrháři komponent (zásobník v dolní části plochy návrháře).

  5. V návrháři komponent klepněte na časovač1 a potom nastavte Interval vlastnost 1000 na a Enabled vlastnost na true.

    Vlastnost Interval řídí frekvenci, s jakou komponenta Timer zaškrtne. Pokaždé, když timer1 zaškrtne, spustí kód v timer1_Tick události. Interval představuje počet milisekund mezi klíštětemi.

  6. V Návrháři komponent poklikáním časovače1přejděte na timer1_Tick událost pro ctlClock.

  7. Upravte kód tak, aby připomínal následující vzorový kód. Nezapomeňte změnit modifikátor přístupu 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();
}

    Tento kód způsobí, že se aktuální čas zobrazí v lblDisplay. Vzhledem k tomu, že interval timer1 byl nastaven na 1000, dojde k této události každých tisíc milisekund, čímž se aktualizuje aktuální čas každou sekundu.

  8. Upravte metodu tak, aby byla přepsána klíčovým slovem virtual . Další informace najdete v části Dědění z uživatelského ovládacího prvku níže.

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

  9. V nabídce Soubor klepněte na tlačítko Uložit vše uložit projekt.

Přidání vlastností do složeného ovládacího prvku

Ovládací prvek hodiny teď zapouzdřuje Label ovládací prvek a komponentu Timer , z nichž každý má vlastní sadu vlastních vlastností. I když jednotlivé vlastnosti těchto ovládacích prvků nebudou přístupné pro další uživatele vašeho ovládacího prvku, můžete vytvořit a zveřejnit vlastní vlastnosti napsáním příslušných bloků kódu. V následujícím postupu přidáte do ovládacího prvku vlastnosti, které uživateli umožní změnit barvu pozadí a textu.

Přidání vlastnosti do složeného ovládacího prvku

  1. V Průzkumník řešení klepněte pravým tlačítkem myši ctlClock.cs a potom klepněte na tlačítko Zobrazit kód.

    Otevře se Editor kódu pro váš ovládací prvek.

  2. public partial class ctlClock Vyhledejte příkaz. Pod levou závorku ({)zadejte následující kód.

    private Color colFColor;
private Color colBColor;

    Tyto příkazy vytvářejí privátní proměnné, které použijete k uložení hodnot vlastností, které se chystáte vytvořit.

  3. Zadejte nebo vložte následující kód pod deklarace proměnných 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;
    }
}

    Předchozí kód zpřístupňuje dvě vlastní vlastnosti ClockForeColor a ClockBackColork dispozici pro další uživatele tohoto ovládacího prvku. set Příkazy get poskytují úložiště a načtení hodnoty vlastnosti a také kód pro implementaci funkčnosti odpovídající vlastnosti.

  4. V nabídce Soubor klepněte na tlačítko Uložit vše uložit projekt.

Otestování ovládacího prvku

Ovládací prvky nejsou samostatné aplikace; musí být hostované v kontejneru. Otestujte chování běhu ovládacího prvku a otestujte jeho vlastnosti pomocí kontejneru UserControl Test. Další informace naleznete v tématu Postupy: Otestování chování běhu userControl.

Otestování ovládacího prvku

  1. Stisknutím klávesy F5 sestavte projekt a spusťte ovládací prvek v kontejneru Test UserControl.

  2. V mřížce vlastností testovacího kontejneru vyhledejte ClockBackColor vlastnost a pak vyberte vlastnost, která zobrazí paletu barev.

  3. Vyberte barvu tak, že na ni kliknete.

    Barva pozadí ovládacího prvku se změní na barvu, kterou jste vybrali.

  4. Pomocí podobné posloupnosti událostí ověřte, že ClockForeColor vlastnost funguje podle očekávání.

    V této části a předchozích částech jste viděli, jak lze komponenty a ovládací prvky Systému Windows kombinovat s kódem a balením a poskytovat tak vlastní funkce ve formě složeného ovládacího prvku. Naučili jste se vystavit vlastnosti ve složeného ovládacího prvku a jak otestovat ovládací prvek po jeho dokončení. V další části se dozvíte, jak vytvořit zděděný složený ovládací prvek jako ctlClock základ.

Dědění ze složeného ovládacího prvku

V předchozích částech jste se naučili kombinovat ovládací prvky, komponenty a kód Windows do opakovaně použitelných složených ovládacích prvků. Složený ovládací prvek se teď dá použít jako základ, na kterém se dají sestavit další ovládací prvky. Proces odvození třídy ze základní třídy se nazývá dědičnost. V této části vytvoříte složený ovládací prvek s názvem ctlAlarmClock. Tento ovládací prvek bude odvozen z nadřazeného ovládacího prvku, ctlClock. Naučíte se rozšířit funkce ctlClock přepsáním nadřazených metod a přidáním nových metod a vlastností.

Prvním krokem při vytváření zděděného ovládacího prvku je jeho odvození z nadřazeného prvku. Tato akce vytvoří nový ovládací prvek, který má všechny vlastnosti, metody a grafické charakteristiky nadřazeného ovládacího prvku, ale může také fungovat jako základ pro přidání nových nebo upravených funkcí.

Vytvoření zděděného ovládacího prvku

  1. V Průzkumník řešení klepněte pravým tlačítkem myši ctlClockLib, přejděte na příkaz Přidat a klepněte na tlačítko Uživatelský ovládací prvek.

    Otevře se dialogové okno Přidat novou položku .

  2. Vyberte šablonu zděděného uživatelského ovládacího prvku.

  3. Do pole Název zadejte ctlAlarmClock.csa klepněte na tlačítko Přidat.

    Zobrazí se dialogové okno Pro výběr dědičnosti.

  4. V části Název součásti poklikejte na ctlClock.

  5. V Průzkumník řešení procházejte aktuální projekty.

    Poznámka:

    Do aktuálního projektu byl přidán soubor ctlAlarmClock.cs .

Přidání vlastností alarmu

Vlastnosti se přidají do zděděného ovládacího prvku stejným způsobem, jakým se přidají do složeného ovládacího prvku. Teď použijete syntaxi deklarace vlastnosti k přidání dvou vlastností do ovládacího prvku: AlarmTime, který uloží hodnotu data a času, kdy se alarm má vypnout, a AlarmSet, což bude indikovat, zda je alarm nastaven.

Přidání vlastností do složeného ovládacího prvku

  1. V Průzkumník řešení klepněte pravým tlačítkem myši ctlAlarmClock a potom klepněte na tlačítko Zobrazit kód.

  2. public class Vyhledejte příkaz. Všimněte si, že váš ovládací prvek dědí z ctlClockLib.ctlClock. Pod levou složenou závorkou ({) příkaz zadejte následující kód.

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

Přidání do grafického rozhraní ovládacího prvku

Zděděný ovládací prvek má vizuální rozhraní, které je stejné jako ovládací prvek, ze kterého dědí. Má stejné základní ovládací prvky jako nadřazený ovládací prvek, ale vlastnosti základních ovládacích prvků nebudou k dispozici, pokud nebyly výslovně vystaveny. Do grafického rozhraní zděděného složeného ovládacího prvku můžete přidat stejným způsobem jako do složeného ovládacího prvku. Pokud chcete pokračovat v přidávání do vizuálního rozhraní budíků, přidáte ovládací prvek popisku, který bude blikat, když budík zní.

Přidání ovládacího prvku popisku

  1. V Průzkumník řešení klepněte pravým tlačítkem myši ctlAlarmClock a potom klepněte na tlačítko Návrhář zobrazení.

    Návrhář pro ctlAlarmClock otevře v hlavním okně.

  2. Klikněte na zobrazenou část ovládacího prvku a zobrazte okno Vlastnosti.

    Poznámka:

    Zatímco jsou zobrazeny všechny vlastnosti, jsou neaktivní. To znamená, že tyto vlastnosti jsou nativní pro lblDisplay a nelze je upravovat ani přistupovat v okno Vlastnosti. Ve výchozím nastavení jsou ovládací prvky obsažené ve složeného ovládacího prvku privatea jejich vlastnosti nejsou přístupné žádným způsobem.

    Poznámka:

    Pokud chcete, aby další uživatelé složeného ovládacího prvku měli přístup k jeho interním ovládacím prvkům, deklarujte je jako public nebo protected. To vám umožní nastavit a upravit vlastnosti ovládacích prvků obsažených ve složeného ovládacího prvku pomocí příslušného kódu.

  3. Label Přidejte ovládací prvek do složeného ovládacího prvku.

  4. Pomocí myši přetáhněte Label ovládací prvek bezprostředně pod pole zobrazení. V okno Vlastnosti nastavte následující vlastnosti.

    Vlastnost Nastavení
    Název lblAlarm
    Text Alarm!
    Textalign MiddleCenter
    Visible false

Přidání funkce alarmu

V předchozích postupech jste přidali vlastnosti a ovládací prvek, který ve složeném ovládacím prvku umožní funkci alarmů. V tomto postupu přidáte kód, který porovná aktuální čas s časem alarmu a pokud jsou stejné, aby blikal alarm. Přepsáním timer1_Tick metody a přidáním dalšího ctlClock kódu do ní rozšíříte schopnost ctlAlarmClock při zachování všech vlastních funkcí ctlClock.

Přepsání metody timer1_Tick ctlClock

  1. V Editoru kódu vyhledejte private bool blnAlarmSet; příkaz. Přímo pod něj přidejte následující příkaz.

    private bool blnColorTicker;

  2. V Editoru kódu vyhledejte pravou složenou závorku (}) na konci třídy. Těsně před závorku přidejte následující kód.

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

    Přidání tohoto kódu provádí několik úloh. Příkaz override směruje ovládací prvek použít tuto metodu místo metody, která byla zděděna ze základního ovládacího prvku. Při volání této metody volá metodu, kterou přepíše vyvoláním base.timer1_Tick příkazu, čímž se zajistí, že se v tomto ovládacím prvku reprodukují všechny funkce zahrnuté do původního ovládacího prvku. Potom spustí další kód pro začlenění funkce alarmu. Když dojde k alarmu, zobrazí se ovládací prvek blikajícího popisku.

    Ovládání budíku je téměř hotové. Jedinou věcí, která zůstává, je implementovat způsob, jak ho vypnout. Uděláte to tak, že do lblAlarm_Click metody přidáte kód.

Implementace metody vypnutí

  1. V Průzkumník řešení klepněte pravým tlačítkem myši ctlAlarmClock.cs a potom klepněte na tlačítko Návrhář zobrazení.

    Otevře se návrhář.

  2. Přidejte do ovládacího prvku tlačítko. Vlastnosti tlačítka nastavte následujícím způsobem.

    Vlastnost Hodnota
    Název btnAlarmOff
    Text Zakázat alarm

  3. V návrháři poklikejte na btnAlarmOff.

    Editor kódu se otevře na private void btnAlarmOff_Click řádku.

  4. Upravte tuto metodu tak, aby připomínala následující kód.

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

  5. V nabídce Soubor klepněte na tlačítko Uložit vše uložit projekt.

Použití zděděného ovládacího prvku ve formuláři

Zděděný ovládací prvek můžete otestovat stejným způsobem, jakým jste otestovali ovládací prvek základní třídy: ctlClockStisknutím klávesy F5 sestavíte projekt a spustíte ovládací prvek v kontejneru UserControl Test. Další informace naleznete v tématu Postupy: Otestování chování běhu userControl.

Pokud chcete ovládací prvek použít, budete ho muset hostovat ve formuláři. Stejně jako u standardního složeného ovládacího prvku nemůže zděděný složený ovládací prvek stát sám a musí být hostován ve formuláři nebo jiném kontejneru. Vzhledem k tomu ctlAlarmClock , že má větší hloubku funkčnosti, je k otestování potřeba další kód. V tomto postupu napíšete jednoduchý program k otestování funkčnosti ctlAlarmClock. Napíšete kód pro nastavení a zobrazení AlarmTime vlastnosti ctlAlarmClocka otestujete jeho vlastní funkce.

Sestavení a přidání ovládacího prvku do testovacího formuláře

  1. V Průzkumník řešení klepněte pravým tlačítkem myši ctlClockLib a potom klepněte na příkaz Sestavit.

  2. Přidejte do řešení nový projekt aplikace model Windows Forms a pojmenujte ho Test.

  3. V Průzkumník řešení klikněte pravým tlačítkem myši na uzel Reference pro váš testovací projekt. Kliknutím na Přidat odkaz zobrazíte dialogové okno Přidat odkaz . Klikněte na kartu s popiskem Projekty. Váš ctlClockLib projekt bude uvedený v části Název projektu. Poklikáním na projekt přidejte odkaz na testovací projekt.

  4. V Průzkumník řešení klepněte pravým tlačítkem myši na test a potom klepněte na příkaz Sestavit.

  5. V sadě nástrojů rozbalte uzel ctlClockLib Components .

  6. Poklikáním na ctlAlarmClock přidáte kopii ctlAlarmClock formuláře.

  7. Na panelu nástrojů vyhledejte a poklikejte na DateTimePicker a přidejte DateTimePicker ovládací prvek do formuláře a potom Label přidejte ovládací prvek poklikáním na Popisek.

  8. Pomocí myši umístěte ovládací prvky na vhodné místo ve formuláři.

  9. Vlastnosti těchto ovládacích prvků nastavte následujícím způsobem.

    Control Vlastnost Hodnota
    label1 Text (blank space)
    Název lblTest
    dateTimePicker1 Název dtpTest
    Formát Time

  10. V návrháři poklikejte na dtpTest.

    Otevře se Editorprivate void dtpTest_ValueChangedkódu .

  11. Upravte kód tak, aby vypadal následovně.

    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. V Průzkumník řešení klepněte pravým tlačítkem myši na test a potom klepněte na tlačítko Nastavit jako spustit projekt.

  13. V nabídce Ladit klikněte na Spustit ladění.

    Spustí se testovací program. Všimněte si, že aktuální čas je v ovládacím ctlAlarmClock prvku aktualizován a že se v ovládacím DateTimePicker prvku zobrazuje počáteční čas.

  14. Klikněte na DateTimePicker místo, kde se zobrazí minuty hodiny.

  15. Pomocí klávesnice nastavte hodnotu pro minuty, které jsou o jednu minutu větší než aktuální čas zobrazený .ctlAlarmClock

    Čas nastavení alarmu se zobrazí v lblTest. Počkejte, než se zobrazený čas dostane k času nastavení alarmu. Když zobrazený čas dosáhne času, kdy je alarm nastaven, lblAlarm bude blikat.

  16. Vypněte alarm kliknutím btnAlarmOff. Možná teď resetujete alarm.

Tento článek se zabývá řadou klíčových konceptů. Naučili jste se vytvořit složený ovládací prvek kombinováním ovládacích prvků a komponent do kontejneru složených ovládacích prvků. Naučili jste se přidávat vlastnosti do ovládacího prvku a psát kód pro implementaci vlastních funkcí. V poslední části jste se naučili rozšířit funkce daného složeného ovládacího prvku prostřednictvím dědičnosti a změnit funkčnost hostitelských metod přepsáním těchto metod.

Viz také