Vytvoření uživatelského ovládacího prvku (Windows Forms .NET)

Tento článek vás naučí, jak do projektu přidat uživatelský ovládací prvek a pak ho přidat do formuláře. Vytvoříte opakovaně použitelný uživatelský ovládací prvek, který je vizuálně atraktivní i funkční. Nový ovládací prvek seskupí TextBox ovládací prvek pomocí Button ovládacího prvku. Když uživatel tlačítko vybere, text v textovém poli se vymaže. Další informace o uživatelských ovládacích prvcích naleznete v tématu Přehled uživatelských ovládacích prvků.

Důležité

Dokumentace k desktopové příručce pro .NET 7 a .NET 6 se právě připravuje.

Přidání uživatelského ovládacího prvku do projektu

Po otevření projektu Windows Formv sadě Visual Studio pomocí šablon sady Visual Studio vytvořte uživatelský ovládací prvek:

1. V sadě Visual Studio vyhledejte okno Průzkumníka projektů. Klikněte pravým tlačítkem myši na projekt a zvolte Přidat>uživatelský ovládací prvek (Windows Forms).

   

2. Nastavte název ovládacího prvku na VymazatelnýTextBox a stiskněte Přidat.

   

Po vytvoření uživatelského ovládacího prvku visual Studio otevře návrháře:

Návrh nezaškrtnutelného textového pole

Uživatelský ovládací prvek se skládá ze základních ovládacích prvků, což jsou ovládací prvky , které vytvoříte na návrhové ploše, stejně jako způsob návrhu formuláře. Pokud chcete přidat a nakonfigurovat uživatelský ovládací prvek a jeho základní ovládací prvky, postupujte takto:

1. Při otevření návrháře by návrhová plocha uživatelského ovládacího prvku měla být vybraným objektem. Pokud není, vyberte ho kliknutím na návrhovou plochu. V okně Vlastnosti nastavte následující vlastnosti:

   Vlastnost	Hodnota
   Minimumsize	84, 53
   Velikost	191, 53

2. Label Přidejte ovládací prvek. Nastavte následující vlastnosti:

   Vlastnost	Hodnota
   Name	lblTitle
   Umístění	3, 5

3. TextBox Přidejte ovládací prvek. Nastavte následující vlastnosti:

   Vlastnost	Hodnota
   Name	txtValue
   Záložka	Top, Left, Right
   Umístění	3, 23
   Velikost	148, 23

4. Button Přidejte ovládací prvek. Nastavte následující vlastnosti:

   Vlastnost	Hodnota
   Name	btnClear
   Záložka	Top, Right
   Umístění	157, 23
   Velikost	31, 23
   Text	↻

   Ovládací prvek by měl vypadat jako na následujícím obrázku:

   

5. Stisknutím klávesy F7 otevřete editor kódu pro ClearableTextBox třídu.

6. Proveďte následující změny kódu:

   1. V horní části souboru kódu naimportujte System.ComponentModel obor názvů.

   2. DefaultEvent Přidejte atribut do třídy. Tento atribut nastaví událost vygenerovanou příjemcem, když je ovládací prvek poklikání v návrháři. Příjemce je objekt deklarující a používá tento ovládací prvek.

      using System.ComponentModel;
      
      namespace UserControlProject
      {
          [DefaultEvent(nameof(TextChanged))]
          public partial class ClearableTextBox : UserControl
      

      Imports System.ComponentModel
      
      <DefaultEvent("TextChanged")>
      Public Class ClearableTextBox
      

   3. Přidejte obslužnou rutinu události, která předá TextBox.TextChanged událost příjemci:

      [Browsable(true)]
      public new event EventHandler? TextChanged
      {
          add => txtValue.TextChanged += value;
          remove => txtValue.TextChanged -= value;
      }
      

      <Browsable(True)>
      Public Shadows Custom Event TextChanged As EventHandler
          AddHandler(value As EventHandler)
              AddHandler txtValue.TextChanged, value
          End AddHandler
          RemoveHandler(value As EventHandler)
              RemoveHandler txtValue.TextChanged, value
          End RemoveHandler
          RaiseEvent(sender As Object, e As EventArgs)
      
          End RaiseEvent
      End Event
      

      Všimněte si, že událost má Browsable atribut deklarovaný v ní. Browsable Při použití na událost nebo vlastnost určuje, zda je položka viditelná v okně Vlastnosti, když je ovládací prvek vybrán v návrháři. V tomto případě se předá atributu jako parametr označující, true že událost by měla být viditelná.

   4. Přidejte řetězcovou vlastnost s názvem Text, která předá TextBox.Text vlastnost příjemci:

      [Browsable(true)]
      public new string Text
      {
          get => txtValue.Text;
          set => txtValue.Text = value;
      }
      

      <Browsable(True)>
      Public Shadows Property Text() As String
          Get
              Return txtValue.Text
          End Get
          Set(value As String)
              txtValue.Text = value
          End Set
      End Property
      

   5. Přidejte řetězcovou vlastnost s názvem Title, která předá Label.Text vlastnost příjemci:

      [Browsable(true)]
      public string Title
      {
          get => lblTitle.Text;
          set => lblTitle.Text = value;
      }
      

      <Browsable(True)>
      Public Property Title() As String
          Get
              Return lblTitle.Text
          End Get
          Set(value As String)
              lblTitle.Text = value
          End Set
      End Property
      

7. Přepněte zpět do návrháře ClearableTextBox a poklikáním na btnClear ovládací prvek vygenerujte obslužnou rutinu Click události. Přidejte následující kód pro obslužnou rutinu, který vymaže txtValue textové pole:

   private void btnClear_Click(object sender, EventArgs e) =>
       Text = "";
   

   Private Sub btnClear_Click(sender As Object, e As EventArgs)
       txtValue.Text = ""
   End Sub
   

8. Nakonec projekt sestavíte tak, že v okně Průzkumník řešení kliknete pravým tlačítkem na projekt a vyberete Sestavit. Nemělo by dojít k žádným chybám a po dokončení ClearableTextBox sestavení se ovládací prvek zobrazí v sadě nástrojů pro použití.

Dalším krokem je použití ovládacího prvku ve formuláři.

Ukázková aplikace

Pokud jste v poslední části vytvořili nový projekt, máte prázdný Form název Form1, jinak vytvořte nový formulář.

1. V okně Průzkumník řešení otevřete návrháře poklikáním na formulář. Měla by být vybrána návrhová plocha formuláře.

2. Nastavte vlastnost formuláře Size na 432, 315hodnotu .

3. Otevřete okno Panel nástrojů a poklikejte na ovládací prvek VymazatelnýTextBox. Tento ovládací prvek by měl být uvedený v oddílu pojmenovaném po projektu.

4. Znovu poklikejte na ovládací prvek Vymazat,TextBox aby se vygeneroval druhý ovládací prvek.

5. Vraťte se k návrháři a oddělte ovládací prvky, abyste viděli oba ovládací prvky.

6. Vyberte jeden ovládací prvek a nastavte následující vlastnosti:

   Vlastnost	Hodnota
   Name	ctlFirstName
   Umístění	12, 12
   Velikost	191, 53
   Nadpis	First Name

7. Vyberte druhý ovládací prvek a nastavte následující vlastnosti:

   Vlastnost	Hodnota
   Name	ctlLastName
   Umístění	12, 71
   Velikost	191, 53
   Nadpis	Last Name

8. Zpět v okně Panel nástrojů přidejte do formuláře ovládací prvek popisku a nastavte následující vlastnosti:

   Vlastnost	Hodnota
   Name	lblFullName
   Umístění	12, 252

9. Dále je potřeba vygenerovat obslužné rutiny událostí pro dva uživatelské ovládací prvky. V návrháři poklikejte na ctlFirstName ovládací prvek. Tato akce vygeneruje obslužnou rutinu události pro TextChanged událost a otevře editor kódu.

10. Přepněte zpět do návrháře a poklikáním na ctlLastName ovládací prvek vygenerujte druhou obslužnou rutinu události.

11. Přepněte zpět na návrháře a poklikejte na záhlaví formuláře. Tato akce vygeneruje obslužnou rutinu Load události pro událost.

12. V editoru kódu přidejte metodu s názvem UpdateNameLabel. Tato metoda kombinuje obě názvy k vytvoření zprávy a přiřadí zprávu ovládacímu lblFullName prvku.

    private void UpdateNameLabel()
    {
        if (string.IsNullOrWhiteSpace(ctlFirstName.Text) || string.IsNullOrWhiteSpace(ctlLastName.Text))
            lblFullName.Text = "Please fill out both the first name and the last name.";
        else
            lblFullName.Text = $"Hello {ctlFirstName.Text} {ctlLastName.Text}, I hope you're having a good day.";
    }
    

    Private Sub UpdateNameLabel()
        If String.IsNullOrWhiteSpace(ctlFirstName.Text) Or String.IsNullOrWhiteSpace(ctlLastName.Text) Then
            lblFullName.Text = "Please fill out both the first name and the last name."
        Else
            lblFullName.Text = $"Hello {ctlFirstName.Text} {ctlLastName.Text}, I hope you're having a good day."
        End If
    End Sub
    

13. U obou TextChanged obslužných rutin událostí volejte metodu UpdateNameLabel :

    private void ctlFirstName_TextChanged(object sender, EventArgs e) =>
        UpdateNameLabel();
    
    private void ctlLastName_TextChanged(object sender, EventArgs e) =>
        UpdateNameLabel();
    

    Private Sub ctlFirstName_TextChanged(sender As Object, e As EventArgs) Handles ctlFirstName.TextChanged
        UpdateNameLabel()
    End Sub
    
    Private Sub ctlLastName_TextChanged(sender As Object, e As EventArgs) Handles ctlLastName.TextChanged
        UpdateNameLabel()
    End Sub
    

14. Nakonec volejte metodu UpdateNameLabel z události formuláře Load :

    private void Form1_Load(object sender, EventArgs e) =>
        UpdateNameLabel();
    

    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        UpdateNameLabel()
    End Sub
    

Spusťte projekt a zadejte jméno a příjmení:

Zkuste stisknout ↻ tlačítko a resetovat jedno z textových polí.