사용자 컨트롤을 만드는 방법(Windows Form의 .NET)

  • 아티클

이 문서에서는 프로젝트에 사용자 컨트롤을 추가한 다음 양식에 해당 사용자 컨트롤을 추가하는 방법을 설명합니다. 시각적으로 매력적이고 기능적인 재사용 가능한 사용자 컨트롤을 만듭니다. 새 컨트롤은 컨트롤을 사용하여 TextBox 컨트롤을 그룹화합니다 Button . 사용자가 단추를 선택하면 텍스트 상자의 텍스트가 지워집니다. 사용자 컨트롤에 대한 자세한 내용은 사용자 컨트롤 개요를 참조하세요.

Important

.NET 7 및 .NET 6에 관한 데스크톱 가이드 설명서는 제작 중입니다.

프로젝트에 사용자 컨트롤 추가

Visual Studio에서 Windows Form프로젝트를 연 후 Visual Studio 템플릿을 사용하여 사용자 컨트롤을 만듭니다.

  1. Visual Studio에서 프로젝트 탐색기 창을 찾습니다. 프로젝트를 마우스 오른쪽 단추로 클릭하고 사용자 컨트롤 추가>(WindowsForm)를 선택합니다.

    Visual Studio 솔루션 탐색기를 마우스 오른쪽 단추로 클릭하여 Windows Form프로젝트에 사용자 컨트롤 추가

  2. 컨트롤의 이름을 ClearableTextBox로 설정하고 Add 키를 누릅니다.

    Windows Form용 Visual Studio의 항목 추가 대화 상자

사용자 컨트롤을 만든 후 Visual Studio에서 디자이너를 엽니다.

Windows Form용 Visual Studio의 사용자 제어 디자이너

지우기 가능한 텍스트 상자 디자인

사용자 컨트롤은 폼을 디자인하는 방법과 마찬가지로 디자인 화면에서 만드는 컨트롤인 구성 요소 컨트롤로 구성됩니다. 다음 단계에 따라 사용자 컨트롤 및 해당 구성 요소 컨트롤을 추가하고 구성합니다.

  1. 디자이너를 열면 사용자 컨트롤 디자인 화면이 선택된 개체여야 합니다. 그렇지 않은 경우 디자인 화면을 클릭하여 선택합니다. 속성 창에서 다음 속성을 설정합니다.

    속성 값
    MinimumSize 84, 53
    크기 191, 53

  2. 컨트롤을 추가합니다 Label . 다음과 같이 속성을 설정합니다.

    Property 값
    속성 lblTitle
    위치 3, 5

  3. 컨트롤을 추가합니다 TextBox . 다음과 같이 속성을 설정합니다.

    Property 값
    속성 txtValue
    기준 위치 Top, Left, Right
    위치 3, 23
    크기 148, 23

  4. 컨트롤을 추가합니다 Button . 다음과 같이 속성을 설정합니다.

    Property 값
    속성 btnClear
    기준 위치 Top, Right
    위치 157, 23
    크기 31, 23
    Text ↻

    컨트롤은 다음 이미지와 같이 표시됩니다.

    방금 디자인된 사용자 컨트롤을 보여 주는 Windows Form가 있는 Visual Studio.

  5. F7 키를 눌러 클래스의 코드 편집기를 ClearableTextBox 엽니다.

  6. 다음과 같이 코드 변경을 합니다.

    1. 코드 파일의 맨 위에서 네임스페이스를 System.ComponentModel 가져옵니다.

    2. 클래스에 DefaultEvent 특성을 추가합니다. 이 특성은 디자이너에서 컨트롤을 두 번 클릭할 때 소비자가 생성하는 이벤트를 설정합니다. 이 컨트롤을 선언하고 사용하는 개체인 소비자입니다.

      using System.ComponentModel;

namespace UserControlProject
{
    [DefaultEvent(nameof(TextChanged))]
    public partial class ClearableTextBox : UserControl

      Imports System.ComponentModel

<DefaultEvent("TextChanged")>
Public Class ClearableTextBox

    3. 소비자에게 이벤트를 전달하는 이벤트 처리기를 추가합니다 TextBox.TextChanged .

      [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

      이벤트에 선언된 특성이 Browsable 있습니다. Browsable 이벤트 또는 속성에 적용되면 디자이너에서 컨트롤을 선택할 때 속성 창에 항목이 표시되는지 여부를 제어합니다. 이 경우 true 이벤트가 표시되어야 함을 나타내는 특성에 매개 변수로 전달됩니다.

    4. 소비자에게 속성을 전달하는 문자열 Text속성을 추가합니다 TextBox.Text .

      [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. 소비자에게 속성을 전달하는 문자열 Title속성을 추가합니다 Label.Text .

      [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. 디자이너로 ClearableTextBox 다시 전환하고 컨트롤을 btnClear 두 번 클릭하여 이벤트에 대한 처리기를 생성합니다 Click . 처리기에 다음 코드를 추가하여 텍스트 상자를 지웁니다 txtValue .

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

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

  8. 마지막으로 솔루션 탐색기 창에서 프로젝트를 마우스 오른쪽 단추로 클릭하고 빌드를 선택하여 프로젝트를 빌드합니다. 오류가 없어야 하며 빌드가 완료되면 ClearableTextBox 사용할 도구 상자에 컨트롤이 나타납니다.

다음 단계는 폼에서 컨트롤을 사용하는 것입니다.

샘플 애플리케이션

마지막 섹션에서 새 프로젝트를 만든 경우 1이라는 빈 Form 프로젝트가 Form있고, 그렇지 않으면 새 양식을 만듭니다.

  1. 솔루션 탐색기 창에서 폼을 두 번 클릭하여 디자이너를 엽니다. 폼의 디자인 화면을 선택해야 합니다.

  2. 폼의 Size 속성을 .로 432, 315설정합니다.

  3. 도구 상자 창을 열고 ClearableTextBox 컨트롤을 두 번 클릭합니다. 이 컨트롤은 프로젝트의 이름을 따서 명명된 섹션 아래에 나열되어야 합니다.

  4. 다시 한 번 ClearableTextBox 컨트롤을 두 번 클릭하여 두 번째 컨트롤을 생성합니다.

  5. 디자이너로 다시 이동하고 두 컨트롤을 모두 볼 수 있도록 컨트롤을 분리합니다.

  6. 하나의 컨트롤을 선택하고 다음 속성을 설정합니다.

    속성 값
    속성 ctlFirstName
    위치 12, 12
    크기 191, 53
    타이틀 First Name

  7. 다른 컨트롤을 선택하고 다음 속성을 설정합니다.

    속성 값
    속성 ctlLastName
    위치 12, 71
    크기 191, 53
    타이틀 Last Name

  8. 도구 상자 창으로 돌아가서 폼에 레이블 컨트롤을 추가하고 다음 속성을 설정합니다.

    속성 값
    속성 lblFullName
    위치 12, 252

  9. 다음으로, 두 사용자 컨트롤에 대한 이벤트 처리기를 생성해야 합니다. 디자이너에서 컨트롤을 ctlFirstName 두 번 클릭합니다. 이 작업은 이벤트에 대한 TextChanged 이벤트 처리기를 생성하고 코드 편집기를 엽니다.

  10. 디자이너로 다시 교환하고 컨트롤을 ctlLastName 두 번 클릭하여 두 번째 이벤트 처리기를 생성합니다.

  11. 디자이너로 다시 교환하고 양식의 제목 표시줄을 두 번 클릭합니다. 이 작업은 이벤트에 대한 이벤트 처리기를 생성합니다 Load .

  12. 코드 편집기에서 .라는 UpdateNameLabel메서드를 추가합니다. 이 메서드는 두 이름을 결합하여 메시지를 만들고 컨트롤에 메시지를 lblFullName 할당합니다.

    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. 두 TextChanged 이벤트 처리기의 경우 다음 메서드를 호출합니다 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. 마지막으로 폼의 UpdateNameLabel 이벤트에서 메서드를 호출합니다 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

프로젝트를 실행하고 이름과 성을 입력합니다.

사용자 컨트롤에서 만든 두 개의 텍스트 상자와 레이블이 있는 Windows Form앱입니다.

단추를 눌러 ↻ 텍스트 상자 중 하나를 다시 설정해 봅니다.