toioではじめるロボットプログラミング (8) - UIの作成
「toio SDK for Unity」のUIの作成方法をまとめました。
前回
1. プロジェクトの準備
「toioではじめるロボット・プログラミング (2) - toioアプリのサンプルの実行」と同様です。
2. シーンの準備
(1) Hierarchyウィンドウの「Main Camera」と「Directional Light」を削除。
(2) Projectウィンドウの「/Assets/toio-sdk/Scripts/Simulator/Resources」の「Cubeプレハブ」と「Stageプレハブ」を、Hierarchyウィンドウにドラッグ&ドロップ。
(3) Hierarchyウィンドウで、「+ → Create → Empty Object」で空のオブジェクトを生成し、「ControlCube」という名前を指定。
(4) 「ControlCube」に「Add Component」で新規スクリプト「ControlCube」を生成し、以下のように編集。
using System.Collections.Generic;
using UnityEngine;
using toio;
// キューブの操作
public class ControlCube : MonoBehaviour
{
CubeManager cubeManager; // キューブマネージャ
Cube cube; // キューブ
// 初期化
async void Start()
{
// キューブの接続
cubeManager = new CubeManager();
cube = await cubeManager.SingleConnect();
}
// 前進
public void Forward()
{
cube.Move(60, 60, durationMs:0, order:Cube.ORDER_TYPE.Strong);
}
// 後進
public void Backward()
{
cube.Move(-40, -40, durationMs:0, order:Cube.ORDER_TYPE.Strong);
}
// 右回転
public void TurnRight()
{
cube.Move(60, 30, durationMs:0, order:Cube.ORDER_TYPE.Strong);
}
// 左回転
public void TurnLeft()
{
cube.Move(30, 60, durationMs:0, order:Cube.ORDER_TYPE.Strong);
}
// 停止
public void Stop()
{
cube.Move(0, 0, durationMs:0, order:Cube.ORDER_TYPE.Strong);
}
}
3. UIの作成
(1) Hierarchyウィンドウの「+ → UI → Canvas」で「Canvas」を追加。
(2) 「Canvas」を選択し、Inspectorウィンドウの「Canvas Scaler」で以下のように設定。
(3) Canvas下に「Panel」を追加し、「Rect Transform」の「center/middle」で以下のように設定。
(3) ボタンを5つ配置し、クリックイベントを「ControlCube」の各メソッドに関連付け。
4. iOSでの実行
iOSで実行すると、次のようなUIが表示されます。
5. 参考
この記事が気に入ったらサポートをしてみませんか?