2007年6月2日土曜日

Aero Glass

すりガラス効果がついたウィンドウ


Vistaっぽいウィンドウにしているこの「すりガラス」とか「半透明」の効果、

実は2種類あった。

クライアント領域(アプリケーションウィンドウ内)での描写技術としてのWPFと
ウィンドウ同士の合成技術としてのWin32は別々のもの

つまり、↓こんなのはWPFの半透明で










円が透けて、下に赤い四角とボタンが見える


メディアプレイヤーの↓こんなやつはWin32のDWM(Desktop Window Manager)




WPF単体でも、ウィンドウのStyleをnoneにしてAllowTransparentをtureにすればウィンドウの下まで見える、半透明ウィンドウができるけど、DWMを使うとそのマシンに設定された枠で半透明になるのがちょっと違う。

で、最初のやつを背景(Window.Background を No brush)にして、DWMで半透明にすると、
↓こんな感じになる










ただし、ローカルでAeroが切られていると・・・










ちょっとカワイソウなことに・・・ま、デフォルトで斜めにグラデーションが入っているからそんなにみっともなくはない?

コード的には GlassHelperというDWMを叩くクラスを作って、

using System;
using System.Collections.Generic;
using System.Text;
using System.Windows;
using System.Windows.Media;
using System.Windows.Interop;
using System.Runtime.InteropServices;

namespace AeroGlass
{
class GlassHelper
{
public static bool ExtendGlassFrame(Window window, Thickness margin)
{
if (!DwmIsCompositionEnabled())
return false;

IntPtr hwnd = new WindowInteropHelper(window).Handle;
if (hwnd == IntPtr.Zero)
throw new InvalidOperationException("ガラス効果を加える前にウィンドウを表示せよ");

window.Background = Brushes.Transparent;
HwndSource.FromHwnd(hwnd).CompositionTarget.BackgroundColor = Colors.Transparent;

MARGINS margins = new MARGINS(margin);
DwmExtendFrameIntoClientArea(hwnd, ref margins);
return true;
}

struct MARGINS
{
public MARGINS(Thickness t)
{
Left = (int)t.Left;
Right = (int)t.Right;
Top = (int)t.Top;
Bottom = (int)t.Bottom;
}
public int Left;
public int Right;
public int Top;
public int Bottom;
}

// DWM の dll をロード
[DllImport("dwmapi.dll", PreserveSig = false)]
static extern void DwmExtendFrameIntoClientArea(IntPtr hwnd, ref MARGINS margins);

[DllImport("dwmapi.dll", PreserveSig = false)]
static extern bool DwmIsCompositionEnabled();

}
}



OnSourceInitialized をオーバーライドして実行

protected override void OnSourceInitialized(EventArgs e)
{
base.OnSourceInitialized(e);
GlassHelper.ExtendGlassFrame(this, new Thickness(-1));
}

2007年5月13日日曜日

Silverlight

 WPF をマルチプラットフォームへ・・・




 WPFをググってるとちょこちょこ顔を出すこの"Silverlight"

一体何者かというと、WPF Everywhere ということで、Windows 以外のOSでも

WPFの技術を使えるようにしようというもので、

"Silverlight は次世代の.NETベースのメディア及びリッチインタラクティブWebアプリケーションへの橋渡しとなるクロスブラウザー・クロスプラットフォームのプラグインです。"

とのこと。

WPF開発の定番Blend + Visual Studio 2005 の次バージョンにSilverlightが組み込まれるようで、

既に、Blend 2 + 次Visual Studio(Orcas) のセットがリリースされていた!

(最近Blend のベータがいつの間にかRCになっていたとビックリしたのに・・・)

Adobeの"Apollo"といい、時代の流れはマルチプラットフォーム - OSのみならずブラウザまでも - ということか。

2007年5月12日土曜日

Animation by Blend

Microsoft Expression Blend でつくるアニメーション


キーワードは「Event」と「Triger」。

あるイベント(ClickとかMouseDownとか)をアニメーション開始のトリガーとして設定。そしてそのトリガーは何のアニメーション(ストーリーボード)の引き金なのかを指定することにより実現する。


【ポイント】イベントにしたい要素(たとえばボタン)を指定(アクティブ)にしてから、"Triggers"の"+Event"をクリックする

そうすると、下段に
When "要素" "イベント" is raised
と表示される。





 ここでは左上のボタン「testButton」の「Click」を「testButtonClick」というストーリーボードのトリガーとして指定








 
 そうすると動画編集アプリみたいなものになる。

 ※プレビュー画面が赤い枠で囲まれている状態がアニメーションを編集している状態。





アニメーションは特定の瞬間の状態を定義するだけで、自動的にその間を埋めてくれる。
ここでは、ボタンをクリックされてから1秒後と4秒後のメインウィンドウの背景を変更

 

これで出来上がり♪