Components

コンポーネントは、 プロトタイプ全体でレイヤーとインタラクションを 再利用できるようにセットで保存されます。シーン全体にコンポーネン トのインスタンスを作ることで、どんなレイヤーとインタラクションの セットでもコンポーネントに変え、再利用することが出来ます。コンポ ーネントを使用することで、不要な繰り返し作業を避け、シーンごとの 読みやすさを向上させ、最終的にプロトタイプの作業速度を上げること ができます。

Using Components

Creating Components in a Scene

シーンにコンポーネントを作ることが出来ます。コンポーネントに変えたいレイヤーを一 つまたは複数選択し、ツールバーにある「コンポーネント」アイコンをクリックしてくだ さい。または、選択したレイヤーを右クリックして、コンテキストメニューから「コンポ ーネントに変換」を選択します。選択したレイヤーとそれに関連したインタラクションを 含むコンポーネントが自動的に作成されます。なお、オリジナルのレイヤーはコンポーネ ントのインスタンスに置き換えられます。

[object Object]

Creating Components Directly

スクラッチからもコンポーネントを作成することが出来ます。左側にあるコンポーネント パネルを開き、プラスアイコンをクリックしてください。空のコンポーネントが作成さ れ、コンポーネントのカスタマイズを始めることができます。

[object Object]

Adding Component Instances

コンポーネントパネルからシーンのキャンバスにコンポーネントをドラッグし、コンポー ネントのインスタンスを作成できます。

[object Object]

Editing Components

Master Component

マスターコンポーネントを編集したいときは、コンポーネント編集モードに切り替えてく ださい。コンポーネントパネルにてコンポーネントをクリックするか、または、コンポーネントのインスタンスを右クリックしてコンテキストメニューから「マスターコンポーネ ントに移動」を選択します 。

マスターコンポーネントの編集はシーンの編集と似ていて、コンポーネント内のレイヤー や変数、トリガー、レスポンスを作成または修正、削除することができます。変更箇所 は、コンポーネントのすべてのインスタンスに適用されます。

右上にある「シーンへ移動」ボタンをクリックしてシーンに戻ることができますが、シー ンパネルでシーンをクリックすれば他のシーンへ移動することもできます。

[object Object]

Instance

コンポーネントインスタンスのサブレイヤーのプロパティーを変更するということは、単 純にこのプロパティーが上書きされるという意味です。上書きされたプロパティーはイン スタンスにのみ適用されるためマスターコンポーネントには影響しません。マスターコン ポーネントを変更しても上書きされたインスタンスのプロパティーは残ります。上書きす ることで同じマスターコンポーネントのインスタンスを保ちつつ、インスタンスが互いに 異なるようにインスタンスをカスタマイズできます。

インスタンスの上書きをリセットしたい場合、インスタンスを右クリックしコンテキスト メニューから「上書きリセット」を選択します。 すべての上書きが削除され、インスタン スはマスターコンポーネントと同じようになります。

[object Object]

Link with Master

コンポーネントのインスタンスをマスターコンポーネントとリンクすることができます。 コンポーネント編集モードに移動しなくてもインスタンスを編集することで、マスターコ ンポーネントを編集できます。

[object Object]

Variable Overrides

変数の初期値を上書きすることも可能です。変数の値を上書きしたい場合、マスターコン ポーネントの変数の「上書きを可能にする」オプションをオンにしてください。このオプ ションをオンにすると、コンポーネントインスタンスのプロパティーパネルで変数の値を 上書きすることが出来ます。

[object Object]

Swap Component Instances

右側にあるプロパティパネルで、コンポーネントのインスタンスを他のインスタンスに交換できます。ネストされたコンポーネントのインスタンスも同じ方法で交換できます。

[object Object]

Grouping Components

コンポーネントの名前に、'/'を使用しグループを作成したり、区分したりすることができます。 例えば、1つ目のコンポーネントの名前を「button/primary/normal」とし、2つ目のコンポーネントの名前を「button/secondary/normal」とすると、以下の通りにグループ化されます。

[object Object]
Back To Top