はじめに
「Windows phoneでテキストエディタを作ろう!」の4回目では,「検索」「置換」を実装します。
(テキストエディタと呼ばないかもしれませんが)Windows付属のメモ帳を参考に,デスクトップで動作しているテキストエディタの検索・置換と同等の機能を,どのようにしてWindows phoneアプリケーションに組み込むかを検討しながら実装を進めて行きましょう。
実装後のサンプルプログラムを用意しています。UIに手を入れていますので実際にVisual Studioのフォームデザイナを確認しながら追っていただければ,より理解が早いかと思います。
- サンプルプログラム(101KB)
検索機能のUIを検討する
メモ帳のメニューから検索を選択すると,検索専用のダイアログが表示されます。
テキストエディタに触ったことはありますか? 検索を行う時には,大抵文章が表示されているフォームとは別に小さなダイアログを表示し,文章を確認しながら検索ワードや置換ワードを入力していたのではないでしょうか。
今作っているアプリケーションでもメモ帳と同様に,小さなダイアログを表示して検索機能を設けたいところですが,Windows phoneアプリケーションのダイアログと言えば「Windows phoneでテキストエディタを作ろう!」の3回目で使用したOpenFileDialogのように全画面表示されてしまいます。
前述の通り,検索と置換は文章を確認しながら行いたいのでダイアログは使用せずに,テキストボックスの上部にパネルを用意し,そのパネル上から検索と置換の操作を行うようにしましょう。
検索・置換用のパネルの作成
フォームデザイナのツールボックスからPanelコントロールを選択し,TextBox上にPanelを配置します。Panelの以下のプロパティを変更します。
| Name | panelSearch |
|---|---|
| Dock | Top |
| Visible | False |
Visibleプロパティは,コントロールの表示・非表示を設定するプロパティです。アプリケーションの起動時点にこのパネルを表示させる必要はありませんので,Falseに設定します。
また,TextBoxよりもPanelを後に追加しているため,Panelが最前面に表示されTextBoxが隠れてしまっています。TextBoxを右クリックしポップアップから「最前面へ移動」を選択すると,TextBoxが適切に表示されます。
Panel上に検索ワード・置換ワードの入力欄や,実際に検索処理を行う為のボタン等のコントロールを配置しましょう。
それぞれのコントロールの名前は以下のように設定しました。
| textSearchWord | 検索ワードの入力欄 |
|---|---|
| textReplaceWord | 置換ワードの入力欄 |
| btnSearch | 検索・置換処理ボタン |
| btnPanelClose | パネル閉ボタン |
パネルの表示・非表示処理の実装
検索パネルへの各コントロールの配置が完了しましたので実装を進めて行きます。ここではパネルの表示・非表示処理の実装を行います。
検索と置換で同じパネルを共有して使いたいので,現在のモードを持って処理する内容を切り分けたいと思います。検索か置換かのパネルの状態を定義したPanelModeを定義し,現在の状態を持つPanelMode型の変数nowPanelModeを宣言します。
private enum PanelMode
{
Search, // 検索モード
Replace // 置換モード
}
private PanelMode nowPanelMode;
このnowPanelModeの状態に応じて処理を切り分けます。

