LogoPixi’VN

角色

如何在 Pixi’VN 中定义、使用和自定义角色,包括存储、情感和自定义属性。

什么是 characters 角色(characters)是出现在视觉小说中的演员。 在 Pixi’VN 中,角色使用 CharacterBaseModel 类或自定义类创建。

初始化

要初始化角色,创建 CharacterBaseModel 类(或您的自定义类)的新实例,并在游戏初始化时将其添加到游戏角色字典中。

建议在项目启动时导入实例。

RegisteredCharacters.add必须的,用于将角色保存到游戏中。

content/characters.ts
import { CharacterBaseModel, RegisteredCharacters } from "@drincs/pixi-vn";

export const liam = new CharacterBaseModel("liam", {
    name: "Liam",
    surname: "Smith",
    age: 25,
    icon: "https://example.com/liam.png",
    color: "#9e2e12",
});

export const emma = new CharacterBaseModel("emma", {
    name: "Emma",
    surname: "Johnson",
    age: 23,
    icon: "https://example.com/emma.png",
    color: "#9e2e12",
});

RegisteredCharacters.add([liam, emma]);

获取

要通过 id 获取角色,使用 RegisteredCharacters.get 函数。

import { RegisteredCharacters } from "@drincs/pixi-vn";

const liam = RegisteredCharacters.get("liam");

获取全部

要获取所有角色,使用 RegisteredCharacters.values 函数。

import { RegisteredCharacters } from "@drincs/pixi-vn";

const characters = RegisteredCharacters.values();

使用

ink

您可以使用 ink 语法使用此方法。 查看更多 此处

您可以使用游戏角色,例如,将其链接到当前对话。 您可以使用角色的 id 或角色实例,但建议使用实例。

import { liam } from "@/content/characters";

narration.dialogue = { character: liam, text: "Hello" };
// or
narration.dialogue = { character: "liam_id", text: "Hello" };

编辑

ink

您可以使用 ink 语法使用此方法。 查看更多 此处

CharacterBaseModel 是一个 存储类,这意味着其属性保存在 游戏存储中。 例如,如果您在游戏中更改角色名称,新名称将保存在游戏存储中并与其 id 关联。

如果角色的 id 在版本之间发生更改,系统将不会将与前一个 id 关联的数据移动到新的 id

要获取实例化类时使用的属性,可以使用 default 属性。

以下是 CharacterBaseModel 类的简化实现,以便更好地理解存储在游戏存储中的属性:

CharacterBaseModel.ts
export default class CharacterBaseModel
    extends StoredClassModel
    implements CharacterBaseModelProps
{
    constructor(id: string, props: CharacterBaseModelProps) {
        super();
        // ...
        this.defaultName = props.name;
        this.icon = props.icon;
        // ...
    }

    // name property is stored in the game storage
    private defaultName: string = "";
    get name(): string {
        return this.getStorageProperty<string>("name") || this.defaultName;
    }
    set name(value: string) {
        this.setStorageProperty("name", value);
    }

    // icon property is not stored in the game storage
    icon: string = "";

    // ...
}

角色情感

ink

您可以使用 ink 语法使用此方法。 查看更多 此处

同一角色拥有多种类型通常很有用。 例如,角色"Alice"和与其情感状态相关的子类型,如"愤怒的 Alice"。 角色和子类型具有相同的特征,但一个或多个属性(如图标)除外。

通过 Pixi’VN,您可以通过传递对象而不是 id 来创建"带情感的角色":

content/characters.ts
import { CharacterBaseModel, RegisteredCharacters } from "@drincs/pixi-vn";

export const alice = new CharacterBaseModel("alice", {
    name: "Alice",
    icon: "https://example.com/alice.png",
    color: "#9e2e12",
});

export const angryAlice = new CharacterBaseModel(
    { id: "alice", emotion: "angry" },
    {
        icon: "https://example.com/angryAlice.png",
    },
);

RegisteredCharacters.add([alice, angryAlice]);
main.ts
console.log(alice.name); // Alice

alice.name = "Eleonora";
console.log(alice.name); // Eleonora
console.log(angryAlice.name); // Eleonora

angryAlice.name = "Angry Eleonora";
console.log(alice.name); // Eleonora
console.log(angryAlice.name); // Angry Eleonora

自定义类

模板

在所有模板中,Character 类已在 models/Character.ts 文件中定义。 您可以直接使用它或根据需要修改它。

建议创建自己的 Character 类,该类扩展 CharacterStoredClass 并"覆盖"接口 CharacterInterface 以添加、编辑或删除属性或方法。

例如,如果您要创建 Character 类,您必须"覆盖"接口 CharacterInterface 以使用您的属性或方法。 (参见文件 pixi-vn.d.ts

现在您可以创建扩展 CharacterStoredClass 并实现 CharacterInterfaceCharacter 类。 (有关如何在 TypeScript 中创建类的更多信息,请阅读官方文档

要创建一个将其值存储在游戏存储中的属性,可以创建 Getters/Setters 并使用 this.getStorageProperty()/this.setStorageProperty() 方法。 (参见文件 Character.ts

import { CharacterInterface, CharacterStoredClass } from "@drincs/pixi-vn";

export class Character
    extends CharacterStoredClass
    implements CharacterInterface
{
    constructor(
        id: string | { id: string; emotion: string },
        props: CharacterProps,
    ) {
        super(
            typeof id === "string" ? id : id.id,
            typeof id === "string" ? "" : id.emotion,
        );
        this._icon = props.icon;
        this._color = props.color;
        this.defaultName = props.name;
        this.defaultSurname = props.surname;
        this.defaultAge = props.age;
    }

    // Not stored properties

    readonly icon?: string;
    readonly color?: string | undefined;

    // Stored properties

    private defaultName?: string;
    get name(): string {
        return (
            this.getStorageProperty<string>("name") ||
            this.defaultName ||
            this.id
        );
    }
    set name(value: string | undefined) {
        this.setStorageProperty("name", value);
    }
    private defaultSurname?: string;
    get surname(): string | undefined {
        return (
            this.getStorageProperty<string>("surname") || this.defaultSurname
        );
    }
    set surname(value: string | undefined) {
        this.setStorageProperty("surname", value);
    }
    private defaultAge?: number | undefined;
    get age(): number | undefined {
        return this.getStorageProperty<number>("age") || this.defaultAge;
    }
    set age(value: number | undefined) {
        this.setStorageProperty("age", value);
    }
}

interface CharacterProps {
    /**
     * The name of the character.
     */
    name?: string;
    /**
     * The surname of the character.
     */
    surname?: string;
    /**
     * The age of the character.
     */
    age?: number;
    /**
     * The icon of the character.
     */
    icon?: string;
    /**
     * The color of the character.
     */
    color?: string;
}

On this page