漫画 on Webのビューアに触発されて、Silverlight で作ってみよう、と思い立ちました。
Silverlight 3 のインストールが必要ですが、こんな感じ。
http://moonmile.net/sl/SampleMekuri/
ページの左半分をクリックすると前へ、右半分をクリックすると元に戻ります。
ソースの方は後で公開しますが、制作ポイントを話すと、
- Grid に囲まれた Image を 2枚用意する。
- マウスクリック時に、1枚目の Image をアニメーション。
- 2枚のImageをページに合うように差し替え
なことをしているだけです。
ページ自身は、見て分かるとおり画面のキャプチャで、サーバーに PNG 画像として置いてあり、適宜読み込んでいます。なので、１回目はちょっと重たい。２回目以降は、キャッシュが効いているので、スムースに読み込めます。
# このあたり、リソースからもできるはずなんだが、ひとまずサーバーから読み込み方式で実装
制作手順としては、
- めくり画像を用意
- 最初に、WPFアプリケーションでWindows上で実装。
- Expression Blend のタイムラインを使って、切り替えアニメを作成。
- １枚目から２枚目の切り替えを実装。
- 複数のページを切り替える方式に変更。
- マウスの右ボタン/左ボタンで、進む/戻るを実装。
- Silverlight アプリケーションを作成。
- XAML コードの移し替え
- C# のコードを移し替え
WPF と Silverlight で要素の扱いが若干違うので修正。 - Silverlight だと、マウスの左クリックしかないので、ページの右/左に変更。
- リソース読み込みから、サーバーのURI指定に変更。
- FTPでサーバーにアップして実験
な感じですね。
漫画の場合は、スキャナで読み込むので画像の切り替えだけで済みます。漫画の著作権なんかは、サーバーに画像データを置くので、通信時にしか使えないので大丈夫そう（トリッキーなことをすれば、抜けるかもしれませんが）。
iPhoneアプリと同じように、WPFアプリを作成してしまってPC上のローカル環境で動かすのも可能です。この場合は、WPFアプリ自身にDRMを確認するコードを入れるか、パスワード配布という方式が取れます。公開キー方式でも良いでしょう。
文章の場合には、（アイデアレベルですが）ブラウザ（WebBrowserコントロール）を内蔵させてしまうという手があります。ページ捲りをしたいので、ブラウザを2枚用意して、WPFの機能でめくるようにアニメーションさせます。
なところまで考えて作成。ここまで３時間弱ぐらい。
