川西 裕幸のブログ

Windows Graphics & Presentaiton Technologies for Developers

Browse by Tags

Tagged Content List
  • Blog Post: Mango Teapot ④ カメラ

    Mango Teapot は Windows Phone 7.5 の AR アプリケーション サンプルです。ソースコードは mangoteapot.codeplex.com にあります。 Silverlight と XNA によるグラフィックス デバイスの共有 Teapot クラス 加速度センサーとモーション カメラ Windows Phone 7.5 (“Mango”) ではプログラムからカメラを使うための PhotoCamera クラスが提供されています。Mango Teapot で使いたいのはプレビュー用のビデオです...
  • Blog Post: Mango Teapot ③ 加速度センサーとモーション

    Mango Teapot は Windows Phone 7.5 の AR アプリケーション サンプルです。ソースコードは mangoteapot.codeplex.com にあります。 Silverlight と XNA によるグラフィックス デバイスの共有 Teapot クラス 加速度センサーとモーション カメラ Windows Phone 7.5 (“Mango”) では、Windows Phone に搭載されているセンサー、加速度計・コンパス(方位計)・ジャイロスコープからデータを取得する Accelerometer...
  • Blog Post: Mango Teapot ② Teapot クラス

    Mango Teapot は Windows Phone 7.5 の AR アプリケーション サンプルです。ソースコードは MangoTeapot.codeplex.com にあります。 Silverlight と XNA によるグラフィックス デバイスの共有 Teapot クラス 加速度センサーと モーション カメラ 以前 Silverlight 5 (beta) で Teapot を描画 したとき、頂点バッファとインデックスバッファを基に Blinn-Phong シェーダーで描画する Teapot クラスを作成しました。そのときの Teapot...
  • Blog Post: Mango Teapot ① Silverlight と XNA によるグラフィックス デバイスの共有

    Windows Phone "Mango" では、Silverlight と XNA でグラフィックス デバイス(GPU サーフェイス)の共有が可能になっており、両方の API を使って同じ画面の描画ができるようになりました。また、カメラやコンパスや加速度計などさまざまなセンサーもアプリケーションから利用できるようになりました。 先日の「 Windows Phone "Mango" 開発支援セミナー 」用に、これらを活用したAR(Argument Reality)サンプル Mango Teapot を作成したので、その内容を数回に分けて解説します。 Mango Teapot は Windows...
  • Blog Post: Silverlight 5 (Beta) で Teapot + Blinn-Phong ⑥

    開発環境の準備と DrawingSurface Teapot クラス Blinn-Phong シェーダー 描画 トラックボール シェーダー パラメータの操作 スライダーで Blinn-Phong の光沢度(Shininess)を変更します。Blinn-Phong シェーダーではピクセルシェーダーで法線と等分角ベクトル(ハーフ ベクトル)の内積をべき乗しますがその指数が光沢度です。この光沢度は Teapot.cs でパブリック変数として持っている Shiness プロパティをピクセルシェーダー レジスターの第4成分(w)として渡しています。 specular.W = this .Shininess;...
  • Blog Post: Silverlight 5(Beta)で Teapot + Blinn-Phong ⑤

    開発環境の準備と DrawingSurface Teapot クラス Blinn-Phong シェーダー 描画 トラックボール シェーダー パラメータの操作 ティーポットをマウスで回転・拡大縮小するためのトラックボールを実装します。まず Visual Studio の[プロジェクト]→[クラスの追加]で TrackBall.cs を追加します。 トラックボールの実装 この実装は WPF のサンプルコードにあった TrackBall.cs を Silverlight 5 (Beta) 用に改造したものです。基本的な考え方はそのままですが...
  • Blog Post: Silverlight 5(Beta)で Teapot + Blinn-Phong ④

    開発環境の準備と DrawingSurface Teapot クラス Blinn-Phong シェーダー 描画 トラックボール シェーダー パラメータの操作 今回は MainPage.xaml.cs を実装します、これまで実装してきた Teapot クラスとコンパイル済み HLSL シェーダーを使って、ティーポットを描画します。 コンパイル済みシェーダーのロードと登録 まず DrawingSurface_Loade メソッドを実装します。ここでは2つのコンパイル済みシェーダーをストリームとしてロードして、シェーダーを生成し、デバイスに登録してから...
  • Blog Post: Silverlight 5(Beta)で Teapot + Blinn-Phong ③

    開発環境の準備と DrawingSurface Teapot クラス Blinn-Phong シェーダー 描画 トラックボール シェーダー パラメータの操作 Silverlight 5(Beta)の XNA には BasicEffect のような便利なクラスがないので、自前で頂点シェーダーとピクセルシェーダーをHLSL(Hight Level Shader Language)で書いて、コンパイルして、ロードして、デバイスに設定しなければなりません。ここでは Blinn-Phong シェーダーを実装して適用します。Silverlight 5 (Beta...
  • Blog Post: Silverlight 5(Beta)で Teapot + Blinn-Phong ②

    開発環境の準備と DrawingSurface Teapot クラス Blinn-Phong シェーダー 描画 トラックボール シェーダー パラメータの操作 DrawingSurface に描画する Teapot クラスを実装します。Silverlight 5 Beta の XNA には Model とか Mesh のような便利なクラスがないので、自前で頂点バッファとインデックス バッファを作り、DrawIndexedPrimitive で描画しなければなりません。非常にプリミティブな下位レベルの実装になります。 Visual Studio...
  • Blog Post: Silverlight 5(Beta)で Teapot + Blinn-Phong ①

    Silverlight 5(Beta)で GPU を使った XNA 互換の直接モード 3D が書けるようになったので、Blinn-Phongスペキュラーでシェーディングしたティーポットを表示させてみました。トラックボール クラスでマウス操作による回転縮小も実装しました。数回に分けて解説します。 開発環境の準備と DrawingSurface Teapot クラス Blinn-Phong シェーダー 描画 トラックボール シェーダー パラメータの操作 開発環境の準備 すでに Visual Studio 2010 がインストールされているという前提で話を進めます...
  • Blog Post: ピクセルシェーダー⑧ サンプルシェーダーコード

    これまで紹介してきたサンプル シェーダー コードをまとめて PsPad.codeplex に公開しました。 Gray.fx Ripple.fx Soble.fx Sharpen.fx ZoomBulr.fx
  • Blog Post: ピクセルシェーダー⑦ ZoomBlur

      単純なぼかしなら、 BlurEffect を使えばよいのでシェーダーを書く必要はありません。 決して BlurBitmapEffect を使ってはいけません (あまりに遅いため、WPF 4では機能しなくなりました)。 Shader Effect Library に面白いぼかし効果がありました。ある点にズームインして収束するようなぼかしをかけられる ZoomBlur です。これも一種の畳み込みなんでしょうか、ズームスケールに応じて15回サンプリングして平滑化しています。WPF側で C0 定数レジスターを変化させればズームイン アニメーションが作れます。マウスを右クリックしながら動かせば焦点の位置が変わります...
  • Blog Post: ピクセルシェーダー⑥ Sharpen フィルター

    Soble  フィルター で使った 3x3 のカーネルを使った畳み込みフィルターは画像処理によく使われます。今回は画像をシャープにする Sharpen フィルターの例を紹介しましょう。    元の画像                                                                 ...
  • Blog Post: ピクセルシェーダー⑤ Sobel フィルター

    今回からはピクセルシェーダーの実装例を紹介します。Sobel フィルターは輪郭抽出によく使われる畳み込みフィルターで、近傍のピクセルをサンプリングして、各ピクセルにカーネルと呼ばれる重みを乗算して加算します。 現在のピクセルの座標は uv 引数([0,1]で正規化)で渡されます。近傍のピクセルの位置を得るには画像のサイズが必要ですが、PsPad v1.0 には画像サイズを渡す定数レジスターが定義されていないので(v2.0で実装します!)、640 x 480 として位置を割り出しました。 float dx = 1.0/640.0; float dy = 1.0/480.0; 中心のピクセルは使わないので...
  • Blog Post: ピクセルシェーダー④ 定数レジスター

    次に Ripple.fx を使ってピクセルシェーダーの定数レジスターを WPF から使う方法を解説します。まず、 PsPad で Ripple.fx をロードし、Save Shader ボタンで、Ripple.ps を保存します。Silverlight でも使えるようにシェーダーモデル 2.0 ( PS2_0 )でコンパイルするときは、Ripple.fx の終わりの数行で、以下のように lighting 変数の定義と仕様をコメントアウトします。ライティングの効果がなくなりますが、あまり目立ちません。 float2 uv2 = center + distance * direction; ...
Page 1 of 1 (15 items)