PowerShellでGUI：WPFの部品をほぼ全て含むデモ公開
PowerShellとWPFでGUIを表示できることが分かり、Visual Studioを使うとWPFのGUIを簡単にプレビュー／設計できることが分かったので、WPFの全ての部品(コントロール)を試してみようと思い、デモプログラムを作成しました。下記がそのスクリーンショットです。
WpfZoo.ps (WPF部品の動物園)
- WPFの色々なコントロールを表示するデモプログラムです。
- 表示だけでなくクリックしたボタンの表示(画面下部に表示)等も行います。
- なお、下記はスクリーンショットなのでクリックできません、プログラムをgithub(最後の方に記載)からダウンロードし、実行して試してください。
TabItem1 (最初の画面、色々な部品を配置)
- ボタン、リスト、テーブル等をクリックしてみてください。
TabItem2 (色々な部品を配置)
- カレンダー、Expanderや、スライダーを試してみてください。
Tab for DocPanel (DocPanelのデモ)
- MenuItemや、画面左のTreeViewで項目を選択してみてください。
Frames (Frameのデモ)
- 画面上のボタンをクリックしてFrameを表示してみてください。
Media (MediaElementのデモ)
- 動画の再生、一時停止、再生ができます。
RichTextBox (RichTextBoxのデモ)
- 表示内容の書換、文字属性や文節属性の変更ができます。
- ただし「下付き」「上付き」は、数字以外は上手く行きません。(原因不明）
画面上の各WPF部品に対応するxamlの確認方法
- Visual StudioでWPFプロジェクトを新規作成(こことここを参照)
- Visual Studioの画面下部に表示されたxaml文字列の<Grid>と</Grid>で囲まれた部分を、プログラム内のxamlの<Grid>と</Grid>で囲まれた部分で置換
- 事前にxaml中の文字列PSScriptRootを、プログラムを置いたパスで置換
- これにより、プログラムと同様の画面がVisual Studioで表示される
- Visual Studioの画面上のWPF部品をクリックして選択すると、画面下部のxaml中で対応する行が選択されるので、WPF部品とxaml文字列の対応が分かる
WpfFrame*.ps (Frameのちゃんとしたデモ)
上記のうち、Frameは、単に表示するだけで、表示したFrameでのアクションは何もないものでした。これでは使えないので、Frameのデモも作成しました。下記がその画面です。あまり複雑な画面に見えませんが、分からないことが多く、結構苦労しました。
最初の画面
- 表示された画面左上の「スタート」をクリック
Frame内にPage1を表示
- 名前等を入力後、「次へ」をクリック
Frame内にPage2を表示
- 好きなフルーツを選択後、「次へ」をクリック
Frame内にPage3を表示
- 「上記内容を確認しました」をチェックし、「登録」をクリック
- 未チェックではエラーが出て、チェックするまで登録できない
Frame内にPage4を表示
- この後、更に「スタート」をクリックすると次の登録画面になる
- 補足情報
- 登録情報の履歴が、画面下に表示される（この欄はスクロール可能）
- 画面左上の「←」と「→」によって、画面を戻ったり、進めたりできる
- この際に、既に入力した情報は保存される
あとがき
参考になる情報もあり、WpfZooは結構簡単に作れたのですが、Frameは適切な例がなく、かなり苦労しました。しかし、苦労の過程で、Visual StudioでのWPF画面の確認方法や設計のコツ、PowerShell ISEでのデバッグ方法なども習得することができました。
