WPFでは、いろいろな形のウィンドウが簡単に作れます。
今回は、ショッキングピンクのハート型ウィンドウを作ってみます。
1)まず、Expression Blendを起動すると、ようこそ画面が表示されますので、
[プロジェクト]タブ-[新しいプロジェクト]を選択します。
すると、新しい画面が開きます。
2)初期状態でウィンドウのサイズが、600x480になっており大きすぎるので、
左側[オブジェクトとタイムライン]の[ウィンドウ]を選択し、
右側、[プロパティ]タブを開き、[レイアウト]の[Width]を
640から480に変更します。すると、480x480のウィンドウになります。
3)左側の[四角形]ツールを押し続けると、[楕円]が出てきますので、
これを選択します。これで楕円をかけるようになります。
4)中央の[グリッドを表示]と[グリッド線への位置合わせ]のボタンを
どちらも表示する設定にしておきます。
5)画面の中央よりやや上あたりに、適当な大きさで、楕円を描きます。
6)[オブジェクト]メニュー-[パス]-[パスに変換]を選択すると、
選択されている楕円が、パスに変換されます。
7)左上から2番目、[直接選択]ツールを選択し、パスの上部分と下部分を
ともに、図のように下へずらします。
8)[直接選択]ツールで、[Alt]キーを押しながら、ハンドル(つかんで
パス形状を操作するためのもの)を動かして、ハート形を作っていきます。
[Alt]キーを押しながら、ハンドルを操作すると、角を作れます。
図のような配置、大きさにしてください。
9)レイアウトの、[Margin]右の[詳細プロパティ オプション]-[カスタム式]を
選択し、「20」と入力します。これにより、上下左右のマージンがすべて
20(ドット)に設定されます。
10)左側[オブジェクトとタイムライン]のWindowを選択し、右側、
[ブラシ]-[Background]をNo brushに設定します。
11)[外観]-[AllowsTransparency]のチェックを入れます。
ウィンドウの背景が透明になり、タイトルバーも消えます。
12)あとは、ハートのストローク(縁取り)を太くしたり、透明度の
設定([RGBA]の[A]を100%から70%にしたり)をしたり、ビットマップ
効果で、[グロー]をかけたりして、お好みに調整します。
13)[F5]キーを押すことにより、GUIのテストを行えます。
14)まだ移動はできません。終了するには、[Alt] + [F4]キーを
押します。
次回は、ウィンドウを移動できるようにしたいと思います。
(XAMLだけでは無理かな??→上のほうにマウスカーソルが
来たら、transparentをON/OFFすれば、タイトルバーがでてくるかな?)
投稿日時 : 2007年6月29日 1:19