サイドイメージ link

多くのヴィジュアルノベルはインターフェースの一部に会話しているキャラクターの画像を含みます。 Ren'Py はこの画像をサイドイメージと呼び、台詞と同時の自動的なサイドイメージの選択と表示をサポートしています。

サイドイメージのサポートは Character() が関連付けされる画像タグ付きで宣言されていることを前提としています。

define e = Character("Eileen", image="eileen")

関連付けした画像タグを持つキャラクターが話すとき、 Ren'Py は画像属性のプールを生成します。関連づけられた画像タグは、そのタグに関連づけされた現在の画像属性と共にこのプールに加えられます。

To determine the side image associated with a tag, Ren'Py tries to find an image with the tag "side", and the largest number of attributes from the pool. If no image can be found, or more than one image has the same number of attributes, an Null is shown instead.

例えば以下のスクリプトとについて述べます

define e = Character("Eileen", image="eileen")

image eileen happy = "eileen_happy.png"
image eileen concerned = "eileen_concerned.png"

image side eileen happy = "side_eileen_happy.png"
image side eileen = "side_eileen.png"

label start:

    show eileen happy

    e "Let's call this line Point A."

    e concerned "And this one is point B."

ポイント A では画像タグ「 eileen 」に関連付けられたキャラクター e が話しています。画像「 eileen happy 」が表示されているので、属性のプールは「 eileen 」と「 happy 」です。「 side 」タグと、可能な限り多くのそれらの属性を持つ画像を探すと「 side eileen happy 」がマッチし、それが Ren'Py に表示されるサイドイメージになります。

ポイント B では「 eileen concerned 」が表示されています。属性のプールは今「 eileen 」と「 concerned 」です。唯一マッチする位画像は「 side eileen 」なので、 Ren'Py はそれを選択します。 画像「 side concerned 」があると、曖昧になるので、 Ren'Py は画像を表示できません。

透明なキャラクター link

サイドイメージのもう一つの使用法は、あるキャラクターに台詞があるときにそのキャラクターの画像を表示することです。この方法は画像とキャラクターを関連付けし、表示するサイドイメージを選択するための属性を持つ say ステートメントを使用することです。

define p = Character("Player", image="player")

image side player happy = "side_player_happy.png"
image side player concerned = "side_player_concerned.png"

label start:

    p happy "This is shown with the 'side player happy' image."

    p "This is also shown with 'side player happy'."

    p concerned "This is shown with 'side player concerned'."

バリエーション link

設定変数を使って制御可能なサイドイメージ単独か立ち絵と同時かから 2 種類のサイドイメージサポートを選べます。 :

define config.side_image_tag = None link

これが与えられるとサイドイメージは現在話しているキャラクターに関連付けられた画像ではなく、指定されたタグに従います。例えば

define e = Character("Eileen", image="eileen")

init python:
     config.side_image_tag = "eileen"

サイドイメージに e キャラクターに関連付けられた "eileen" 画像タグを取らせます。

define config.side_image_only_not_showing = False link

When set to true, the side image will only show if an image with that tag is not already being shown on the screen.

define config.side_image_prefix_tag = 'side' link

サイドイメージを検索するときに使用される接頭辞です。

define config.side_image_null = Null() link

The Null displayable to use when not displaying a side image. This be changed, but only to other Null objects. One reason for doing so would be to set the side of the Null (eg. Null(width=200, height=150)) to prevent dissolves from being cut off.

define config.side_image_same_transform = None link

None または新しいサイドイメージが以前のサイドイメージと同じ画像タグの時に使用される変換です。

define config.side_image_change_transform = None link

None または新しいサイドイメージが以前のサイドイメージとは別の画像タグの時 (または新しいサイドイメージや以前のサイドイメージがないとき) に使用される変換です。

変換とトランジション link

config.side_image_same_transformconfig.side_image_change_transform 変換はサイドイメージが表示される度に 2 つの引数、新旧のサイドイメージ displayable で呼び出されます。これらを使用してサイドイメージを動かしたりトランジション出来ます。

画像に関連付けられたキャラクターが変更するとき、このコードはサイドイメージをスライドイン、アウトします。

transform change_transform(old, new):
    contains:
        old
        yalign 1.0
        xpos 0.0 xanchor 0.0
        linear 0.2 xanchor 1.0
    contains:
        new
        yalign 1.0
        xpos 0.0 xanchor 1.0
        linear 0.2 xanchor 0.0

define config.side_image_change_transform = change_transform

This is used to dissolve between old and new side images when the character remains the same. (For example, when the character changes emotion.) For the Dissolve to work correctly, both side images must be the same size.

transform same_transform(old, new):
    old
    new with Dissolve(0.2, alpha=True)

define config.side_image_same_transform = same_transform

Leaving Room / Customization link

デフォルトではスクリーンのすべての幅はテキストに専有されます。サイドイメージを表示しようとすると、テキストの上部に表示されるでしょう。これを修正するためには、以下の様なコードを使って、 margin, padding をテキストウィンドウの適切なサイドに含めるべきです。

style window:
    left_padding 150

サイドイメージの場所は say または nvl スクリーンをカスタマイズして変更できます。ともに次の行を含んでいます。

add SideImage() xalign 0.0 yalign 1.0

By changing the xalign and yalign properties, you can control the positioning of the side image on the screen.

最終的には SideImage() 関数は displayable として現在のサイドイメージを返します。このことはより高度なカスタマイズの一部で使用されます。