【学習】WinFormsでToolTipを使ってみよう(マウスオーバーでヒントを表示する)

これまでの学習では、
- ボタンやテキストボックスを配置する
- Label で説明文を表示する
という形でプログラムを動かしてきました。
しかし、説明文を常に表示すると画面がごちゃごちゃしてしまいます。
マウスを乗せたときだけヒントを表示する
という仕組みです。
今回は ToolTip(ツールチップ) を使って、コントロールにマウスを乗せると説明が表示されるようにします。
今日作るもの
保存 ボタンにマウスを乗せると
Ctrl+S で保存できます
と表示されます。開く ボタンに乗せると「ファイルを開きます」と表示されます。マウスを離すとヒントは消えます。
ソリューションとプロジェクトを作る
Visual Studio で新しいプロジェクトを作ります。
- テンプレート: Windows Forms アプリ (.NET Framework)
- ソリューション名: ToolTipSample
- プロジェクト名: ToolTipDemo
作成すると Form1 が表示されます。
フォームに配置するコントロール
フォームに次のものを配置します。
| コントロール | 名前 |
|---|---|
| Button | saveButton |
| Button | openButton |
| ToolTip | toolTip1 |
重要: ToolTip はフォーム上には表示されません。ツールボックスの「コンポーネント」から ToolTip をドラッグすると、フォーム下部のコンポーネントトレイに配置されます。
saveButton の Text を「保存」、openButton の Text を「開く」に設定します。
ToolTipの設定方法
ToolTip は各コントロールに個別にヒントを設定します。
方法1: プロパティで設定する
- saveButton を選択する
- プロパティウィンドウをスクロールして toolTip1 の ToolTip を探す
- 「Ctrl+S で保存できます」と入力する
同様に openButton には「ファイルを開きます」を設定します。
方法2: コードで設定する
toolTip1.SetToolTip(saveButton, "Ctrl+S で保存できます"); toolTip1.SetToolTip(openButton, "ファイルを開きます");
Form1 のコンストラクタや Load イベントで実行します。
完成コード(コードで設定する場合)
using System; using System.Windows.Forms; namespace ToolTipDemo { public partial class Form1 : Form { public Form1() { InitializeComponent(); toolTip1.SetToolTip(saveButton, "Ctrl+S で保存できます"); toolTip1.SetToolTip(openButton, "ファイルを開きます"); } private void saveButton_Click(object sender, EventArgs e) { MessageBox.Show("保存しました"); } private void openButton_Click(object sender, EventArgs e) { MessageBox.Show("ファイルを開きます"); } } }
プログラムの流れ
フォームが表示される ↓ SetToolTip で各ボタンにヒントを登録 ↓ ユーザーがマウスをボタンに乗せる ↓ ToolTip が自動でヒントを表示 ↓ マウスを離すとヒントが消える
重要ポイント
ToolTip は「マウスオーバーでヒントを表示する」 コンポーネントです。
- ToolTip はコンポーネントトレイに配置する(フォーム上には出ない)
- SetToolTip(コントロール, “ヒント文") でヒントを設定する
- プロパティの「toolTip1 の ToolTip」からも設定できる
- AutoPopDelay で表示時間を調整できる(ミリ秒)
- 画面をすっきり保ちつつ、必要なときにヘルプを出せる
発展:表示時間を変える
ToolTip を選択し、プロパティで次のように設定します。
| プロパティ | 値 | 説明 |
|---|---|---|
| AutoPopDelay | 5000 | 表示する時間(ミリ秒)デフォルトは約5000 |
| InitialDelay | 500 | 表示開始までの待ち時間(ミリ秒) |
| ReshowDelay | 100 | 別のコントロールから戻ったときの待ち時間 |
発展:ヒントを消す
特定のコントロールのヒントを解除するには、空文字を設定します。
toolTip1.SetToolTip(saveButton, "");
発展アイデア
ToolTip を使うと次のようなものも作れます。
- アイコンボタンの説明(何のボタンか分かりやすくする)
- 入力欄のヒント(例:「半角数字で入力してください」)
- ショートカットキーの案内
- エラー時の補足説明
ToolTip はユーザビリティを高めるための基本コンポーネントです。










ディスカッション
コメント一覧
まだ、コメントがありません