C#でwebkit 〜webkit.net使ってみる編〜

C#webkitwebkit.netをを実際に使ってみようじゃないか〜


前回の記事webkit.netをビルドしました。
今回は実際にこれを使用してみましょうという記事になります。
ビルド方法が知りたい方は、上記のリンクからどうぞ。


では、さっそく使ってみましょう。
今回の環境はWindows7 64bit, C# 2010 Express Editionです。


とりあえず、Windowsフォームアプリケーションのプロジェクトを作成しましょう。
名前は適当にWebkitSampleとでもしておきましょう。

前回、32bitでビルドをしているので、
ビルドの構成を変更します。
ツールバー > ビルド > 構成マネージャー
を開き下記のように設定して下さい。
もし、X86が見当たらない場合は、
アクティブソリューションプラットフォームから新規作成して下さい。

f:id:alocoholic_babay:20130509135228p:plain

この設定をせずに、Any CPU等の構成で64bit環境で実行を行うと、

ファイルまたはアセンブリ 'WebKitBrowser, Version=0.5.0.0, Culture=neutral, PublicKeyToken=b967213f6d29a3be'、またはその依存関係の 1 つが読み込めませんでした。間違ったフォーマットのプログラムを読み込もうとしました。

の実行時エラーが発生します。


次にプロジェクトにフォルダを追加します。
ここではPackageという名前にしました。

f:id:alocoholic_babay:20130509132651p:plain


このフォルダに、前回作成した
webkitdotnet-develop\bin\Release\
内のファイルをコピーします。
(WebKitBrowserTest等のファイルは必要ありません。)
↓こんな感じです。

f:id:alocoholic_babay:20130509134150p:plain


これらのファイルはwebkit.netを使用するアプリケーションと同一の階層に存在する必要があります。
ビルドフォルダに直接設置しても良いのですが、
構成の変更時等に面倒くさいので、ちょっとおまじないをします。

事前準備として、まずソリューションを保存します。
ファイル > 名前を付けてWebkitSample(プロジェクト名)を保存
から適当な場所に保存して下さい。

保存が終わったら、プロジェクトのプロパティを開いて
ビルドイベントタブを開き
ビルド前に実行するコマンドラインに下記の文字列を設定して下さい。
もし、フォルダ名をPackage以外にしている場合は、自分の環境に合わせて変更して下さい。

copy $(ProjectDir)Package\*.* $(TargetDir)

f:id:alocoholic_babay:20130509135704p:plain

試しに、ビルドしてみましょう。
WebkitSample\bin\Debug
にファイルがコピーされていると思います。
構成をReleaseに変更した場合、自動的にbin/Releaseフォルダにコピーされます。

Failed to initialize activation contextと実行時エラー
が出る場合は、ビルドフォルダにファイルがコピーされている事を確認して下さい。


次の作業にうつります。
ソリューションエクスプローラ > 参照設定を右クリックし、参照の追加を行います。

参照タブを開き、Packageフォルダから
・WebKitBrowser.dll
・WebKitCore.dll

を選択します。


次にツールボックスを表示し、適当な場所を右クリックし
アイテムの選択をクリックします。
(ダイアログが表示されるまで結構時間がかかります。)

f:id:alocoholic_babay:20130509140740p:plain


参照ボタンをクリックし、PackageフォルダのWebKitBrowser.dllを選択します。
すると、ツールボックスにWebkitBrowserが追加されます。

f:id:alocoholic_babay:20130509141001p:plain


これをフォームにDrag & Dropしましょう。
↓こんな感じになります。

f:id:alocoholic_babay:20130509141506p:plain


これで使用準備は完了です。
実際に使ってみましょう。

フォームのコンストラクタを下記のように変更して下さい。

namespace WebkitSample
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
            webKitBrowser1.Navigate("http://google.com");
        }
    }
}

で、ビルドしましょう。

f:id:alocoholic_babay:20130509142100p:plain

(・ω・)< ヤッタ
無事に使えましたね!!


で、これを使って何をするの???

ただブラウザを作りたいのでしょうか。
世の中には、たくさんブラウザがあります。
自分で作ることはないでしょう。面倒ですし。


そして僕は思ったのです。
画面だけhtmlとCSS3とjQueryで作成して、ロジッックをC#で書けたらすごくね?便利じゃね?
と。


というわけで、C#とWebKitBrowserの相互通信を実現したパッケージを作成しました。
その名もPassioneBrowserKit
何ができるかというと、

・ブラウザ側で発生したイベント(例えばボタンのクリック)をC#側に通知できる。
C#側からブラウザ側のJavascriptを呼び出して、値の取得/設定が行える。

つまり、WindowsAPIをがっつり使いながらも、画面はhtmlとCSS3で描画するのでスーパーリッチなUIが実現できるのです。
たとえば、PCにインストールされているフォントをC#で取得して、
WebKitBrowserで表示させる。なんて事が簡単に実現可能です。


詳しくは、次回のブログに書きます。
先にソースコードだけ公開しておきます。
https://github.com/a-shinda/PassioneBrowserKit
ダウンロードしてビルドして実行すると、サンプルが起動します。
興味のある方は試してみて下さい。

質問等は、GitHubにメールアドレスがのっているので、そちらにお願いします。