概要
OpenSiv3Dを使うと簡単に綺麗な表現を作ることが出来ますが、複雑なUIを作ろうとすると途端にUpdate関数がごちゃごちゃして難しくなります。
そこで、今回は複雑なUIを作れる仕組みであるEasyViewerをUnityを参考に作ったので、そのご紹介をしようと思います。
EasyViewerの特徴
EasyViewerは、EasyViewerを継承した描画用のクラスを用意することで動かせます。
EasyViewerはchildViewerを複数設定することができ、Unityと同じように階層的にViewerを設計することが出来ます。
また、MouseOverの判定もChildViewerに防がれているかどうかも判定してくれるので、ボタン入力も正確に行えます。
childViewerやparentViewerの取得はtemplate関数を用いているので、childViewerに与えられた入力もスムーズに取得可能です。
複雑に構築されたUIはシーン遷移などで消すのが大変になることが多いですが、EasyViewerではdestory関数を呼ぶことでchildViewerをすべて再帰的に削除することが出来ます。
EasyViewerのサンプル
まず、どんなものが出来るのか見てみましょう。
https://twitter.com/sknjpn/status/1194623601833459713
https://www.nicovideo.jp/watch/sm35973445
こちらが、EasyViewerを使って出来たものです。
今回、よさそうなサンプルが思いつかなかったので、代わりに最近EasyViewerを使って開発したFrom the Planetのコードを公開します。(クラス名がEasyViewerではなくViewerになっていますが、中身は同じです)
https://github.com/sknjpn/From-the-Planet
このプロジェクトでは、GUIButtonなど多くのクラスがViewerの派生クラスになっており、コードをシンプルに保ちつつ複雑なUIを実現しています。
EasyViewerのコード
こちらのEasyViewer.hファイルをincludeすることで使えます。
https://github.com/sknjpn/ViewerSystem/blob/master/EasyViewer.h
基本的な使い方は
https://github.com/sknjpn/From-the-Planet
を参考にしてください。
使い方の流れ
1、描画用のクラスを作成し、EasyViewerを継承する
2、void init() override
関数に初期化時の動作を記述する(コンストラクタの時点ではparentViewerとchildViewersはnullptrなので参照しない)
3、void update() override
関数に更新時の動作を記述する
その他
描画位置はmoveDrawPos関数でずらすことができます。
描画領域はsetViewerRectInLocal関数で設定できます。
ParentViewerの位置を変更すると再帰的にChildViewerの位置は変更されます。