描画ライブラリScenic紹介

Transcript

1. 描画ライブラリScenic紹介 2022/09/24 NervesJP #29
2. 今日のおしながき • Scenic の紹介 ◦ 細かい使い方はふみこまず、雰囲気を掴みます 🦾 （使い方が気になる人は ↓ ▪ ElixirでGUI・Scenic [入門編１] ▪ ElixirでGUI・Scenic [入門編２]
3. What’s Scenic? • > Scenic is primarily aimed at fixed screen connected devices (IoT) ◦ https://github.com/ScenicFramework/scenic/blob/master/README.md#core-scenic-librar y • > In fact, this is the type of system that Scenic was made for! ◦ this => Nerves ◦ https://hexdocs.pm/scenic/getting_started_nerves.html （主にNerves向けに作られた）表示機に描画するライブラリ！！
4. サイネージ？ • バスのサイネージ • 電車のサイネージ • 市役所のサイネージ などなど、様々な場所で利用されるサイネージがあります。
5. どんなことができるのか？ example 紹介
13. なぜ通常の Linux の画面出力ではないの？ • サイネージなどの表示機は全画面表示させたい • ユーザーに操作をされたくない • グラフィックに割くコンピュータリソースをサイネージに絞りたい ◦ SBCの性能面の考慮、他 GUIアプリにリソースを割きたくない などがあるためと思います
14. 実際にさわってみる（詳細にふみこまずに • 必要な前準備 ◦ https://hexdocs.pm/scenic/install_dependencies.html ▪ Ubuntu と Windows は試しました • Windows は 上のリンクと以下を参考に（ WSL と X Server の連携させる点が注意 ◦ https://itcweb.cc.affrc.go.jp/affrit/_media/documents/guide/x-window/x- win-wsl.pdf ◦ https://twitter.com/pojiro3/status/1573562918138150914 • 以下をクローンして、mix deps.get, iex -S mix ◦ https://github.com/pojiro/hello_scenic ▪ Nerves があっても無くても動かせるリポジトリ • どのように作ったかは git log でおえるはず（🙏
15. Example を改造して、 AHT20の計測値を表示してみた • https://twitter.com/pojiro3/status/1571457848571494401 • AHT20は、温湿度計 • https://github.com/pojiro/hello_scenic •
16. 興味本位で Scenic 動作時の構成を:observer で見てみる
17. （IExで）:observer.start で Supervisorツリーを見る
18. プロジェクト構成 • センサー値の取得は、 pubsub/aht20.ex で、 sensors/aht20.ex を利用して行 われ、publishされる • scenes/my_server_spec.ex で、 subscribeし、画面更新
19. UIを効率よく開発するための工夫してみる • UI開発時には実際のセンサで計 測した値は不要（それっぽい値で あればよい） • behaviour（インタフェース）を使 い、動作ターゲット （MIX_TARGET）に合わせ実装を 切り替える
20. Nerves でサイネージを作ると • ネットワークにつながった Nerves でサイネージを作ると NervesHub でアップデートをかけられる （業界では他の方法でやり尽くされているだろう • Nerves の利点は、 ドライバーなども後からアップデートできるので、機器を現場側で後付けできれば、 機能更新ができること！
21. 一方で、、🤔 App • （ライブラリ作成者には失礼な話だが） Scenic はNerves UI開発の決定版になりうるだろうか？　というのも、 ◦ Elixir Desktop ▪ これは wxWidgets を使い、 webview を通してアクセスした WebアプリケーションのUIを Windows, MacOS, Linux, iOS and Android で使えるようにしている（はず ※組み込み機器は未対応 ◦ Flutter ▪ Multi-Platformを標榜し、組み込み機器向けのエンジンも OSSで開発が進んでいる • https://github.com/sony/flutter-embedded-linux ▪ Flutter で webview を使い、Phoenixの画面を↑を使って、 headlessな組み込みlinux、Nervesで表示できたら？？どうだろうか？ Web画面を作成したら、それが表示機 に出力できる（？）こんなラッパーライブ ラリは作れないか？（という動機 WebView Phoenix
22. flutter-embedded-linux を Nerves 上で動かせたら？ • nerves_system_rpi4 をカスタムして試したけれど、 なんかうまくいかなかったorz ◦ https://twitter.com/pojiro3/status/1572803344527425537 マウスカーソルがでない インクリメントされる数字がでない など on Ubuntuは動くので、調整能力 不足、ぐぬぬ
23. まとめ • 描画ライブラリであるScenicを紹介しました ◦ センサーの計測値を実際に表示してみました ◦ 開発時の工夫点を紹介しました ▪ リポジトリ：https://github.com/pojiro/hello_scenic ◦ Flutter on Nerves に挑戦し、失敗しました（笑 Have nice Nerves days!!! Thank you!!