windowsフォームで大丈夫か？一番良いのを頼む。

Developers Summit 2011

Windowsフォームで大丈夫か？一番良いのを頼む。

グレープシティ株式会社

八巻雄哉 blog:d.hatena.ne.jp/Yamaki/

twitter:yamaki00


あれは今から36万…いや、4年前

デブサミ2007


Windowsアプリケーション開発に使用しているUI技術は？


1993年にVisual Basic向けのコンポーネントを販売開始

Microsoft社の開発プラットフォームで製品を提供し続けて17年のコンポーネントベンダー

多彩なラインナップを誇る製品群

日本仕様を強みとした自社開発製品

海外の優れた製品を日本語版としてローカライズ


グレープシティ製品利用者の割合

Windows

フォーム

73%

ASP.NET Web

フォーム

23%

WPF

2%

Silverlight

2%


MSDNビデオライブラリ Windowsでデスクトップアプリケーション開発を開始する


なぜWPF／Silverlightに移行しないのか？


デメリットとメリット

移行するコスト

移行するリスク

移行したことで得られるメリット

移行しないことによるリスク


デメリット＜メリット

移行するコスト

移行するリスク

移行したことで得られるメリット

移行しないことによるリスク


トラブルにあわないために

ちょっと待って！移行する前にまず確認


Visual Basic 6.0 Windowsフォーム WPF

サポート - ✓ ✓

64ビット - ✓ ✓

Visual Style - ✓ ✓

開発環境 Visual Basic 6.0 Visual Studio 2010 Visual Studio 2010

マネージコード - ✓ ✓

描画技術 GDI GDI／GDI+ Direct3D

ベクター描画 - - ✓

2D、3D、メディアの統合

- - ✓

UI記述 Visual Basic Visual Basic、C#… XAML

一般的な比較表


今回取り上げる要素

描画技術

UIレイアウト

業務コントロール

将来性


描画技術 Windowsフォームで大丈夫か？一番良いのを頼む。


描画パフォーマンス

WPFはGPUを活用しているから Windowsフォームよりも

描画パフォーマンスが良い

本当にそうなのか？


GPU性能の進化

スコアA：http://www.leoplanet.co.jp/3d_videochip.htm スコアB：http://mizushima.ne.jp/topic/GPU-benchmark/index.php

GPUはムーアの法則を超えるスピードで進化 GPU名スコアA スコアB 発売時期

Radeon 9800 (AGP) 27 998 2003年Q2

Radeon X1800 XT 100 5700 2005年11月

Radeon HD 2900 XT 240 11137 2007年5月

Radeon HD 4870 434 15943 2008年6月

ATI Radeon HD 5970 824 18533 2010年5月

GeForce 6800 47 2008 2004年Q4

GeForce 7900 GTX 150 6953 2006年3月

GeForce 8800 GT 262 12676 2007年11月

GeForce GTX 280 470 16257 2008年6月

GeForce GTX 580 965 18376 2010年11月

http://www.leoplanet.co.jp/3d_videochip.htm



http://mizushima.ne.jp/topic/GPU-benchmark/index.php






DEMO パフォーマンスコントロールの描画


即時モード vs 保持モード

Windowsフォーム（GDI、GDI+）

即時モード

WPF

保持モード


即時モード

命令型描画

アプリケーション自身が直接描画

描画命令の実行と実画面のフレームバッファへの描画が同期

ディスプレイの更新に同期させる手段は基本的にない実画面のフレームバッファ

アプリケーション

DrawText

DrawLine

DrawImage

GDI／GDI+


保持モード

データ駆動型描画

UIスレッドでは描画データを生成して格納（シリアル化）

描画スレッドでビジュアルオブジェクトをスキャンし、Direct3Dのバッファに描画（UIスレッドと非同期）

DirectXランタイムによりディスプレイの更新に同期

Direct3Dのサーフェス

Media Integration Layer （wpfgfx_v****.dll）

アプリケーション

ビジュアルオブジェクト

WPF


DEMO パフォーマンスコントロールの描画


DataGridのスクロール

Windows FormのDataGridViewでは問題なくできていた50列×1000行程度のデータの縦スクロールのパフォーマンスが非常に悪い


DEMO パフォーマンスデータグリッド


UIの仮想化

強力かつ柔軟なレイアウトシステムの特性

パネルに子要素が追加されるたびに、再帰的に子要素の大きさと位置の測定が行われる

リスト項目を大量に表示するコントロールでは、パフォーマンス負荷となる

画面に表示されている部分のオブジェクトのみを生成するのがUIの仮想化

レイアウトプロセスの負荷低減

メモリ使用量の削減


標準DataGrid vs FlexGrid

標準DataGrid

列方向にはUIの仮想化が行われない

FlexGrid

行と列の双方向にUIの仮想化が行われる


DEMO

パフォーマンスデータグリッド

Performance Profiling Tools for WPFで視る


フレックスグリッド

FlexGrid for WPF 1.0J

2011年夏発売予定

FlexGrid for Silverlight 1.0J

2011年3月14日発売予定

http://www.grapecity.com/japan/FlexgridSilverlight/demo/




WPFのパフォーマンス特性

ベンチマークのような絶対的なスピードはあまり意味がない

WPFのパフォーマンス特性を生かせるのは “Fluid UI”「なめらかなユーザーインターフェイス」

実際に簡単なプロトタイプを作って確認しよう


20年前に登場した技術「GDI」

グラフィックドライバモデルの大幅な変更

GDIハードウェアアクセラレーションの廃止

Windows 7で部分的に復活（ビットマップ転送系）

XP Display Driver Model（GDI）

XP Display Driver Model （DirectDraw／Direct3D）

ユーザーモード／カーネルモード境界

GDI32 DirectX ランタイム

GDI/GDI+ レガシーDirectX

Direct3D 9

カーネル／API

ドライバ

XPDM（Windows XP）

Windows Vista Display Driver Model（WDDM）（カーネル）

ユーザーモード／カーネルモード境界

DirectX ランタイム

Windows Vista Display Driver Model（WDDM）（ユーザー）

GDI／GDI+

レガシーDirectX

Direct3D 9

Direct3D 9 Ex

Direct3D 10

カーネル／API

ドライバ

WDDM（Windows Vista以降）


描画はDWMが管理 Windows Vista（WDDM 1.0）の場合 GDIアプリケーション

GDIアプリケーション

Direct3Dアプリケーション（WPF含む）

ＤＷＭ

描画イメージ

（ARGB形式）

描画イメージ

描画イメージ（ARGB形式）プロセス間共有

CPU描画

フレームバッファ（システムメモリ）

Direct3Dサーフェイス（ビデオメモリ）

バックバッファ

描画イメージ（ARGB形式）プロセス間共有

CPU描画

描画イメージ

（ARGB形式）

合成して更新

Present

フレームバッファ（システムメモリ）

プロセス間共有サーフェイス

隠しサーフェイス（ビデオメモリ）

サーフェス反転でリダイレクト

コピー

コピー


UIレイアウト Windowsフォームで大丈夫か？一番良いのを頼む。


画面解像度の多様化

1280x1024

1024x768 1280x800 1680x1050

1920x1080

1440x900

1366x768

1920x1200

1600x1200

1400x1050 1600x900

その他

2011年1月のグレープシティWebサイト訪問者における画面解像度の内訳


固定画面解像度

1024ピクセル

768ピ

クセ

ル

最大化／最小化ボタンは非表示


画面解像度比較

1920×1080 1280×1024

1024×768


WPFのレイアウト機能

相対配置

Grid、StackPanel、WrapPanel、DockPanel

領域の有効活用

GridSplitter、Expander、Visibility.Collapsed

ベクタ描画を活かした拡縮

ViewBox


DEMO WPFのレイアウト機能を使った業務アプリ画面


WPFのレイアウトのしくみ

パネル

子要素

利用可能サイズを通知子要素の各サイズ系プロパティが評価され、希望サイズが決定

希望サイズを取得

Measureメソッド

DesiredSizeプロパティ

測定パス

DesiredSizeプロパティ配置パス

子要素を配置し、サイズを決定


業務コントロール Windowsフォームで大丈夫か？一番良いのを頼む。


カスタマイズ性 vs コントロール数

Windowsフォーム

外観のカスタマイズ性が低い

細分化されたコントロールによる高い生産性

WPF

外観のカスタマイズ性が高い

標準で用意されているコントロールが少ない

業務アプリでは機能のカスタマイズが重要


業務アプリで使われるエディット系コントロール

Windowsフォーム WPF

テキスト TextBox TextBox

日付 DateTimePicker DatePicker

数値 NumericUpDown -

マスク MaskedTextBox -

数値やマスクといったコントロールが用意されていない

用意されているコントロールも機能不足


比較：日付入力コントロール

数字のみの入力 ✔ -

ドロップダウンカレンダー ✔ ✔

スピンボタンによる日付入力 ✔ -

時刻入力 ✔ -

Null値サポート - ✔

ドロップダウンボタンの外観


業務アプリで使われるエディット系コントロール

Windowsフォーム WPF InputMan for WPF

テキスト TextBox TextBox GcTextBox

日付 DateTimePicker DatePicker GcDateTime

数値 NumericUpDown - GcNumber

マスク MaskedTextBox - GcMask

InputManは日本仕様の業務系入力コントロール集

17年かけて培ってきたノウハウを結集

17年前のInputMan


比較：日付入力コントロール

数字のみの入力 ✔ - ✔

ドロップダウンカレンダー ✔ ✔ ✔

スピンボタンによる日付入力 ✔ - ✔

時刻入力 ✔ - ✔

Null値サポート - ✔ ✔

ドロップダウンボタンの外観

和暦、入力時／表示時の書式設定、入力候補、フィールド単位のフォーカス制御、…

- - ✔


DEMO 日本の業務に適したエディット系コントロール


インプットマン

InputMan for WPF 1.0J

2011年4月11日発売予定

InputMan for Silverlight 1.0J

発売中

http://tools.grapecity.com/demo/inputmansl/




将来性 Windowsフォームで大丈夫か？一番良いのを頼む。


将来性（噂レベルの話）

ARM “Windows next"

"Jupiter"

タブレット

.appx XAML technology

App Store

2012年

Visual Studio 2012


Windowsフォーム WPF

“Fluid UI” - ✓

UIレイアウト絶対配置が基本（追加コントロールによる相対配置）

相対配置が基本（絶対配置も可）

業務コントロール ✓ ✓（グレープシティ）

将来性 - ✓

ブラウザアプリケーション - ✓

アーキテクチャパターン - （イベント駆動型プログラミング）

MVVM

まとめ

windowsフォームで大丈夫か？一番良いのを頼む。

Technology