シーン
`Scene` クラス。アクション、背景とレイヤー、シーンローカルなストレージ、NVL モード、シーン間のジャンプを扱う
このクラスは Displayable を継承しています
Scene には、そのシーン上で実行できる複数のアクションが含まれます。
例えば、シーンに Character のアクションを追加できます
import { Scene } from 'narraleaf-react';
const scene = new Scene("scene 1");
const character1 = new Character("character 1");
scene.action([
character1
.say("Hello World")
.say("How are you?"),
]);公開プロパティ
local
scene.local は、シーンにローカルな Persistent インスタンスです。
そのシーン内でのみ使用できる一時的なデータを保存するために使います。
ローカルデータは登録や初期化を必要としませんが、使用する前は「undefined」です。
local 内のデータは、シーンを抜けると破棄されます。
scene.action([
new Menu("Which coffee do you want?")
.choose("Latte", [
scene.local.set("coffee", "latte"),
])
.choose("Cappuccino", [
scene.local.set("coffee", "cappuccino"),
]),
character1.say`You chose ${scene.local.get("coffee")} coffee`,
]);background
このプロパティは、シーンの背景 Image インスタンスにアクセスするために使用します。
scene.background
.char("background.png", new Dissolve({ duration: 1000, easing: "linear" }))backgroundLayer
このプロパティは、シーンの背景レイヤーにアクセスするために使用します。
このレイヤーには、シーンの背景画像が含まれます。
scene.backgroundLayer.opacity(0.5, 1000, "linear")displayableLayer
このプロパティは、シーンの表示可能レイヤーにアクセスするために使用します。
このレイヤーには、特定のレイヤーに属さないすべての表示可能要素が含まれます。
scene.displayableLayer.opacity(0.5, 1000, "linear")公開メソッド
constructor
name: string- シーンの名前config?: Partial<ISceneUserConfig>- ISceneUserConfig
action
シーンにアクションを追加します。このメソッドを2回以上呼び出さないでください。
オーバーロード 1/2
actions: ActionStatements- 実行するアクション。ActionStatements を参照
オーバーロード 2/2
このオーバーロードでは、シーンインスタンスを受け取り、実行するアクションを返す関数を渡せます。
場合によっては、シーンインスタンスへのショートカットを作りたいことがあります
story.entry(
new Scene("scene 1").action(scene => [
scene
.setBackground(background)
.sleep(1000),
])
);actions: ((scene: Scene) => ActionStatements)- 実行するアクション。ActionStatements を参照- 戻り値:
this
preloadImage
画像ソースを手動で登録します
プリローダーが自力では予測できないソースに対して使用します。多くの場合、これはレイヤード画像の関数レイヤーが返す src で、プリローダーにとっては不透明なものです。あるいは、外観の変化が複雑すぎて「予測できないソース」の警告が出るケースもこれに当たります。
src: string | string[]- 画像の URL、または URL の配列- 戻り値:
this
チェーン可能なメソッド
setBackground
scene.background.char のエイリアスです。
シーンの背景を設定します。トランジションを指定すると、そのトランジション効果で背景が切り替わります。
scene.action([
scene.setBackground("background.png")
// これは次と等価
scene.background.char("background.png")
]);background: Color | ImageSrc- Color または ImageSrc を参照transition?: ImageTransition- ImageTransition については Transition を参照
jumpTo
別のシーンにジャンプします。トランジションを指定すると、2つのシーンが入れ替わる間、ステージ全体にわたってそのトランジションが再生されます。背景だけでなく、スプライト、テキスト、その他すべてのレイヤーが対象になります。JumpConfig を参照してください。
注: 通常のジャンプは現在のシーンを破棄するため、ジャンプ後のアクションは決して実行されません。
returnableを指定したジャンプの場合は、現在のシーンをサスペンドし、ジャンプ先のシーンのアクションが尽きたときに戻ってきます。そのため、ジャンプ後のアクションも実行されます。
scene: Scene- ジャンプ先のシーンconfig: Partial<JumpConfig> | Transition- Jump Config、またはトランジション単体
// One way: this scene is gone, and nothing after the jump runs.
scene.jumpTo(nextScene);
// A call: this scene is parked, and the line after the jump runs when the storeroom is done.
scene.jumpTo(storeroom, {returnable: true});setBackgroundMusic
シーンの背景音楽を設定します。
sound: Sound- Sound インスタンスfade?: number- 指定すると、前の曲にはフェードアウト、現在の曲にはフェードインが適用されます。値はミリ秒単位の長さです
nvl
蓄積されたダイアログを表示するための NVL(ノベル)モードブロックを作成します。NVL モードでは、ダイアログは互いに置き換わるのではなく、画面上に積み重なって表示されます。これは従来のビジュアルノベルの地の文表示に似ています。
オーバーロード 1: actions のみ
actions: ActionStatements | ((nvl: NVLToken) => ActionStatements)- NVL モード内で実行するアクション、または表示・非表示・終了を手動制御するための NVLToken を受け取るコールバック- 戻り値:
ChainableAction
scene.action([
scene.nvl([
character.say("First line"),
character.say("Second line"),
character.say("Third line"),
]),
]);オーバーロード 2: options + actions
options: Partial<TransformDefinitions.CommonTransformProps>- NVL レイヤーの表示・非表示に使うトランジションオプション(例:{ duration: 500 })。CommonTransformProps を参照actions: ActionStatements | ((nvl: NVLToken) => ActionStatements)- オーバーロード 1 と同じ- 戻り値:
ChainableAction
scene.action([
scene.nvl({ duration: 300 }, [
character.say("Line 1"),
character.say("Line 2"),
]),
]);NVLToken を使ったコールバック形式
コールバック (nvl) => [...] を渡すと、nvl.show()、nvl.hide()、nvl.end() を使って NVL レイヤーを明示的に制御できます:
scene.action([
scene.nvl(nvl => [
character.say("Line 1"),
character.say("Line 2"),
nvl.hide({ duration: 500 }),
Control.waitForClick(),
nvl.show({ duration: 500 }),
character.say("Line 3"),
nvl.end(),
]),
]);NVL Token メソッド
コールバック形式 scene.nvl(nvl => [...]) を使う場合、nvl 引数は NVLToken であり、次のチェーン可能なメソッドを持ちます:
| Method | Description |
|---|---|
nvl.show(options?) | NVL レイヤーを表示します。トランジションを任意で指定できます(例: { duration: 500 })。CommonTransformProps を参照。 |
nvl.hide(options?) | NVL レイヤーを非表示にします。トランジションを任意で指定できます。NVL モードの終了やダイアログのクリアは行いません。 |
nvl.end() | 即座に NVL モードを強制終了します。蓄積されたすべてのダイアログをクリアし、NVL レイヤーを非表示にします。 |