RichTextBoxのボーダーライン(境界線)をフラットスタイルにする [C#]

System.Windows.Forms名前空間にあるRichTextBoxのボーダーライン(境界線)をフラットな線で表現します。

TextBoxコントロールの場合は、ApplicationクラスのEnableVisualStyles静的メソッドを呼び出すと、ビジュアルスタイルが適用され、コントロールの枠線がフラットスタイルで描画されます。

TextBoxコントロールのBorderStyleプロパティの値がBorderStyle.Fixed3Dの状態で表示
TextBoxコントロールのボーダーラインがビジュアルスタイルでフラット表示される画面のイメージ

しかし、RichTextBoxコントロールでは、ビジュアルスタイルを有効にしても、TextBoxコントロールのようにボーダーラインがフラットスタイルでは描画されません。

RichTextBoxコントロールのボーダーラインがビジュアルスタイルでフラット表示されない画面のイメージ

また、RichTextBoxコントロールでは、BorderStyleプロパティの値をBorderStyle.FixedSingleに設定し、固定でシングルライン(単一の罫線)にしようとしても、ボーダーラインはTextBoxのように固定の罫線にはなりません。(BorderStyle.Fixed3Dを指定した場合と変わりません。)

そこで今回は、WindowsフォームアプリケーションにRichTextBoxを配置するときにフラットスタイルに見えるようにする方法を紹介します。

本記事では、Visual Studioで作成したC#のWindowsフォームアプリケーションのプロジェクトに記述するコードを記載します。
Windowsフォームアプリケーションのプロジェクトを作成する方法については、以下の記事を参照してください。

Windowsフォームアプリケーションのプロジェクト(ソリューション)を作成する。[C#]
Visual StudioでC#のWindowsフォームアプリケーションのプロジェクト(ソリューション)を作成する方法を記載します。 ...

RichTextBoxコントロールのBorderStyle

RichTextBox自体にはフラットなボーダーラインを設定する方法がないので、RichTextBoxコントロールののBorderStyleプロパティはNone(なし)に設定します。

ボーダーライン(境界線)をどうやって表現するか

RichTextBoxのボーダースタイルは「なし」に設定しますので、別の方法でボーダーラインを表現する必要があります。
ボーダーラインを表現する方法はいくつかありますが、今回はコンテナコントロールのPanelコントロールを使用して、ボーダーを表現します。
PanelコントロールをRichTextBoxの親コンテナになるように配置し、リッチテキストボックスの替わりにボーダーラインを設定します。

フォームデザイン

フォームにはPanelコントロールを配置し、Panelコントロール内にRichTextBoxコントロールを配置します。

RichTextBoxコントロールの境界線(BorderStyle)をフラットにするサンプルフォームのデザイン

PanelコントロールのBorderStyleを使用する

Panelコントロールのボーダーライン(境界線)を利用して、RichTextBoxコントロールのボーダーラインを表現します。

プログラムソースコード

PanelコントロールのBorderStyleプロパティにBorderStyle.FixedSingleを指定します。
RichTextBoxコントロールのDockプロパティにはDockStyle.Fillを指定して、Panelコントロールのサイズ全体を埋めるようにします。

フォーム実行結果イメージ

上記のソースを記述したら、実行してフォームのイメージを確認します。

RichTextBoxコントロールの境界線(BorderStyle)をフラットにするサンプルフォームの実行イメージ

PanelコントロールのPaddingを使用する

PanelコントロールのBorderStyleプロパティにFixedSingleを設定することで、フラットなボーダーライン(境界線)を表現することができました。
単純な線を表示するだけであれば、これで問題ありませんが、境界線の色や境界線のサイズ(幅)を指定したい場合があるかもしれません。

プログラムソースコード

PanelコントロールのBorderStyleプロパティにはBorderStyle.Noneを指定しておきます。
ボーダーラインはPaddingプロパティのサイズを利用して幅を指定します。ボーダーラインの色はPanelコントロールのBackColorプロパティで設定します。
RichTextBoxコントロールのDockプロパティにはDockStyle.Fillを指定して、Panelコントロールのサイズ全体を埋めるようにします。

上記の例では、ボーダーラインの幅を「1」、色を「SystemColors.ActiveBorder」にして指定ます。

フォーム実行結果イメージ

フォームを実行して表示し、イメージを確認します。

RichTextBoxコントロールの境界線(BorderStyle)をフラットにするサンプルフォームの実行イメージ

ボーダーラインの幅と色を変更し、幅を「3」、色を「Magenta(マゼンタ)」に設定すると

以下のようなイメージになります。

RichTextBoxコントロールの境界線(BorderStyle)をフラットにするサンプルフォームの実行イメージ

PanelコントロールのPaddingプロパティとBackColorプロパティを使用して、ボーダーラインを設定する方法を使えば、リッチテキストボックスにフォーカスされている時(アクティブな時)とフォーカスされていない時(非アクティブ時)で、境界線の色を変更することができます。

RichTextBoxコントロールの余白の調整

RichTextBoxコントロールのBorderStyleプロパティをNoneに設定すると、コントロールの境界とテキストに余白が微妙に狭くなってしまいます。

RichTextBoxコントロールのボーダーライン有無での余白表示

フラットスタイルのボーダーラインを設定した場合
RichTextBoxコントロールのボーダーライン無しでの余白表示

ボーダーライン(境界線)を設定したPanelコントロールの枠と、テキストを入力する領域の余白が欲しい場合は、Panelコントロールを入れ子にすることで表現できます。ボーダーライン設定用のPanelコントロール内にPanelコントロールを配置し、更にその中にRichTextBoxコントロールを配置します。

RichTextBoxコントロールの余白設定フォームのデザイン

Panelコントロールを2重に配置することで、外側のPanelコントロールはボーダーライン設定用、内側のPanelコントロールは余白設定用に使うことができます。

プログラムソースコード

余白用のPanelコントロールのBackColorプロパティには、RichTextBoxコントロールのBackColorプロパティの値を設定し、余白用パネルとリッチテキストボックスを同じ背景色にしておきます。
余白はPaddingプロパティで設定します。

上記の例では、余白を「1」に設定しています。

RichTextBoxコントロールのボーダーライン(境界線)をフラットに設定して余白を1ピクセル確保したイメージ

余白を取りすぎると、スクロールバーが表示された際に、外枠との余白が目立ってしまいます。

余白「5」の場合の表示
RichTextBoxコントロールのボーダーライン(境界線)をフラットに設定して余白を5ピクセル確保したイメージ

余白「2」の場合の表示
RichTextBoxコントロールのボーダーライン(境界線)をフラットに設定して余白を2ピクセル確保したイメージ

外枠とテキストボックスの余白(Padding)は「1~2」ぐらいが適当ではないかと思います。