Sdílet prostřednictvím

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ů, součástí nebo bloků kódu Windows Forms, 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 ve Windows Forms umístit 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 novou knihovnu ovládacích prvků Windows Forms projektu a pojmenujte ji ctlClockLib.

    Název projektu, ctlClockLib, je 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í komponenty s názvem ctlClock, můžete určit komponentu ctlClock pomocí ctlClockLib.ctlClock.

  2. Ve Průzkumníku řešeníklikněte pravým tlačítkem myši na UserControl1.csa poté klikněte na Přejmenovat. Změňte název souboru na ctlClock.cs. Když se zobrazí dotaz, jestli chcete přejmenovat všechny odkazy na prvek kódu UserControl1, klikněte na tlačítko Ano.

    Poznámka

    Složený ovládací prvek ve výchozím nastavení dědí ze třídy UserControl, kterou poskytuje systém. 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 klikněte na Uložit vše pro uložení projektu.

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íklikněte pravým tlačítkem na ctlClock.csa potom klikněte na Zobrazit návrháře.

  2. Vpanelu nástrojů rozbalte uzel společných ovládacích prvků a poklikejte napopisek .

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

  3. V designeru klikněte na popisek1. V okně Vlastnosti nastavte následující vlastnosti.

    Vlastnost Změnit na
    Název lblDisplay
    textové (blank space)
    TextAlign MiddleCenter
    Velikost písma 14

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

    Vzhledem k tomu, že Timer je komponenta, nemá vizuální reprezentaci za běhu. Proto se nezobrazuje s ovládacími prvky na ploše návrháře, ale místo toho v Návrháři komponent (přihrádka v dolní části plochy návrháře).

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

    Vlastnost Interval řídí frekvenci, s jakou komponenta Timer tiká. Pokaždé, když timer1 tikne, se spustí kód v události timer1_Tick. Interval představuje počet milisekund mezi tiknutími.

  6. Vnávrháře komponent poklikejte na časovač1 přejděte na událost pro .

  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 mohla být přepsána pomocí klíčového slova 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. Kliknutím na Uložit vše v nabídce Soubor uložte projekt.

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

Ovládací prvek hodin teď zapouzdřuje ovládací prvek Label 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íklikněte pravým tlačítkem na ctlClock.csa potom klikněte na Zobrazit kód.

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

  2. Vyhledejte příkaz public partial class ctlClock. Pod levou složenou závorkou ({)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 ClockBackColor, dalším uživatelům tohoto ovládacího prvku. Příkazy get a set zajišťují ukládání a načítání hodnoty vlastnosti a také kód pro implementaci funkcionality odpovídající dané vlastnosti.

  4. V nabídce Soubor klikněte na Uložit vše pro uložení projektu.

Otestování ovládacího prvku

Ovládací prvky nejsou samostatné aplikace; musí být hostované v kontejneru. Otestujte běhové chování ovládacího prvku a testujte jeho vlastnosti s použitím UserControl Test Container. Další informace naleznete v tématu Postupy: Testování chování ovládacího prvku Run-Time UserControl.

Otestování ovládacího prvku

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

  2. V mřížce vlastností testovacího kontejneru vyhledejte vlastnost ClockBackColor a pak tuto vlastnost vyberte, aby se zobrazila paleta 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 vlastnost ClockForeColor 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ém ovládacím 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 pomocí ctlClock jako základ.

Dědění z kompozitní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 funkcionalitu ctlClock, a to 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íku řešeníklikněte pravým tlačítkem ctlClockLib, najeďte na Přidata potom klikněte na 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 komponentypoklikejte na ctlClock.

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

    Poznámka

    Do aktuálního projektu byl přidán soubor s názvem 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. Syntaxi deklarace vlastnosti teď použijete k přidání dvou vlastností do ovládacího prvku: AlarmTime, který uloží hodnotu data a času, kdy se má alarm vypnout, a AlarmSet, což bude indikovat, jestli je alarm nastaven.

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

  1. V Průzkumníku řešeníklikněte pravým tlačítkem myši na ctlAlarmClocka potom klikněte na Zobrazit kód.

  2. Vyhledejte příkaz public class. Všimněte si, že váš ovládací prvek je odvozen od 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řidejte do grafického rozhraní řízení

Zděděný ovládací prvek má vizuální rozhraní, které je stejné jako ovládací prvek jeho předka. 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. Máte možnost přidat do grafického rozhraní složeného ovládacího prvku stejným způsobem, jakým byste přidávali do jakéhokoli složeného ovládacího prvku. Pokud chcete pokračovat v rozšiřování vizuálního rozhraní budíku, přidáte ovládací prvek popisku, který bude blikat, když se alarm spustí.

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

  1. V Průzkumníku řešeníklikněte pravým tlačítkem na ctlAlarmClocka poté klikněte na Zobrazit návrhář.

    Návrhář pro ctlAlarmClock se 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 zastřené. To značí, že tyto vlastnosti jsou nativní pro lblDisplay a nelze je upravovat ani přistupovat v okně Vlastnosti. Ve výchozím nastavení jsou ovládací prvky obsažené ve složeném ovládacím prvku nastaveny na 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. Do svého složeného ovládacího prvku přidejte řízení Label.

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

    Vlastnost Nastavení
    název lblAlarm
    Text Alarm!
    TextAlign MiddleCenter
    viditelný 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 metody timer1_Tick u ctlClock a přidáním dalšího kódu rozšíříte funkcionalitu ctlAlarmClock, přitom zachováte všechny základní funkce ctlClock.

Aby bylo možné přepsat metodu timer1_Tick objektu ctlClock

  1. Veditoru kódu vyhledejte příkaz . Přímo pod něj přidejte následující prohlášení.

    private bool blnColorTicker;

  2. V Editoru kóduvyhledejte uzavírací 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 na použití této metody místo metody, která byla zděděna ze základního ovládacího prvku. Když je tato metoda volána, zavolá metodu, kterou nahrazuje, vyvoláním příkazu base.timer1_Tick a tím zajistí, že všechny funkce začleněné do původního ovládacího prvku jsou reprodukovány v tomto ovládacím 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 metody lblAlarm_Click přidáte kód.

Implementace metody vypnutí

  1. V Průzkumníku řešeníklikněte pravým tlačítkem na ctlAlarmClock.csa potom klikněte na 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
    Textové zakázat alarm

  3. V návrháři dvakrát klikněte na btnAlarmOff.

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

  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. Klikněte na Uložit vše v nabídce Soubor a projekt uložte.

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, ctlClock: Stisknutím klávesy F5 sestavíte projekt a spustíte ovládací prvek v kontejneruUserControl Test Container . Další informace naleznete v tématu Postupy: Testování chování Run-Time UserControl.

Pokud chcete ovládací prvek použít, budete ho muset hostovat ve formuláři. Stejně jako standardní složený ovládací prvek, nemůže zděděný složený ovládací prvek stát samostatně a musí být hostovaný ve formuláři nebo jiném kontejneru. Vzhledem k tomu, že ctlAlarmClock 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í vlastnosti AlarmTime u ctlAlarmClocka otestujete inherentní funkce této vlastnosti.

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 ctlClockLiba poté klepněte na tlačítko Sestavení.

  2. Do řešení přidejte nový projekt aplikace Windows Forms a pojmenujte ho Test.

  3. V Průzkumníku ř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 označenou Projekty. Váš projekt ctlClockLib bude uveden v části Název projektu. Dvojitým kliknutím na projekt přidáte odkaz do testovacího projektu.

  4. V Průzkumníku řešeníklikněte pravým tlačítkem na Testa potom klikněte na Sestavení.

  5. Vpanelu nástrojů rozbalte uzel ctlClockLib Components.

  6. Dvojitým kliknutím na ctlAlarmClock přidáte kopii ctlAlarmClock do formuláře.

  7. Vpanelu nástrojů vyhledejte a poklikejte na DateTimePickeru a přidejte do formuláře ovládací prvek a potom 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.

    Řízení Vlastnost Hodnota
    label1 Textové (blank space)
    Název lblTest
    dateTimePicker1 Název dtpTest
    formátu Time

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

    Otevře se do editoru kódu na private void dtpTest_ValueChanged.

  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íku řešeníklikněte pravým tlačítkem na Testa potom klikněte na Nastavit jako spouštěcí projekt.

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

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

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

  15. Pomocí klávesnice nastavte hodnotu minut, která je 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 nastavení alarmu, lblAlarm blikne.

  16. Vypněte alarm kliknutím na 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é