【Unity】xNodeの使い方 初心者向け
お疲れ様です。ぐーるです。
ビルの件の高速化の記事を進めているのですが、めっちゃ長いので、気長にちまちま加筆してます。
というわけで気分転換でxNodeについて書きます。
普段真っ黒いコンソールしか見てない自分としては
ビジュアルスクリプティングというのに興味がありまして、
Playmakerとか触ってみたいなと思ってたんですが、有料なのかぁと二の足を踏んでいました。
先日勉強会でxNodeってのがあるという話を聞きまして、早速触ってみました。
初心者向けですごーく初歩的な内容ですがメモとしてまとめておこうと思います。
xNodeの導入
xNodeはAssetStoreにもありますが、githubで公開されています。
github.com
cloneしても良いですが、unitypackageが公開されているので、それを利用しました。
https://github.com/Siccity/xNode/releases
xNode_1.6.unitypackage
をDLして、unityのプロジェクトで
Assets > Import Package > Custom Package
でimportします。
xNodeの最もシンプルな構成
シンプルに考えるとxNodeは二つのクラスしかありません。
NodeとNodeGraphです。
XNode.Node
これは単一のノードを指します。
値を持ったり、値によって振る舞いを変えたりといった事が出来ます。
XNode.NodeGraph
これはNodeを管理するScriptableObjectを作れるクラスです。
このようにNodeを複数グループ管理するイメージです。
内部ではnodesというリストを持っていて、ここで各ノードを保持しています。
早速作ってみる
今回はNovelゲームを題材にして、そのNovelゲームの会話処理をノード化し、
会話の流れをビジュアル的に捉えやすくするイメージで作ってみます。
NodeGraphの作成
まずxNodeのウィンドウを出すため、NodeGraphを作成します。
using UnityEngine; using XNode; [CreateAssetMenu(fileName = "NovelGraph", menuName = "Node Graph/NovelGraph")] public class NovelGraph : NodeGraph { }
menuNameなどは適宜変えてください。
間違いでもなんでもなく、本当にこれだけでOKです。
最小限で良ければ何にも要らないです。
Nodeの作成
ノードを作成します。
using System.Collections.Generic; using UnityEngine; using XNode; public class NovelNode : Node { public Sprite _novelSprite; [TextArea(3, 5)] public List<string> _messageList; [Input] public NovelNode _beforeNode; [Output] public NovelNode _nextNode; }
表示したい立ち絵スプライト画像と文字列リストを持ちます。
ノード同士を連結させるために前と後ろの参照を持っておきます。
[Input]というAttributeを付与するとノード連結を受け入れることが出来、
[Output]なら逆にノード連結を出力することが出来ます。
[Output] -> [Input]
の関連になります。
コードはこれで準備完了です。
NodeGraphとノードエディタ
(他も見えますが、気にせず)
Project > Create > Node Graph > NovelGraph
でScriptableObjectを生成し、それをダブルクリックします。
xNodeエディタウィンドウが開くので、右クリックでNodeを追加出来ます。
後は好きな値を入れます。
[Input][Output]を繋げる時は直感的にドラッグすればOKです。
NodeGraphの使い方
使う側は簡単です。
public class NovelGraphController : MonoBehaviour { [SerializeField] NovelGraph _novelGraph; private int _nodeIndex = 0; // ~~ // nodesに入っているのでそこからアクセス出来ます var novelNode = _novelGraph.nodes[_nodeIndex] as NovelNode; }
こんな感じで自由にアクセス出来ます。
NovelGraphには上で作成したScriptableObjectを紐づければOKです。
ノベルゲーム風に使ってみた
こんな感じでデータを入れて
こんな感じに会話が進む感じにしてみました。
TextFaderというライブラリをちょっとお借りしてカスタムして使用してます。
会話の流れがビジュアル的に捉えやすいですね。
会話の入れ替えやデータのミスの把握などが直感的に行えそうです。