PS Suite の基本UIアプリケーション

　PS Suite の Open Beta が開始されましたので、さっそく SDK をインストールして簡単なアプリを作成してみました。
　アプリといってもゲーム開発のスキルはないので Widget を使ったものです。
　PS Suite には UI Toolkit というライブラリが用意されていて、これを使って UI を作成する事ができますので、UI Toolkit を使って簡単な画面を表示してみたいと思います。

　PS Suite でのアプリ開発には PlayStation Suite Studio（PssStudio）を使用します。
　PlayStation Suite Studio で新規ソリューションの作成を行い、基本的なアプリケーション作成ように用意されている“PlayStation Suite アプリケーション”を選択します。

　作成されたソリューションを見てみると、AppMain.cs というソースファイルがあり、ここにメインの処理が記述されています。
　AppMain.cs の中身は以下のようになっています。

using System;
using System.Collections.Generic;

using Sce.Pss.Core;
using Sce.Pss.Core.Environment;
using Sce.Pss.Core.Graphics;
using Sce.Pss.Core.Input;

namespace BasicUIApp
{
    public class AppMain
    {
        private static GraphicsContext graphics;
        
        public static void Main (string[] args)
        {
            Initialize ();

            while (true) {
                SystemEvents.CheckEvents ();
                Update ();
                Render ();
            }
        }

        public static void Initialize ()
        {
            // Set up the graphics system
            graphics = new GraphicsContext ();
        }

        public static void Update ()
        {
            // Query gamepad for current state
            var gamePadData = GamePad.GetData (0);
        }

        public static void Render ()
        {
            // Clear the screen
            graphics.SetClearColor (0.0f, 0.0f, 0.0f, 0.0f);
            graphics.Clear ();

            // Present the screen
            graphics.SwapBuffers ();
        }
    }
}

　初期化の後はループに入り、イベントチェック、状態の更新、描画が行われるようになっています。

　ここに UI 表示用の処理を追加して行きますが、UI 表示用のテンプレートがサンプルとして用意（UIToolkit_template）されていますので、これを参考にします。

　まず、UI Tookit を使用するための参照設定が必要です。
　ソリューションツリーに表示されている“参照”を右クリックして“参照アセンブリの編集”を選びます。参照の編集画面が表示されますので、ここで“Sce.Pss.HighLevel.UI”にチェックを追加して OK します。
　これで UI Toolkit が使用できるようになりましたので using を追加しておきます。

using Sce.Pss.HighLevel.UI;

　続いて、初期化、更新、描画に処理を追加します。

　初期化には UI Toolkit の初期化処理を追加します。
　TODO の部分は表示するシーンに応じて書き換える必要があります。

public static void Initialize ()
{
    // Set up the graphics system
    graphics = new GraphicsContext ();

    // Initialize UI Toolkit
    UISystem.Initialize (graphics);

    // TODO: Create scenes and call UISystem.SetScene
    // Scene myScene = new Scene();
    // UISystem.SetScene(myScene, null);
}

　更新にはタッチデータを使って UI を更新する処理を追加します。

public static void Update ()
{
    // Query touch for current state
    List<TouchData> touchDataList = Touch.GetData (0);

    // Update UI Toolkit
    UISystem.Update(touchDataList);
}

　描画には UI Toolkit の描画処理を追加します。

public static void Render ()
{
    // Clear the screen
    graphics.SetClearColor (0.0f, 0.0f, 0.0f, 0.0f);
    graphics.Clear ();

    // Render UI Toolkit
    UISystem.Render ();

    // Present the screen
    graphics.SwapBuffers ();
}

　このように、ゲーム用のループ処理の中に UI Toolkit の処理を追加する事で、Widget を使った UI を表示できるようにしています。
　方式としては Windows Phone の XNA + Silverlight と同じようなものだと思います。

　これが基本になりますが、このままでは何も表示されませんので、Widget を置いて表示させてみたいと思います。

　Widget を配置した画面は PlayStation Suite UI Composer で作成します。

　UI Composer を起動して、新規プロジェクトを作成します。ファイルパスは先ほど作成したソリューションのソースが配置されているフォルダーにします（ここに UI のソースが生成されます）。

　プロジェクトを作成すると、画面を作成するためのダイアログが表示されます。
　今回はメイン画面を作成しますので、“レイアウトするクラス”は“Scene”、サイズは PS Vita 用の 960x544 で作成します。

　作成すると画面にシーンが表示されますので、Label を配置して適当にプロパティをいじってみます（テンプレートのままだと背景が黒になりますので、文字色は黒以外に変えます）。

　配置が終わったらファイルメニューからビルドを実行します。

　成功すると、プロジェクト作成時に指定したファイルパスに xxx.cs と xxx.composer.cs（xxxの部分は画面作成時に指定した名前。今回は MainScene と指定）が生成されます。

　生成されたファイルは、PssStudio のソリューションでプロジェクト名を右クリックして“追加”-“ファイルの追加”で取り込みます。

　後は、初期化時に生成したシーンクラスを設定すれば完成です。

public static void Initialize ()
{
    // Set up the graphics system
    graphics = new GraphicsContext ();

    // Initialize UI Toolkit
    UISystem.Initialize (graphics);

    var mainScene = new MainScene();
    UISystem.SetScene(mainScene, null);
}

　ビルドして実行すると、シミュレーターが起動し以下のようにラベルが表示されます。