【Resonite】コンテキストメニューの追加方法〜応用編〜【雑解説】
はじめに
この記事では、コンテキストメニューの応用的な使い方を備忘録として残します。コンテキストメニューの作成方法などの基本的なことについては以下の記事を参考にしてください。
今回の記事で作るものは、サンプルをユニポケで配布しています。記事最下部のリンクから見に行ってみてください。
①複数の階層を持つコンテキストメニューの作り方
コンテキストメニューが増えすぎると細くなって選びにくくなるので、メニューを階層化できると便利です。カテゴリや用途別に分けてもいいかもしれません。
1.コンテキストメニューを用意する

2.下の階層用のスロットを追加する

3.既にあるコンテキストメニューのスロットに、ContextMenuSubmenuコンポーネントを追加する



4.ContextMenuSubmenuのItemsRootに、追加したいコンテキストメニューの親スロットを設定する

5.2で追加したスロットにContextMenuItemSaurceコンポーネントを追加する


6.新しい階層にメニューが増えているはずなので確認する

おまけ1.メニューの簡単な増やし方


おまけ2.更に深く・・・




②前の階層に戻るメニューの作り方
メニューを階層化したときに途中で選び間違えてしまうと、また最初から選ぶことになってしまいます。そんなときに戻るメニューがあると、とても便利です。
1.階層化されたコンテキストメニューを用意する

2.戻るメニューを追加するスロットを作成する

3.ContextMenuItemSaurceとContextMenuSubmenuを追加する

4.ContextMenuSubmenuのItemsRootに戻りたい階層の親スロットを設定する

5.動作確認する

③コンテキストメニューの色や画像を切り替える
コンテキストメニューの色や画像を切替えるときに便利なコンポーネント”ValueOptionDescriptionDriver”を紹介します。
今回は、サンプルとして押したら色が切り替わる機能を追加します。
1.ValueOptionDescriptionDriverを追加する
CommonUI/Driversの中にあります。
<>内の型は切り替えのトリガーとなる値と同じ型を選んでください。

2.設定する
今回は色を変えたいので、ContextMenuItemSaurceのColorをValueOptionDescriptionDriverのColorに設定します。

トリガーとなる値に対応する値を設定します。今回は、トリガーがBoolなので、Trueのときに緑、Falseのときに赤になるように設定しました。

3.動作確認

