スタイルのプロパティー link

スタイルプロパティーは、 styles による displayable の表示方法の制御に関係しています。スタイルプロパティーは、接頭辞を付けずに displayable のすべての状態に対して適用することもできますし、接頭辞を付けてプロパティーを特定の状態だけに限定することもできます。

スタイルプロパティーの接頭辞 link

スタイルプロパティーに接頭辞を使うことで、フォーカスや選択肢の状態に応じた displayable の見た目の変更を示すことができます。例えば、ボタンの上にマウスが置かれた時に色を変更したり、ボタンによって現在選択されているものを表すことができます。

displayable がなりうる状態は5つあります。

insensitive

ユーザーが displayable を操作できない時に使用されます。

idle

displayable がフォーカスも選択もされていない時に使用されます。

hover

displayable がフォーカスされて選択されていない時に使用されます。

selected_idle

displayable がフォーカスされずに選択されている時に使用されます。

selected_hover

displayable がフォーカスかつ選択されている時に使用されます。

ボタンとバーの displayable (及びその類のもの) は、自身の状態と子要素の状態をイベントに応じて更新します。例えば、ユーザーが選択されていないボタンの上でマウスを通過させた時、ボタンとその子要素は hover 状態になります。

スタイルプロパティーの接頭辞により、異なる状態に対してそれぞれのスタイルプロパティーを設定できます。包含セットアップのシステムがあるため、接頭辞によって1つ以上の状態に対してプロパティーをまとめて設定できます。

包含関係は:

接頭辞

接頭辞に含まれる状態

(接頭辞なし)

insensitive, idle, hover, selected_idle, selected_hover
idle_ idle, selected_idle
hover_ hover, selected_hover
selected_ selected_idle, selected_hover
insensitive_ insensitive
selected_idle_ selected_idle
selected_hover_ selected_hover
selected_insensitive_ selected_insensitive

テキストボタンを使ってこれを実演します。テキストボタンには2つのスタイルがあり、 button はボタン本体に対して、 button_text はボタン中のテキストに対してあります。 background スタイルプロパティーによってボタンの背景を設定するとともに、 color プロパティーによってテキストの色を設定します。:

# The button background is gray when insensitive, light
# blue when hovered, and dark blue otherwise.
style button:
    background "#006"
    insensitive_background "#444"
    hover_background "#00a"

# The button text is yellow when selected, and white
# otherwise.
style button_text:
    color "#fff"
    selected_color "#ff0"

スタイルプロパティーの値 link

それぞれのスタイルプロパティーには特定の種類のデータを設定する必要があります。これらの多くは Python の標準的な型ですが、一部は独自のものです。スタイルプロパティーに設定できる独自の値について説明します。

position

位置は、ある領域の左上角からの相対的な場所を指定するために使用されます。(位置における領域は displayable が含まれているレイアウトによって与えられるか、レイアウトがない場合はスクリーンとなります。アンカーにおける領域は displayable そのものの大きさとなります。)

位置の値は、値の型によって解釈のされ方が異なります:

int (例 0, 1, 37, 42)

整数は、領域の左端または上端からのピクセル数として解釈されます。

float (例 0.0, 0.5, 1.0)

浮動小数点数は、領域に対する割合として解釈されます。例えば 0.5 は領域の両端に対する半分の点となり、また 1.0 は右端または下端となります。

renpy.absolute (例 renpy.absolute(100.25))

renpy.absolute は、スクリーンの左端または上端からのピクセル数として解釈され、サブピクセルのレンダリングに使用します。

displayable

どのような displayable でもかまいません。 displayable に "[prefix_]" 置換文が含まれていれば以下で述べる接頭辞検索が処理されます。

color

Ren'Pyにおける色は、先頭のハッシュマーク(#)と、それに続く3つか4つの16進数の文字列によって表現され、3つか4つの要素のそれぞれは、1桁か2桁の16進数の色コードとなっています。

16進数が3つの場合、それぞれの成分は赤、緑、青を意味します。16進数が4つの場合、それぞれの成分は赤、緑、青、アルファを意味します。例 :

  • "#f00""#ff0000" は不透明の赤色を意味します。

  • "#0f08"#00ff0080" は半透明の緑色を意味します。

3つの16進数で表される色は、HTMLで使われているものと同じです。

色は4つの要素のタプルとして表すこともでき、4つの要素は0から255までの整数となります。それぞれの要素は、赤、緑、青、アルファの順です。

  • (0, 0, 255, 255) は不透明の青色を意味します。

最終的にカラーは Color クラスのインスタンスです。

すべてのスタイルプロパティーの一覧 link

スタイルプロパティーによって様々な displayable の外観を制御できます。すべてのスタイルプロパティーがすべての displayable に適用できるわけではないため、これらを分類しました。

位置のスタイルプロパティー link

これらのプロパティーは、すべての displayable に適用され、多くは layout によって確保される領域の内部、または layout の内部でない場合は screen 上で displayable の位置を制御します。

alt - string or None link

自己発話が有効なときに displayable に使用される代替テキスト。詳細は self voicing の節を参照してください。

xpos - position link

displayable が含まれている領域の左端からの相対的な位置。

ypos - position link

displayable が含まれている領域の右端からの相対的な位置。

pos - tuple of (position, position) link

タプルの第1要素に xpos を設定し、タプルの第2要素に ypos を設定することと等価。

xanchor - position link

displayable の左端からの、アンカーの相対的な位置。

yanchor - position link

displayable の右端からの、アンカーの相対的な位置。

anchor - tuple of (position, position) link

タプルの第1要素に xanchor を設定し、タプルの第2要素に yanchor を設定することと等価。

xalign - float link

xpos と xanchor に同じ値を設定することと等価。これはスクリーン上の相対的な位置に displayable を設置するときに効果があり、0.0 で左端、0.5 で中央、1.0 で右端となります。

yalign - float link

ypos と yanchor に同じ値を設定することと等価。これはスクリーン上の相対的な位置に displayable を設置するときに効果があり、0.0 で上端、0.5 で中央、1.0 で下端となります。

align - tuple of (float, float) link

タプルの第1要素に xalign を設定し、タプルの第2要素に yalign を設定することと等価。

xcenter - position link

xpos をこのプロパティーの値に、xanchor を 0.5 に設定するのと等価です。

ycenter - position link

ypos にこのプロパティーの値を、yanchor に 0.5 を設定することと等価です。

xoffset - int link

xpos と xalign から計算される水平方向の位置に追加されるピクセル数を返します。

yoffset - int link

ypos と yalign から計算される垂直方向の位置に追加されるピクセル数を返します。

offset - tuple of (position, position) link

タプルの第1要素に xpos を設定し、タプルの第2要素に ypos を設定することと等価。

xmaximum - int link

displayable の水平方向の大きさの最大値をピクセル数で指定します。

ymaximum - int link

displayable の垂直方向の大きさの最大値をピクセル数で指定します。

maximum - tuple of (int, int) link

タプルの第1要素に xmaximum を設定し、第2要素に ymaximum を設定することと等価。

xminimum - int link

displayable の幅の最小値をピクセル数で設定します。displayable の大きさが変更可能なときのみ動作します。

yminimum - int link

displayable の高さの最小値をピクセル数で設定します。displayable の大きさが変更可能なときのみ動作します。

minimum - tuple of (int, int) link

タプルの第1要素に xminimum を設定し、第2要素に yminimum を設定することと等価。

xsize - int link

xminimum と xmaximum に同じ値を設定することと等価です。この結果として、displayable の幅が設定されます。

ysize - int link

yminimum と ymaximum に同じ値を設定することと等価です。この結果として、displayable の高さが設定されます。

xysize - tuple of (int, int) link

xminimum と xmaximum をタプルの1つ目の要素に、yminimum と ymaximum をタプルの2つ目の要素にすることと等価です。この結果として、displayable のサイズが設定されます。

xfill - boolean link

True のとき、displayable が水平方向の空きスペースに展張されます。True でない場合は、含まれている子要素と同程度の大きさになります。

displayable の大きさが変更可能なときのみ動作します。

yfill - boolean link

True のとき、displayable が垂直方向の空きスペースに展張されます。True でない場合は、含まれている子要素と同程度の大きさになります。

displayable の大きさが変更可能なときのみ動作します。

area - tuple of (int, int, int, int) link

タプルは (xpos, ypos, width, height) と解釈されます。displayable の左上角の位置が xposypos に、大きさが widthheight になるように設定を試みます。

これを行うには、xpos、ypos、xanchor、yanchor、xmaximum、ymaximum、xminimum、yminimum、xfill、yfill プロパティーを適切な値に設定する必要があります。

これはすべての displayable や layout で動作するわけではありません。

テキストスタイルのプロパティー link

antialias - boolean link

True のとき(既定値)、TrueType フォントのテキストがアンチエイリアスされてレンダリングされます。

adjust_spacing - boolean link

True なら Ren'Py は drawable-resolution テキストのサイズを virtual resolution で描画されるテキストのスペースに合せて、フレームとテキストを含むコンテンツのサイズが変更されないことを保証します。

False ならテキストはサイズに応じて変更されませんが、どんなウィンドウサイズに対してもテキストをレイアウトするのに十分なスペースを確保することはクリエーターの責任です。

デフォルトでほとんどのテキストに対して True になりますが、 input のテキストに対しては False です。

black_color - color link

画像ベースのフォントをレンダリングする際、黒色がこの色にマッピングされます。TrueType フォントには影響しません。

bold - boolean link

True のとき、フォントを太字でレンダリングします。TrueType フォントでは、通常はフォントの太さが全体的に増えるようになります。このプロパティーと config.font_replacement_map を使ってフォントを再マップすることもできます。

caret - displayable or None link

None を設定するか、displayable を設定します。これは入力ウィジェットでテキスト末尾のカーソルとして使用されます。None の場合は1ピクセルの幅の線がカーソルとして使用されます。

color - color link

テキストをレンダリングするときの色です。TrueType フォントを使用するときは、フォントはこの色で描画されます。画像ベースのフォントを使用するときは、白色がこの色にマッピングされます。

first_indent - int link

段落のテキストの1行目のインデント量を、ピクセル数で指定します。

font - string link

テキストのレンダリングに使用されるフォントの名前の文字列です。

TrueType フォントでは、これは通常フォントが含まれたファイルの名前となります (例: "DejaVuSans.ttf")。フォント集合の2つ目以降を選択するには、数字と記号を頭に付けます (例: "0@font.ttc" もしくは "1@font.ttc")。画像ベースのフォントでは、フォント登録時に使用された名前にする必要があります。

size - int link

スクリーン上のフォントの大きさ。ピクセル数として指定しますが、フォントファイルではこの値について別の解釈をするかもしれません。

italic - boolean link

True のとき、フォントを太字でレンダリングします。TrueType フォントでは、通常はフォントが全体的の傾くようになります。このプロパティーと config.font_replacement_map を使ってフォントを再マップすることもできます。

justify - boolean link

True のとき、単語間に空白が追加的に挿入され、各行の左右の余白が等しくなります。これは段落の最終行には適用されません。

kerning - float link

カーニングの調整で、各文字の間に追加されるスペースのピクセル数です。(これを負の値にしてスペースを削除することもできます。)

language - string link

複数の行への改行に使用する言語ファミリーを制御します。設定可能な値は:

"unicode" (既定値)

Unicode の改行アルゴリズムを用い、ほとんどの言語に適しています。

"japanese-strict"

日本語テキストの「厳密な」書き方です。小さい仮名文字と長音符の前では改行をしません。

"japanese-normal"

日本語テキストの「一般的な」書き方です。小さい仮名文字、長音符、いくつかのハイフンの前での改行を許可します。

"japanese-loose"

日本語テキストの「ゆるい」書き方です。小さい仮名文字、長音符、反復記号、分割できない文字、リーダー、接頭辞、接尾辞の前での改行を許可します。

"korean-with-spaces"

空白で区切られたハングル文字に使用します。隣接するハングルで改行されることを防ぎます。

"western"

空白以外の場所では改行をしません。ほとんどの言語に適しています。

3つの日本語の改行モードは CSS3 text module から引用しました。

layout - string link

単語が行にどのように割り当てられるかを制御します。設定可能な値は:

"tex" (既定値)

Knuth-Plass の改行アルゴリズムを使用し、最後の行以外のすべての行の長さの違いを最小限に抑えるようにします。

"subtitle"

Knuth-Plass の改行アルゴリズムを使用しますが、すべての行の長さを揃えるようにします。

"greedy"

単語が入るスペースが無いときだけ改行されます。

"nobreak"

改行されません。

line_leading - int link

各行の上に含められるスペースのピクセル数。

line_overlap_split - int link

スローテキストモードで2行にオーバーラップするとき、オーバーラップ用の数多いピクセルは一行目に割り当てられます。一行目の文字の下が欠ける場合に増やしてください。

line_spacing - int link

各行の下に含められるスペースのピクセル数。

min_width - int link

各行の最小幅を設定します。行がこの値よりも短い場合は、text_align によって指定された位置に余白を作り、この長さに調整されます。

newline_indent - boolean link

True のとき、文字列の最初の行が first_indent で設定された分だけインデントされます。それ以外の場合は rest_indent が使用されます。

outlines - list of tuple of (int, color, int, int) link

これはテキストの後ろに描画される輪郭のリストです。それぞれのタプルで輪郭を指定すると、輪郭が後ろから前にかけて描画されます。

リストには (size, color, xoffset, yoffset) というタプルを含めます。 size にはフォントを広げる量をピクセル数で、 color には輪郭の色を、 xoffsetyoffset には輪郭をずらす量をピクセル数で指定します。

外枠は機能的にはフォントに影を落とすためにも使用できます。これを行うには、サイズを0にしてオフセットを0以外にします。

デフォルトでは、 sizexoffset, yoffset はテキストと共に拡大縮小されます。 absolute 型が指定されると、拡大縮小されません。以下のようなコードは

style default:
    outlines [ (absolute(1), "#000", absolute(0), absolute(0)) ]

常に 1 ピクセルの幅を生成します。

外枠機能は TrueType フォントのみで動作します。

rest_indent - int link

段落の2行目以降のインデント量をピクセル数で指定します。

ruby_style - style or None link

None を設定するか、スタイルオブジェクトを設定します。これはルビテキストに使用されるスタイルです。

slow_cps - int or True link

数値の場合、ここで指定された文字数を1秒間に表示します。True のときは、「テキスト速度」設定の速度でテキストを表示します。

slow_cps_multiplier - float link

テキスト速度にこの数値が掛けられます。通常よりも速い速度で話すキャラクターがいるときに使用できます。

strikethrough - boolean link

True のとき、テキストの中央に線が描画されます。

text_align - float link

これは行がテキスト displayable の幅よりも短い場合に使用します。これによってテキストの左側に追加のスペースをどの程度入れるかを指定します。(つまりテキストの位置合わせです。)

0.0 で左寄せのテキスト、0.5 で中央揃えのテキスト、1.0 で右寄せのテキストとなります。

underline - boolean link

True のとき、テキストに下線が追加されます。

これは、テキスト中のハイパーリンクに関連する3つの関数のタプルです。

1つ目のアイテムはハイパーリンクのスタイルの関数です。単一のハイパーリンクの引数で呼び出されたとき、例えば style.hyperlink_text のようなハイパーリンクで使用するスタイルを返す必要があります。スタイルオブジェクトは文字列でないことに注意して下さい。

2つ目の引数はハイパーリンクがクリックされた時の関数です。この関数はハイパーリンクがユーザーにクリックされた時に呼び出されます。これが None 以外の値を返した場合、処理全体がその値を返します。

3つ目のアイテムはハイパーリンクのフォーカスの関数です。これはハイパーリンクにフォーカスが当てらてた時にハイパーリンクの引数とともに呼び出され、フォーカスを失った時は None を引数にして呼び出されます。これが None 以外の値を返した場合、処理全体がその値を返します。

vertical - boolean link

True のとき、テキストが縦書きでレンダリングされます。

hinting - str link

フォントのヒンティングを制御します。これは以下の文字列の一つであるべきです。

"auto"

デフォルトで、フリータイプのオートヒンティングを強制的に使用します。

"bytecode"

フォントのバイトコードのヒンティング情報を使用します。

"none"

フォントのヒンティングしますせん。

ウィンドウスタイルのプロパティー link

ウィンドウプロパティーは、ウィンドウ、フレーム、ボタンの外観を指定するときに使用します。

background - displayable or None link

ウィンドウの背景に使用される displayable。ここに Frame() を指定して、ウィンドウのサイズに合わせてサイズを変更できるようにすることが多いです。

None のときは背景が描画されませんが、他のプロパティーの機能によって背景があるように見せることもできます。

foreground - displayable or None link

None でない場合、ウィンドウの内容に重ねてこの displayable が描画されます。

left_margin - int link

背景の左にある透明なスペースの量を、ピクセル数で指定します。

right_margin - int link

背景の右にある透明なスペースの量を、ピクセル数で指定します。

xmargin - int link

left_margin と right_margin に同じ値を設定することと等価です。

top_margin - int link

背景の上にある透明なスペースの量を、ピクセル数で指定します。

bottom_margin - int link

背景の下にある透明なスペースの量を、ピクセル数で指定します。

ymargin - int link

top_margin と bottom_margin に同じ値を設定することと等価です。

margin - tuple link

二要素のタプルの指定は、 xmargin と ymargin にその二つの要素を設定するのと等価です。四要素のタプルの指定は、 left_margin と top_margin, right_margin, bottom_margin にその四つの要素を設定するのと等価です。

left_padding - int link

背景とウィンドウ内容の左端との間のスペース量を、ピクセル数で指定します。

right_padding - int link

背景とウィンドウ内容の右端との間のスペース量を、ピクセル数で指定します。

xpadding - int link

left_padding と right_padding に同じ値を設定することと等価です。

top_padding - int link

背景とウィンドウ内容の上端との間のスペースの量を、ピクセル数で指定します。

bottom_padding - int link

背景とウィンドウ内容の下端との間のスペースの量を、ピクセル数で指定します。

ypadding - int link

top_padding と bottom_padding に同じ値を設定することと等価です。

padding - tuple link

二要素のタプルの指定は、 xpadding と yapadding にその二つの要素を設定するのと等価です。四要素のタプルの指定は、 left_padding と top_padding, right_padding, bottom_padding にその四つの要素を設定するのと等価です。

size_group - string or None link

None を設定するか、文字列を設定します。Ren'Py は、すべての同じ size_group のウィンドウを同じ大きさでレンダリングします。

ボタンスタイルのプロパティー link

child - displayable or None link

None を設定するか、ボタンの子要素を置き換える displayable を設定します。例えば、insensitive_child を使うと無効なボタンの内容を画像によって置き換えることができ、ボタンがロックされていることを示すことができます。

hover_sound - string link

ボタンがフォーカスされた時に再生されるサウンド。

activate_sound - string link

ボタンがクリックされた時に再生されるサウンド。

mouse - string link

ボタンがフォーカスされた時に使われるマウスのスタイル。これは config.mouse の1スタイルでなければなりません。

focus_mask - multiple link

ボタンのどの部分をフォーカスでき、クリックできるかを制御するためのマスクです。このプロパティーの型によって、解釈のされ方が決まります。

Displayable

displayable の透明以外の領域でボタンがフォーカスされるようになります。

True

ボタン自身が displayable として使用されます (つまり、透明以外の領域でボタンがフォーカスされるようになります)。

callable

displayable 以外の callable (例えば、関数、メソッド、__call__ メソッドを持つオブジェクト) が与えられた場合、関数は2つの引数、displayable の左上角からの x, y 座標を伴って呼び出されます。関数の戻り値が True であれば、displayable がフォーカスされます。

None

None が与えられた場合、ボタン全体をフォーカスできます。

keyboard_focus - link

デフォルトは True で、このボタンはキーボードフォーカスシステムを使用してフォーカスを取られます。 False ならキーボードフォーカスシステムはこのボタンをスキップします。 ( キーボードフォーカスシステムはジョイスティックのようなキーボードやキーボード風なデバイスで使用されます )

key_events - link

True ならキーボードから生成されたイベントがこのボタンの子に渡されます。False ならそれらのイベントは渡されません。デフォルトのスタイルでは、ボタンにフォーカスがあれば True なければ False になります。

True なら ボタンにフォーカスがないときでもボタン内のインプットにキーボードイベントが渡されます。

バースタイルのプロパティー link

バーは左右の枠がともに描画され、クリックすることによってバーを少し移動することが出来ます。残りのスペースはバーの値を変更できる部分で、左右の量の比はバーの値に比例し、その値は可変範囲の分数となります。

つまみ (thumb) はバーの中央部分の領域で、ユーザーはここをドラッグすることができます。

バーが描画される時、つまみの影が最初に描画されます。次にバーの上下左右の端が描画され、最後にバーそのものが描画されます。

上で述べたバーの端は bar_vertical プロパティーによって変化することに注意して下さい。これが True のときは上下の端に対応し、それ以外のときは左右の端となります。

bar_vertical - boolean link

True のとき、バーは縦方向になります。False のときは、横方向になります。

bar_invert - boolean link

True のとき、バーの値は右/上端が基準となり、それ以外のときは左/下端が基準となります。

bar_resizing - boolean link

True のとき、バーの端をリサイズします。False のときは、バーの端をフルサイズでレンダリングし、それを切り抜きます。

left_gutter - int link

バーの左端の枠の大きさを、ピクセル数で指定します。

right_gutter - int link

バーの右端の枠の大きさを、ピクセル数で指定します。

top_gutter - int link

バーの上端の枠の大きさを、ピクセル数で指定します。

bottom_gutter - int link

バーの下端の枠の大きさを、ピクセル数で指定します。

left_bar - displayable link

バーの左端に使用される displayable。

right_bar - displayable link

バーの右端に使用される displayable。

top_bar - displayable link

バーの上端に使用される displayable。

bottom_bar - displayable link

バーの下端に使用される displayable。

base_bar - displayable link

left_bar/right_bar や top_bar/bottom_bar に使用される displayable です。( これは thumb と共にスライダーやスクロールバーの作成にも使えます。 )

thumb - displayable or None link

None を設定するか、バーの両端の境目に描かれる displayable を設定します。

thumb_shadow - displayable or None link

None を設定するか、バーの両端の境目に描かれる displayable を設定します。

thumb_offset - int link

ピクセル数でのつまみがバーをはみ出す量です。バーの左右が崩れないために、これをピクセル数でつまみの半分に設定しましょう。

mouse - string link

ボタンがフォーカスされた時に使われるマウスのスタイル。これは config.mouse の1スタイルでなければなりません。

unscrollable - string or None link

バーがスクロール不能な時の挙動を制御します(範囲が0に設定されていて、ビューポートが自身よりも小さい displayable を含んでいる場合に限る)。設定可能な値は3つあります:

None

バーを通常通りレンダリングします。

"insensitive"

バーを無効な状態でレンダリングします。これはバーのスタイルを変更し、使用できないことを意味させます。

"hide"

バーが全てレンダリングされることを防ぎます。スペースはバーのために確保されますが、そのスペースの箇所には何も描画されません。

keyboard_focus - link

デフォルトは True で、このボタンはキーボードフォーカスシステムを使用してフォーカスを取られます。 False ならキーボードフォーカスシステムはこのボタンをスキップします。 ( キーボードフォーカスシステムはジョイスティックのようなキーボードやキーボード風なデバイスで使用されます )

ボックススタイルのプロパティー link

これらは、水平または垂直にボックスをレイアウトするときに使用します。

spacing - int link

ボックス内の要素間のスペースをピクセル数で指定します。

first_spacing - int link

None を設定するか、ボックス内の1つ目の要素と2つ目の要素の間のスペースを、ピクセル数で設定します。これは、spacing プロパティーを上書きします。

box_reverse - boolean link

True のとき、ボックス内のアイテムの配置が逆転します。これが True のとき、hbox は右から左に埋められ、vbox は下から上に埋められます。既定値は False です。

box_wrap - boolean link

True のとき、ボックスは行や列の終端に達すると折り返されます。False (既定) のときは、行の終端を超えてボックスが配置されます。

order_reverse - boolean link

デフォルトでは False で、ボックスの要素は最初の要素が二番目の下に来るように、一つ目から最後まで描写されます。 True ならこの順番は逆になり、ボックスの最初の要素はボックスの他のすべての要素の上に来ます。

Fixed のスタイルプロパティー link

これらは fixed のレイアウトで使用されます。

fit_first - bool or "width" or "height" link

True なら fixed のサイズはその最初の要素のサイズと等しくなります。"width" なら幅のみが変更されます。(fixed は画面を縦に満たします。) 同様に、"height" なら高さのみが変更されます。

xfit - bool link

True なら、 fixed layout のサイズは fix の最も右側の子の右側面に水平に合わされます。

yfit - bool link

True なら、 fixed layout のサイズは fix の最も下側の子の下端に縦に合わされます。