场景
⚠️
本页面正在建设中
⚠️
测试功能,可能会有变动
该类继承自 Displayble
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 实例,仅限于场景内使用
它用于存储仅在场景中可用的临时数据
本地数据不需要注册或初始化,但在使用前是“未定义”的
当场景退出时,本地数据将被丢弃
scene.action([
new Menu("你想喝哪种咖啡?")
.choose("拿铁", [
scene.local.set("coffee", "latte"),
])
.choose("卡布奇诺", [
scene.local.set("coffee", "cappuccino"),
]),
character1.say`你选择了 ${scene.local.get("coffee")} 咖啡`,
]);background
此属性用于访问场景的背景 Image 实例
scene.background
.char("background.png", new Dissolve(1000, "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
向场景添加操作。不要多次调用此方法
重载 1 of 2
actions: ActionStatements- 要执行的操作,参见 ActionStatements
重载 2 of 2
此重载允许你传递一个函数,该函数接收场景实例并返回要执行的操作
在某些情况下,你可能希望为场景实例创建一个快捷方式
story.entry(
new Scene("scene 1").action(scene => [
scene
.setBackground(background)
.sleep(1000),
])
);actions: ((scene: Scene) => ActionStatements)- 要执行的操作,参见 ActionStatements- 返回
this
preloadImage
手动注册图像源
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 以及 ImageSrctransition?: ImageTransition- 对于 ImageTransition,参见 Transition
jumpTo
跳转到另一个场景。如果提供了过渡效果,场景将以过渡效果更改
注意:跳转到另一个场景后,当前场景将被释放。剩余的操作将不会执行
scene: Scene | string- 要跳转到的场景实例或场景名称config: Partial<JumpConfig>- 跳转配置
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("第一行"),
character.say("第二行"),
character.say("第三行"),
]),
]);重载 2:options + actions
options: Partial<TransformDefinitions.CommonTransformProps>- NVL 层显示/隐藏时的过渡选项(如{ duration: 500 })。参见 CommonTransformPropsactions: ActionStatements | ((nvl: NVLToken) => ActionStatements)- 同重载 1- 返回
ChainableAction
scene.action([
scene.nvl({ duration: 300 }, [
character.say("第一行"),
character.say("第二行"),
]),
]);使用 NVLToken 的回调形式
当传入回调 (nvl) => [...] 时,可使用 nvl.show()、nvl.hide() 和 nvl.end() 显式控制 NVL 层:
scene.action([
scene.nvl(nvl => [
character.say("第一行"),
character.say("第二行"),
nvl.hide({ duration: 500 }),
Control.waitForClick(),
nvl.show({ duration: 500 }),
character.say("第三行"),
nvl.end(),
]),
]);NVL Token 方法
使用回调形式 scene.nvl(nvl => [...]) 时,nvl 参数为 NVLToken,具有以下可链式方法:
| 方法 | 说明 |
|---|---|
nvl.show(options?) | 显示 NVL 层,可传入过渡选项(如 { duration: 500 })。参见 CommonTransformProps。 |
nvl.hide(options?) | 隐藏 NVL 层,可传入过渡选项。不会退出 NVL 模式或清空对话。 |
nvl.end() | 立即强制退出 NVL 模式。清空所有已堆叠的对话并隐藏 NVL 层。 |