UniRxで非同期UI処理を書く -解説編1-

こんにちは。

プログラマの姫野です。

今回のテーマは、前回に引き続きUniRxです。
簡単なUIの実装ができる段階までの紹介となっておりましたが、実際にUIを実装する上で必要な知識を、
どのようにして動作しているのか、実例を交えながら紹介していきたいと思います。

◆ストリーム

まず、UniRxを使っていく上で重要なものは、「ストリーム」です。

いきなりストリームという単語が出てきました。
C++を扱っていた方には馴染み深いものかもしれませんね。

Wikipediaでストリームを検索してみると、
ストリーム(stream)とはデータを「流れるもの」として捉え、流れ込んでくるデータを入力、流れ出ていくデータを出力として扱う抽象データ型である。
と記されていました。
うーん・・・これだけではまだ全然わからないですね。

前回のブログで取り上げたボタンイベントを例にあげてみましょう。
UniRxでは、ボタンイベントをストリームに変換することができるのですが、
ボタンイベントストリームを簡単な図にすると以下のようになります。
横線が時間軸、オレンジ色の円がボタンイベントを表します
時間がたつにつれ、不定期にボタンイベントが発生するようなイメージをしてもらえばいいと思います。

また、UniRxではObservableという単語がよく出てきますが、ほぼストリームと同義と考えていただいて問題ないです。

◆購読

そんなストリームを、UniRxではどのようにして扱っているのでしょうか。
そこで出てくるのが「購読(Subscribe)」です。

購読を行うと、ストリームからデータを取り出したときに新しいデータが来たよー、と通知されるようになります。(他にもストリームからこれ以上値を取り出せない時や、ストリーム中でエラーが発生した時にも通知されます)

さて、例としてボタンイベントストリームからデータを取り出したとき、というのはいつのタイミングになるでしょうか?

お気付きの方は多いかと思いますが、ボタンイベントが発生したタイミングです。

ボタンをクリックすればストリームにデータが流れ購読処理が実行されるのです。
図にすると以下のようになるでしょうか。

赤線が購読処理、ここにデータが通ると通知されるイメージ

◆ソースコードと合わせて見る

前回使用したソースコードからボタンイベント登録の箇所だけ抽出して見てみましょう。

UniRxはメソッドチェーンで記述していくのが基本で、
監視するストリームを指定 -> ストリームから値が取り出せた時の処理を指定
という「条件」と「それに対しての処理」のペアが出来上がるので
ソースコードの意図が非常にわかりやすくなります!

◆まとめ

ストリーム・購読を単純に扱うとイベントコールバックと大差無いように感じられます。
しかし、ストリームの合成・フィルタリング等を交えると本来ややこしい処理になるものが、簡潔に書けるようになったりします。
これらは、UniRxを使っていく上で必ず目にするものと言っていいくらい使用頻度が高いです。

次回はそういった部分を紹介していきます!
お楽しみに。

採用情報

クラウドクリエイティブスタジオではプログラマを募集しております。
一緒に面白いゲームを作っていきましょう!

コメント