単純なカスタム コントロールを作成する

この記事では、カスタム Windows フォーム コントロールを作成する方法について説明します。 この記事で開発した単純なコントロールは、コントロールの Text をコントロールの左、中央、または右に出力します。 テキストの配置は変更できます。 このコントロールでは、イベントの発生や処理は行われません。

この記事では、次の方法について説明します。

• テキストの水平方向の配置設定を処理するプロパティとフィールドを追加します。
• OnTextChangedを使用してコントロールを無効にします。
• コントロールのサーフェイスにテキストを描画するコードを OnPaint メソッドに指定します。

カスタム コントロールの追加

最初の手順では、プロジェクトにカスタム コントロールを追加します。

1. Visual Studio で、[ ソリューション エクスプローラー ] ウィンドウを見つけます。 プロジェクトを右クリックし、[ 追加>新しい項目] を選択します。

   

2. カスタム コントロールを検索して選択します。

3. ファイル名を FirstControl に設定し、[ 追加] を選択します。

4. コントロールの デザイン モードが表示されている場合は、コード ビューに切り替えます。 F7 キーを押すか、コード ビュー への切り替えリンクを選択します。

   ヒント

   ソリューション エクスプローラー ウィンドウでファイルを右クリックし、[コードの表示] を選択することもできます。

次のスニペットのように、カスタム コントロールのソース コードを確認する必要があります。

public partial class FirstControl : Control
{
    public FirstControl()
    {
        InitializeComponent();
    }

    protected override void OnPaint(PaintEventArgs pe)
    {
        base.OnPaint(pe);
    }
}

Public Class FirstControl

    Protected Overrides Sub OnPaint(ByVal e As System.Windows.Forms.PaintEventArgs)
        MyBase.OnPaint(e)

        'Add your custom paint code here
    End Sub

End Class

プロパティを追加する

TextAlignmentという名前のコントロールに新しいプロパティを作成します。 このプロパティは、テキストがコントロールに描画される場所を調整します。 FirstControl クラスを使用して、次の手順を実行します。

1. _textAlignment型のHorizontalAlignmentという名前のフィールドを追加します。

   private HorizontalAlignment _textAlignment = HorizontalAlignment.Left;
   

   Private _textAlignment As HorizontalAlignment = HorizontalAlignment.Left
   

2. フィールドを TextAlignment という名前のプロパティでラップします。 プロパティを設定するときに、 Invalidate メソッドを呼び出して、コントロール自体を強制的に再描画します。

   public HorizontalAlignment TextAlignment
   {
       get => _textAlignment;
       set
       {
           _textAlignment = value;
           Invalidate();
       }
   }
   

   Public Property TextAlignment As HorizontalAlignment
       Get
           Return _textAlignment
       End Get
   
       Set(value As HorizontalAlignment)
           _textAlignment = value
           Invalidate()
       End Set
   End Property
   

3. 次の属性をプロパティに追加して、Visual Studio の [プロパティ] ウィンドウと統合します。

   • Category—プロパティに適用されるカテゴリ。

   • Description—プロパティの説明。

   • DefaultValue—プロパティの既定値。

     既定値を使用すると、デザイナーによってプロパティを リセット できます。 また、既定値がシリアル化されないため、プロパティを分離コードにシリアル化する必要があるタイミングを判断するのにも役立ちます。

   [System.ComponentModel.Category("Alignment"),
   System.ComponentModel.Description("Specifies the alignment of text."),
   System.ComponentModel.DefaultValue(HorizontalAlignment.Left)]
   public HorizontalAlignment TextAlignment
   

   <System.ComponentModel.Category("Alignment"),
   System.ComponentModel.Description("Specifies the alignment of text."),
   System.ComponentModel.DefaultValue(HorizontalAlignment.Left)>
   Public Property TextAlignment As HorizontalAlignment
   

変更されたテキストを処理する

TextAlignment プロパティはInvalidateを呼び出して、コントロール自体を再描画します。 これにより、コントロールの Text をレンダリングするときに、正しい配置が即座に使用されるようになります。 ただし、 Text プロパティが変更された場合、 Text は Invalidateを呼び出さないため、何も更新されません。 ただし、このプロパティは OnTextChanged メソッドを呼び出します。オーバーライドして Invalidate を呼び出し、コントロール自体を強制的に再描画することができます。

FirstControl クラスを使用して、次の手順を実行します。

1. OnTextChanged メソッドをオーバーライドします。
2. base.OnTextChangedを呼び出して、コントロールのコンシューマーが期待するように、TextChanged イベントが発生するようにします。
3. Invalidate メソッドを呼び出して、強制的に再描画します。

コードは次のスニペットのようになります。

protected override void OnTextChanged(EventArgs e)
{
    base.OnTextChanged(e);
    Invalidate();
}

Protected Overrides Sub OnTextChanged(e As EventArgs)
    MyBase.OnTextChanged(e)
    Invalidate()
End Sub

コントロールを描画する

カスタム コントロールの最後の部分は描画です。 FirstControl クラスを使用して、次の手順を実行します。

1. テンプレートによって生成された OnPaint メソッドを見つけます。 見つからない場合は、基底クラスからオーバーライド（上書き）します。

2. StringFormat という名前の新しい style 変数を作成します。

   StringFormat style = new();
   

   Dim style As New StringFormat
   

   System.Drawing.StringFormat型は、テキスト レイアウト情報をカプセル化し、配置へのアクセスを提供します。

3. TextAlignmentに基づいて、style.Alignment プロパティを適切な値に設定します。

   style.Alignment = TextAlignment switch
   {
       // Map the HorizontalAlignment enum to the StringAlignment enum
       HorizontalAlignment.Left => StringAlignment.Near,
       HorizontalAlignment.Right => StringAlignment.Far,
       HorizontalAlignment.Center => StringAlignment.Center,
       
       // Default to Near alignment
       _ => StringAlignment.Near
   };
   

   'Map the HorizontalAlignment enum to the StringAlignment enum
   Select Case TextAlignment
       Case HorizontalAlignment.Left
           style.Alignment = StringAlignment.Near
       Case HorizontalAlignment.Right
           style.Alignment = StringAlignment.Far
       Case HorizontalAlignment.Center
           style.Alignment = StringAlignment.Center
   End Select
   

4. Textを使用してGraphics.DrawStringプロパティを描画します。

   // Create the brush and automatically dispose it.
   using SolidBrush foreBrush = new(ForeColor);
   
   // Call the DrawString method to write text.
   // Text, Font, and ClientRectangle are inherited properties.
   pe.Graphics.DrawString(Text, Font, foreBrush, ClientRectangle, style);
   

   'Create the brush and automatically dispose it.
   Using foreBrush As New SolidBrush(ForeColor)
       'Call the DrawString method to write text.
       'Text, Font, and ClientRectangle are inherited properties.
       e.Graphics.DrawString(Text, Font, foreBrush, ClientRectangle, style)
   End Using
   

   重要

   Graphics.DrawString メソッドは、テキストの色にBrushを使用します。 Brushes 使用後に廃棄する必要があります。

   Graphics.DrawString メソッドでは、文字列を描画するために、テキスト、フォント、色、および書式設定オプションを使用します。

5. base.OnPaintを呼び出して、Paint イベントが発生していることを確認します。

   base.OnPaint(pe);
   

   MyBase.OnPaint(e)
   

6. コード ファイルを保存し、プロジェクトをコンパイルします。 プロジェクトのコンパイル後、Visual Designer を開くと、Visual Studio によってカスタム コントロールがツールボックス ウィンドウに追加されます。

コードは次のスニペットのようになります。

public partial class FirstControl : Control
{
    private HorizontalAlignment _textAlignment = HorizontalAlignment.Left;

    [System.ComponentModel.Category("Alignment"),
    System.ComponentModel.Description("Specifies the alignment of text."),
    System.ComponentModel.DefaultValue(HorizontalAlignment.Left)]
    public HorizontalAlignment TextAlignment
    {
        get => _textAlignment;
        set
        {
            _textAlignment = value;
            Invalidate();
        }
    }

    public FirstControl()
    {
        InitializeComponent();
    }

    protected override void OnTextChanged(EventArgs e)
    {
        base.OnTextChanged(e);
        Invalidate();
    }

    protected override void OnPaint(PaintEventArgs pe)
    {
        StringFormat style = new();

        style.Alignment = TextAlignment switch
        {
            // Map the HorizontalAlignment enum to the StringAlignment enum
            HorizontalAlignment.Left => StringAlignment.Near,
            HorizontalAlignment.Right => StringAlignment.Far,
            HorizontalAlignment.Center => StringAlignment.Center,
            
            // Default to Near alignment
            _ => StringAlignment.Near
        };

        // Create the brush and automatically dispose it.
        using SolidBrush foreBrush = new(ForeColor);

        // Call the DrawString method to write text.
        // Text, Font, and ClientRectangle are inherited properties.
        pe.Graphics.DrawString(Text, Font, foreBrush, ClientRectangle, style);

        base.OnPaint(pe);
    }
}

Public Class FirstControl

    Private _textAlignment As HorizontalAlignment = HorizontalAlignment.Left

    <System.ComponentModel.Category("Alignment"),
    System.ComponentModel.Description("Specifies the alignment of text."),
    System.ComponentModel.DefaultValue(HorizontalAlignment.Left)>
    Public Property TextAlignment As HorizontalAlignment
        Get
            Return _textAlignment
        End Get

        Set(value As HorizontalAlignment)
            _textAlignment = value
            Invalidate()
        End Set
    End Property

    Protected Overrides Sub OnTextChanged(e As EventArgs)
        MyBase.OnTextChanged(e)
        Invalidate()
    End Sub

    Protected Overrides Sub OnPaint(ByVal e As System.Windows.Forms.PaintEventArgs)
        Dim style As New StringFormat

        'Map the HorizontalAlignment enum to the StringAlignment enum
        Select Case TextAlignment
            Case HorizontalAlignment.Left
                style.Alignment = StringAlignment.Near
            Case HorizontalAlignment.Right
                style.Alignment = StringAlignment.Far
            Case HorizontalAlignment.Center
                style.Alignment = StringAlignment.Center
        End Select

        'Create the brush and automatically dispose it.
        Using foreBrush As New SolidBrush(ForeColor)
            'Call the DrawString method to write text.
            'Text, Font, and ClientRectangle are inherited properties.
            e.Graphics.DrawString(Text, Font, foreBrush, ClientRectangle, style)
        End Using
        MyBase.OnPaint(e)
    End Sub

End Class

関連コンテンツ

• カスタム コントロール
• System.Drawing.Graphics.DrawString
• System.Windows.Forms.HorizontalAlignment
• System.Windows.Forms.Control.OnPaint(PaintEventArgs)