基本、デバイスには豊富な UI は必要ない…のかもしれませんが、Win IoT Core には WebView というコントロールがあります。WebView 自体はストアアプリにもあるので、どれだけ表示されるかは IoT Core の実装次第になるわけですが、RPi2 の場合はそれなりに GPU が使える（描画の高速化も売りにしている）ので、手軽に画像やテキストを表示させるための WebView にも期待したいところです。たぶん、DOM 解析もできるから HTML をダウンロードしてきてパースしたり、逆にリソースに含めてある HTML を読みだして jQuery で制御するという技も可能なはずです。
実験用アプリ
WebView を貼り付けた簡単なアプリを作っておきます。私の RPi の場合、USB マウス/キーボードの両方とも効かないで、PC から URL を送る仕組みを作っておきます。先日作った SimpleWebServer を利用してアドレスを送れるようにします。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | public sealed partial class MainPage : Page{ public MainPage() { this.InitializeComponent(); this.Loaded += MainPage_Loaded; } SimpleWebServer _server; private void MainPage_Loaded(object sender, RoutedEventArgs e) { _server = new SimpleWebServer(); _server.OnReceived += _server_OnReceived; _server.Start(); // this.webView.Navigate(new Uri(textUrl.Text)); } private async void _server_OnReceived(string data) { var url = data.Substring(1); // 最初の "/" のみ消す // GET 受信 await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, () => { textUrl.Text = url; this.webView.Navigate(new Uri(url)); }); // 応答を送信 _server.SendResponse("response: " + data); }} |
こんな風に送られてきたデータを、WebView.Navigate しているだけです。
いろいろ動かしてみる
ノーマルに自分の wordpress のサイトを表示させます。User Agenet がモバイルになっているらしく、スマートフォンの画面が表示されます。このあたりは、WebView のほうで指定が可能なはずです。
重たそうな microsoft.com を表示させます。中央のダイアログが出てきたところを見ると、Javascript が動いていることがわかりますね。ちなみに、マウスが動かないので、これ以上進めませんが（苦笑）。
どうせなので、Raspberrypi.org も表示させます。レイアウト崩れもないので、CSS がきちんと対応しているのでしょう。
twitter.com も表示できます。キーボードが無反応なので、投稿とかはできませんが、タイムラインが表示されているところをみると、Twitter API がきちんと呼び出されているようです。Win IoT は SSL/TLS 対応なので https も通ります。
ちょっと複雑なところで、SVGとjQueryで絵を描いているようなアニメーションを実装する方法 | 株式会社LIG にある SVG + jQuery のアニメーションを表示させます。えらく遅いですが、きれいに SVG と jQuery が動きます。これだけ動けば、たいていのサイトは表示できるのではないかと。
Youtube は HTML5 モードで動いているはずです。マウスでクリックできないので、動画が再生できるかどうかは不明なのですが（あちこちのサイトを探したけど、自動再生にはなりませんでした）、まあ、大丈夫なのでは。
実験的に mpeg 動画を自サイトにアップして表示させると、うまく動きます。読み込みに少々時間がかかりますが、きれいに動きているのでこれで十分かと。音声が出なかったのは、4線プラグのほうで出ているのか、HDMI の音声出力に対応していないのかは不明です。
これらは、WebView コントロール内で表示させているのですが、XAML 内に適当なコントロール（メディアコントロールなど）を貼り付けても動くと思います。Flash とか ogg は無理そうなので、そのあたりは今後の OSS 系のライブラリに期待です。C++/CX が使えるので、デコード関係のものを持ってくれば動くんじゃないですかね。ちなみに、プロジェクトは Universal で作っているので、そのまま Windows Phone や PC でも動作が可能です。この実験プログラム自体も、一度 PC 上で動作確認してから RPi2 で動かしています。
