1521 lines
84 KiB
HTML
1521 lines
84 KiB
HTML
<!DOCTYPE html>
|
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<head>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
<title>Style Properties — Ren'Py Documentation</title>
|
|
<link rel="stylesheet" href="_static/renpydoc.css" type="text/css" />
|
|
<link rel="stylesheet" href="_static/pygments.css" type="text/css" />
|
|
<link rel="stylesheet" type="text/css" href="_static/bootstrap-3.3.6/css/bootstrap.min.css" />
|
|
<link rel="stylesheet" type="text/css" href="_static/bootstrap-3.3.6/css/bootstrap-theme.min.css" />
|
|
<link rel="stylesheet" type="text/css" href="_static/bootstrap-sphinx.css" />
|
|
<script type="text/javascript" id="documentation_options" data-url_root="./" src="_static/documentation_options.js"></script>
|
|
<script type="text/javascript" src="_static/jquery.js"></script>
|
|
<script type="text/javascript" src="_static/underscore.js"></script>
|
|
<script type="text/javascript" src="_static/doctools.js"></script>
|
|
<script type="text/javascript" src="_static/language_data.js"></script>
|
|
<script type="text/javascript" src="_static/js/jquery-1.11.0.min.js"></script>
|
|
<script type="text/javascript" src="_static/js/jquery-fix.js"></script>
|
|
<script type="text/javascript" src="_static/bootstrap-3.3.6/js/bootstrap.min.js"></script>
|
|
<script type="text/javascript" src="_static/bootstrap-sphinx.js"></script>
|
|
<link rel="index" title="Index" href="genindex.html" />
|
|
<link rel="search" title="Search" href="search.html" />
|
|
<link rel="next" title="Screens and Screen Language" href="screens.html" />
|
|
<link rel="prev" title="Styles" href="style.html" />
|
|
<meta charset='utf-8'>
|
|
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
|
|
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1'>
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
|
|
</head><body>
|
|
|
|
<div id="navbar" class="navbar navbar-default navbar-fixed-top">
|
|
<div class="container">
|
|
<div class="navbar-header">
|
|
<!-- .btn-navbar is used as the toggle for collapsed navbar content -->
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".nav-collapse">
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
<a class="navbar-brand" href="index.html">
|
|
Ren'Py Documentation</a>
|
|
<span class="navbar-text navbar-version pull-left"><b>7.5.3</b></span>
|
|
</div>
|
|
|
|
<div class="collapse navbar-collapse nav-collapse">
|
|
<ul class="nav navbar-nav">
|
|
|
|
<li><a href="https://www.renpy.org">Home Page</a></li>
|
|
<li><a href="https://www.renpy.org/doc/html/">Online Documentation</a></li>
|
|
|
|
|
|
<li class="dropdown globaltoc-container">
|
|
<a role="button"
|
|
id="dLabelGlobalToc"
|
|
data-toggle="dropdown"
|
|
data-target="#"
|
|
href="index.html">Site <b class="caret"></b></a>
|
|
<ul class="dropdown-menu globaltoc"
|
|
role="menu"
|
|
aria-labelledby="dLabelGlobalToc"><ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="quickstart.html">Quickstart</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="gui.html">GUI Customization Guide</a></li>
|
|
</ul>
|
|
<ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="language_basics.html">Language Basics</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="label.html">Labels & Control Flow</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="dialogue.html">Dialogue and Narration</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="displaying_images.html">Displaying Images</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="menus.html">In-Game Menus</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="python.html">Python Statements</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="conditional.html">Conditional Statements</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="audio.html">Audio</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="movie.html">Movie</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="voice.html">Voice</a></li>
|
|
</ul>
|
|
<ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="text.html">Text</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="translation.html">Translation</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="displayables.html">Displayables</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="transforms.html">Transforms</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="transitions.html">Transitions</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="atl.html">Animation and Transformation Language</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="matrixcolor.html">Matrixcolor</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="layeredimage.html">Layered Images</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="3dstage.html">3D Stage</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="live2d.html">Live2D Cubism</a></li>
|
|
</ul>
|
|
<ul class="current">
|
|
<li class="toctree-l1"><a class="reference internal" href="style.html">Styles</a></li>
|
|
<li class="toctree-l1 current"><a class="current reference internal" href="#">Style Properties</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="screens.html">Screens and Screen Language</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="screen_actions.html">Screen Actions, Values, and Functions</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="screen_special.html">Special Screen Names</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="screen_optimization.html">Screen Language Optimization</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="config.html">Configuration Variables</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="preferences.html">Preference Variables</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="store_variables.html">Store Variables</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="mouse.html">Custom Mouse Cursors</a></li>
|
|
</ul>
|
|
<ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="launcher.html">Launcher</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="developer_tools.html">Developer Tools</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="director.html">Interactive Director</a></li>
|
|
</ul>
|
|
<ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="nvl_mode.html">NVL-Mode Tutorial</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="input.html">Text Input</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="side_image.html">Side Images</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="rooms.html">Image Gallery, Music Room, and Replay Actions</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="drag_drop.html">Drag and Drop</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="sprites.html">Sprites</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="keymap.html">Customizing the Keymap</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="achievement.html">Achievements</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="history.html">Dialogue History</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="multiple.html">Multiple Character Dialogue</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="splashscreen_presplash.html">Splashscreen and Presplash</a></li>
|
|
</ul>
|
|
<ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="statement_equivalents.html">Statement Equivalents</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="save_load_rollback.html">Saving, Loading, and Rollback</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="persistent.html">Persistent Data</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="trans_trans_python.html">Transforms and Transitions in Python</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="gui_advanced.html">Advanced GUI</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="screen_python.html">Screens and Python</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="modes.html">Modes</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="cdd.html">Creator-Defined Displayables</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="cds.html">Creator-Defined Statements</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="custom_text_tags.html">Custom Text Tags</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="character_callbacks.html">Character Callbacks</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="file_python.html">File Access</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="color_class.html">Color Class</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="matrix.html">Matrix</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="model.html">Model-Based Rendering</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="other.html">Other Functions and Variables</a></li>
|
|
</ul>
|
|
<ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="build.html">Building Distributions</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="updater.html">Web Updater</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="android.html">Android</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="chromeos.html">Chrome OS/Chromebook</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="ios.html">iOS</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="iap.html">In-App Purchasing</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="gesture.html">Gestures</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="raspi.html">Raspberry Pi</a></li>
|
|
</ul>
|
|
<ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="security.html">Security</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="problems.html">Dealing with Problems</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="environment_variables.html">Environment Variables</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="self_voicing.html">Self-Voicing</a></li>
|
|
</ul>
|
|
<ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="editor.html">Text Editor Integration</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="skins.html">Skins</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="translating_renpy.html">Translating Ren'Py</a></li>
|
|
</ul>
|
|
<ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="changelog.html">Changelog (Ren'Py 7.x-)</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="changelog6.html">Changelog (Ren'Py 6.11 - 6.99)</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="incompatible.html">Incompatible Changes</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="distributor.html">Distributor Notes</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="license.html">License</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="credits.html">Credits</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="sponsors.html">Ren'Py Development Sponsors</a></li>
|
|
</ul>
|
|
<ul>
|
|
<li class="toctree-l1"><a class="reference internal" href="thequestion.html">Script of The Question</a></li>
|
|
<li class="toctree-l1"><a class="reference internal" href="thequestion_nvl.html">NVL-mode script for The Question</a></li>
|
|
</ul>
|
|
</ul>
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
<form class="navbar-form navbar-right" action="search.html" method="get">
|
|
<div class="form-group">
|
|
<input type="text" name="q" class="form-control" placeholder="Search" />
|
|
</div>
|
|
<input type="hidden" name="check_keywords" value="yes" />
|
|
<input type="hidden" name="area" value="default" />
|
|
</form>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
<div id="sidebar" class="bs-sidenav" role="complementary"><ul>
|
|
<li><a class="reference internal" href="#">Style Properties</a><ul>
|
|
<li><a class="reference internal" href="#style-property-prefixes">Style Property Prefixes</a></li>
|
|
<li><a class="reference internal" href="#style-property-values">Style Property Values</a><ul>
|
|
<li><a class="reference internal" href="#style-prefix-search">Style Prefix Search</a></li>
|
|
</ul>
|
|
</li>
|
|
<li><a class="reference internal" href="#list-of-all-style-properties">List of All Style Properties</a><ul>
|
|
<li><a class="reference internal" href="#position-style-properties">Position Style Properties</a></li>
|
|
<li><a class="reference internal" href="#text-style-properties">Text Style Properties</a></li>
|
|
<li><a class="reference internal" href="#window-style-properties">Window Style Properties</a></li>
|
|
<li><a class="reference internal" href="#button-style-properties">Button Style Properties</a></li>
|
|
<li><a class="reference internal" href="#bar-style-properties">Bar Style Properties</a></li>
|
|
<li><a class="reference internal" href="#box-style-properties">Box Style Properties</a></li>
|
|
<li><a class="reference internal" href="#grid-style-properties">Grid Style Properties</a></li>
|
|
<li><a class="reference internal" href="#fixed-style-properties">Fixed Style Properties</a></li>
|
|
<li><a class="reference internal" href="#margin-style-properties">Margin Style Properties</a></li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="col-md-9 content">
|
|
|
|
<div class="section" id="style-properties">
|
|
<h1>Style Properties<a class="headerlink" href="#style-properties" title="Permalink to this headline"> link</a></h1>
|
|
<p>The style properties associated with <a class="reference internal" href="style.html"><span class="doc">styles</span></a> control how
|
|
Displayables are shown. Style properties can be either given without a prefix,
|
|
in which case they apply to all states of the displayable, or with a prefix
|
|
that limits the property to a limited number of states.</p>
|
|
<div class="section" id="style-property-prefixes">
|
|
<h2>Style Property Prefixes<a class="headerlink" href="#style-property-prefixes" title="Permalink to this headline"> link</a></h2>
|
|
<p>Applying a prefix to a style property indicates allows a displayable to change
|
|
it's look in response to its focus or selection status. For example, a button
|
|
can change its color when the mouse hovers above it, or to indicate when the
|
|
choice represented by the button is the currently selected one.</p>
|
|
<p>There are five states a displayable can be it.</p>
|
|
<dl class="docutils">
|
|
<dt><em class="dfn">insensitive</em></dt>
|
|
<dd>Used when the user cannot interact with the displayable.</dd>
|
|
<dt><em class="dfn">idle</em></dt>
|
|
<dd>Used when the displayable is neither focused nor selected.</dd>
|
|
<dt><em class="dfn">hover</em></dt>
|
|
<dd>Used when the displayable is focused, but not selected.</dd>
|
|
<dt><em class="dfn">selected_idle</em></dt>
|
|
<dd>Used when the displayable is not focused, and is selected.</dd>
|
|
<dt><em class="dfn">selected_hover</em></dt>
|
|
<dd>Used when the displayable is focused and selected.</dd>
|
|
</dl>
|
|
<p>Button and Bar displayables (and their variants) update their state, and the
|
|
state of their children, in response to events. For example, when the user
|
|
puts his mouse over an unselected button, it and all its children will be put
|
|
into the hover state.</p>
|
|
<p>Style property prefixes allow one to set style properties for the different
|
|
states. There is a system of implications set up, so that a prefix can imply
|
|
setting the property for more than one state.</p>
|
|
<p>The implications are:</p>
|
|
<table border="1" class="docutils">
|
|
<colgroup>
|
|
<col width="50%" />
|
|
<col width="50%" />
|
|
</colgroup>
|
|
<thead valign="bottom">
|
|
<tr class="row-odd"><th class="head">prefix</th>
|
|
<th class="head">states implied by prefix</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody valign="top">
|
|
<tr class="row-even"><td>(no prefix)</td>
|
|
<td>insensitive, idle, hover, selected_idle, selected_hover</td>
|
|
</tr>
|
|
<tr class="row-odd"><td><code class="docutils literal notranslate"><span class="pre">idle_</span></code></td>
|
|
<td>idle, selected_idle</td>
|
|
</tr>
|
|
<tr class="row-even"><td><code class="docutils literal notranslate"><span class="pre">hover_</span></code></td>
|
|
<td>hover, selected_hover</td>
|
|
</tr>
|
|
<tr class="row-odd"><td><code class="docutils literal notranslate"><span class="pre">selected_</span></code></td>
|
|
<td>selected_idle, selected_hover</td>
|
|
</tr>
|
|
<tr class="row-even"><td><code class="docutils literal notranslate"><span class="pre">insensitive_</span></code></td>
|
|
<td>insensitive</td>
|
|
</tr>
|
|
<tr class="row-odd"><td><code class="docutils literal notranslate"><span class="pre">selected_idle_</span></code></td>
|
|
<td>selected_idle</td>
|
|
</tr>
|
|
<tr class="row-even"><td><code class="docutils literal notranslate"><span class="pre">selected_hover_</span></code></td>
|
|
<td>selected_hover</td>
|
|
</tr>
|
|
<tr class="row-odd"><td><code class="docutils literal notranslate"><span class="pre">selected_insensitive_</span></code></td>
|
|
<td>selected_insensitive</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<p>Using a text button, we can show this in action. Text buttons use two styles
|
|
by default: <code class="docutils literal notranslate"><span class="pre">button</span></code> for the button itself, and <code class="docutils literal notranslate"><span class="pre">button_text</span></code> for the
|
|
text inside the button. The <a class="reference internal" href="#style-property-background"><code class="xref std std-propref docutils literal notranslate"><span class="pre">background</span></code></a> style property sets the
|
|
background of a button, while the <a class="reference internal" href="#style-property-color"><code class="xref std std-propref docutils literal notranslate"><span class="pre">color</span></code></a> property sets the color of
|
|
text.:</p>
|
|
<div class="highlight-renpy notranslate"><div class="highlight"><pre><span></span><span class="c1"># The button background is gray when insensitive, light</span>
|
|
<span class="c1"># blue when hovered, and dark blue otherwise.</span>
|
|
<span class="k">style</span> <span class="k">button</span><span class="p">:</span>
|
|
<span class="na">background</span> <span class="s2">"#006"</span>
|
|
<span class="na">insensitive_background</span> <span class="s2">"#444"</span>
|
|
<span class="na">hover_background</span> <span class="s2">"#00a"</span>
|
|
|
|
<span class="c1"># The button text is yellow when selected, and white</span>
|
|
<span class="c1"># otherwise.</span>
|
|
<span class="k">style</span> <span class="n">button_text</span><span class="p">:</span>
|
|
<span class="na">color</span> <span class="s2">"#fff"</span>
|
|
<span class="na">selected_color</span> <span class="s2">"#ff0"</span>
|
|
</pre></div>
|
|
</div>
|
|
</div>
|
|
<div class="section" id="style-property-values">
|
|
<h2>Style Property Values<a class="headerlink" href="#style-property-values" title="Permalink to this headline"> link</a></h2>
|
|
<p>Each style property expects a specific kind of data. Many of these are
|
|
standard Python types, but a few are novel. Here are descriptions of the
|
|
novel kinds of value a style property can expect.</p>
|
|
<dl class="docutils">
|
|
<dt><cite>position</cite></dt>
|
|
<dd><p class="first">Positions are used to specify locations relative to the upper-left
|
|
corner of the containing area. (For positions, the containing area is
|
|
given by the layout the displayable is in, if one is given, or the screen
|
|
otherwise. For anchors, the containing area is the size of the
|
|
displayable itself.)</p>
|
|
<p>The way a position value is interpreted depends on the type of the
|
|
value:</p>
|
|
<dl class="last docutils">
|
|
<dt>int (like 0, 1, 37, or 42)</dt>
|
|
<dd>An integer is interpreted as the number of pixels from the left
|
|
or top side of the containing area.</dd>
|
|
<dt>float (like 0.0, 0.5, or 1.0)</dt>
|
|
<dd>A floating-point number is interpreted as a fraction of the
|
|
containing area. For example, 0.5 is a point halfway between the
|
|
sides of the containing area, while 1.0 is on the right or bottom
|
|
side.</dd>
|
|
<dt>absolute (like absolute(100.25))</dt>
|
|
<dd>An <code class="docutils literal notranslate"><span class="pre">absolute</span></code> number is interpreted as the number of pixels from the
|
|
left or top side of the screen, when using subpixel-precise rendering.</dd>
|
|
</dl>
|
|
</dd>
|
|
<dt><cite>displayable</cite></dt>
|
|
<dd>Any displayable. If a displayable contains a "[prefix_]" substitution,
|
|
a prefix search is performed as described below.</dd>
|
|
<dt><cite>color</cite></dt>
|
|
<dd><p class="first">Colors in Ren'Py can be expressed as strings beginning with the hash
|
|
mark (#), followed by a hex triple or hex quadruple, with each of the
|
|
three or four elements consisting of a one or two hexadecimal character
|
|
color code.</p>
|
|
<p>In a triple, the components represent red, green, and blue. In a
|
|
quadruple, the components represent red, green, blue, and alpha. For
|
|
example:</p>
|
|
<ul class="simple">
|
|
<li><code class="docutils literal notranslate"><span class="pre">"#f00"</span></code> and <code class="docutils literal notranslate"><span class="pre">"#ff0000"</span></code> represent an opaque red color.</li>
|
|
<li><code class="docutils literal notranslate"><span class="pre">"#0f08"</span></code> and <code class="docutils literal notranslate"><span class="pre">#00ff0080"</span></code> represent a semi-transparent green
|
|
color.</li>
|
|
</ul>
|
|
<p>The color triples are the same as used in HTML.</p>
|
|
<p>Colors can also be represented as a 4-component tuple, with the 4
|
|
components being integers between 0 and 255. The components correspond to
|
|
red, green, blue, and alpha, in that order.</p>
|
|
<ul class="simple">
|
|
<li><code class="docutils literal notranslate"><span class="pre">(0,</span> <span class="pre">0,</span> <span class="pre">255,</span> <span class="pre">255)</span></code> represents an opaque blue color.</li>
|
|
</ul>
|
|
<p class="last">Finally, colors can be an instance of <a class="reference internal" href="color_class.html#Color" title="Color"><code class="xref py py-class docutils literal notranslate"><span class="pre">Color</span></code></a>.</p>
|
|
</dd>
|
|
</dl>
|
|
<div class="section" id="style-prefix-search">
|
|
<span id="id1"></span><h3>Style Prefix Search<a class="headerlink" href="#style-prefix-search" title="Permalink to this headline"> link</a></h3>
|
|
<p>When a style property contains the "[prefix_]" substitution, a prefix
|
|
search is performed. The prefix search is performed separately for
|
|
each state, including states that are implied by the original property
|
|
assigned.</p>
|
|
<p>For example, if we have:</p>
|
|
<div class="highlight-renpy notranslate"><div class="highlight"><pre><span></span><span class="k">style</span> <span class="k">button</span><span class="p">:</span>
|
|
<span class="na">hover_background</span> <span class="s2">"[prefix_]background.png"</span>
|
|
</pre></div>
|
|
</div>
|
|
<p>separate searches are performed for the hover and selected_hover states. The
|
|
prefixes searched vary based on the state.</p>
|
|
<table border="1" class="docutils">
|
|
<colgroup>
|
|
<col width="50%" />
|
|
<col width="50%" />
|
|
</colgroup>
|
|
<thead valign="bottom">
|
|
<tr class="row-odd"><th class="head">state</th>
|
|
<th class="head">search order</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody valign="top">
|
|
<tr class="row-even"><td>idle</td>
|
|
<td>"idle_", ""</td>
|
|
</tr>
|
|
<tr class="row-odd"><td>hover</td>
|
|
<td>"hover_", "",</td>
|
|
</tr>
|
|
<tr class="row-even"><td>insensitive</td>
|
|
<td>"insensitive_", "", "idle_"</td>
|
|
</tr>
|
|
<tr class="row-odd"><td>selected_idle</td>
|
|
<td>"selected_idle_", "idle_", "selected_", ""</td>
|
|
</tr>
|
|
<tr class="row-even"><td>selected_hover</td>
|
|
<td>"selected_hover_", "hover_", "selected_", ""</td>
|
|
</tr>
|
|
<tr class="row-odd"><td>selected_insensitive</td>
|
|
<td>"selected_insensitive_", "hover_", "selected_", "", "selected_idle_", "idle_"</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<p>When a search is performed, each prefix is tried in the order given. The string
|
|
has "[prefix_]" replaced with the prefix, and then Ren'Py checks to see if
|
|
a loadable file or image with that name exists. If the file or image exists,
|
|
the search stops and the displayable found is used. Otherwise, it proceeds to
|
|
the next prefix.</p>
|
|
<p>The style prefix is passed through displayables that do not take user input,
|
|
including containers, transforms, and frames.</p>
|
|
<p>As an example of how this can be used, if the files "idle_button.png" and
|
|
"hover_button.png" exist (and no other files ending in "button.png" do):</p>
|
|
<div class="highlight-renpy notranslate"><div class="highlight"><pre><span></span><span class="k">style</span> <span class="k">button</span><span class="p">:</span>
|
|
<span class="na">background</span> <span class="s2">"[prefix_]button.png"</span>
|
|
</pre></div>
|
|
</div>
|
|
<p>is equivalent to:</p>
|
|
<div class="highlight-renpy notranslate"><div class="highlight"><pre><span></span><span class="k">style</span> <span class="k">button</span><span class="p">:</span>
|
|
<span class="na">idle_background</span> <span class="s2">"idle_button.png"</span>
|
|
<span class="na">hover_background</span> <span class="s2">"hover_button.png"</span>
|
|
<span class="na">insensitive_background</span> <span class="s2">"idle_button.png"</span>
|
|
|
|
<span class="na">selected_idle_background</span> <span class="s2">"idle_button.png"</span>
|
|
<span class="na">selected_hover_background</span> <span class="s2">"hover_button.png"</span>
|
|
<span class="na">selected_insensitive_background</span> <span class="s2">"idle_button.png"</span>
|
|
</pre></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="section" id="list-of-all-style-properties">
|
|
<h2>List of All Style Properties<a class="headerlink" href="#list-of-all-style-properties" title="Permalink to this headline"> link</a></h2>
|
|
<p>The style properties control the look of the various displayables. Not all
|
|
style properties apply to all displayables, so we've divided them up into
|
|
groups.</p>
|
|
<div class="section" id="position-style-properties">
|
|
<span id="id2"></span><h3>Position Style Properties<a class="headerlink" href="#position-style-properties" title="Permalink to this headline"> link</a></h3>
|
|
<p>These properties apply to all displayables, and mostly control the
|
|
position of a displayable inside the area allocated to it by a layout,
|
|
or on the screen when not inside a layout.</p>
|
|
<dl class="style-property">
|
|
<dt id="style-property-alt">
|
|
<code class="descname">alt</code> - string or None<a class="headerlink" href="#style-property-alt" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Alternative text used for the displayable when self-voicing is
|
|
enabled. See the <a class="reference internal" href="self_voicing.html"><span class="doc">self voicing</span></a> section for
|
|
more information.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xpos">
|
|
<code class="descname">xpos</code> - position<a class="headerlink" href="#style-property-xpos" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The position of the displayable relative to the left side of the
|
|
containing area.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-ypos">
|
|
<code class="descname">ypos</code> - position<a class="headerlink" href="#style-property-ypos" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The position of the displayable relative to the top side of the
|
|
containing area.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-pos">
|
|
<code class="descname">pos</code> - tuple of (position, position)<a class="headerlink" href="#style-property-pos" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting xpos to the first component of the tuple,
|
|
and ypos to the second component of the tuple.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xanchor">
|
|
<code class="descname">xanchor</code> - position<a class="headerlink" href="#style-property-xanchor" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The position of the anchor relative to the left side of the
|
|
displayable.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-yanchor">
|
|
<code class="descname">yanchor</code> - position<a class="headerlink" href="#style-property-yanchor" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The position of the anchor relative to the top side of the
|
|
displayable.</p>
|
|
<p>If the displayable is a <a class="reference internal" href="text.html#Text" title="Text"><code class="xref py py-func docutils literal notranslate"><span class="pre">Text()</span></code></a>, then there is one special value
|
|
of this property. If the property is set to renpy.BASELINE, the anchor
|
|
is set to the baseline of the first line of text.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-anchor">
|
|
<code class="descname">anchor</code> - tuple of (position, position)<a class="headerlink" href="#style-property-anchor" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting xanchor to the first component of the tuple,
|
|
and yanchor to the second component of the tuple.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xalign">
|
|
<code class="descname">xalign</code> - float<a class="headerlink" href="#style-property-xalign" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting xpos and xanchor to the same value. This has
|
|
the effect of placing the displayable at a relative location on
|
|
the screen, with 0.0 being the left side, 0.5 the center, and 1.0
|
|
being the right side.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-yalign">
|
|
<code class="descname">yalign</code> - float<a class="headerlink" href="#style-property-yalign" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting ypos and yanchor to the same value. This has
|
|
the effect of placing the displayable at a relative location on
|
|
the screen, with 0.0 being the top, 0.5 the center, and 1.0
|
|
the bottom.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-align">
|
|
<code class="descname">align</code> - tuple of (float, float)<a class="headerlink" href="#style-property-align" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting xalign to the first component of the tuple,
|
|
and yalign to the second.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xcenter">
|
|
<code class="descname">xcenter</code> - position<a class="headerlink" href="#style-property-xcenter" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting xpos to the value of this property, and
|
|
xanchor to 0.5.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-ycenter">
|
|
<code class="descname">ycenter</code> - position<a class="headerlink" href="#style-property-ycenter" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting ypos to the value of this property, and
|
|
yanchor to 0.5.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xoffset">
|
|
<code class="descname">xoffset</code> - int<a class="headerlink" href="#style-property-xoffset" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Gives a number of pixels that are added to the horizontal position
|
|
computed using xpos and xalign.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-yoffset">
|
|
<code class="descname">yoffset</code> - int<a class="headerlink" href="#style-property-yoffset" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Gives a number of pixels that are added to the vertical position
|
|
computed using ypos and yalign.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-offset">
|
|
<code class="descname">offset</code> - tuple of (int, int)<a class="headerlink" href="#style-property-offset" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting xoffset to the first component of the tuple,
|
|
and yoffset to the second component of the tuple.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xmaximum">
|
|
<code class="descname">xmaximum</code> - int<a class="headerlink" href="#style-property-xmaximum" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Specifies the maximum horizontal size of the displayable, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-ymaximum">
|
|
<code class="descname">ymaximum</code> - int<a class="headerlink" href="#style-property-ymaximum" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Specifies the maximum vertical size of the displayable in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-maximum">
|
|
<code class="descname">maximum</code> - tuple of (int, int)<a class="headerlink" href="#style-property-maximum" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting xmaximum to the first component of the
|
|
tuple, and ymaximum to the second.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xminimum">
|
|
<code class="descname">xminimum</code> - int<a class="headerlink" href="#style-property-xminimum" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Sets the minimum width of the displayable, in pixels. Only works
|
|
with displayables that can vary their size.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-yminimum">
|
|
<code class="descname">yminimum</code> - int<a class="headerlink" href="#style-property-yminimum" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Sets the minimum height of the displayables, in pixels. Only works
|
|
with displayables that can vary their size.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-minimum">
|
|
<code class="descname">minimum</code> - tuple of (int, int)<a class="headerlink" href="#style-property-minimum" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting xminimum to the first component of the
|
|
tuple, and yminimum to the second.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xsize">
|
|
<code class="descname">xsize</code> - int<a class="headerlink" href="#style-property-xsize" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting xminimum and xmaximum to the same value. This
|
|
has the effect of setting the width of the displayable.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-ysize">
|
|
<code class="descname">ysize</code> - int<a class="headerlink" href="#style-property-ysize" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting yminimum and ymaximum to the same value. This
|
|
has the effect of setting the height of the displayable.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xysize">
|
|
<code class="descname">xysize</code> - tuple of (int, int)<a class="headerlink" href="#style-property-xysize" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting xminimum and xmaximum to the first component of
|
|
the tuple, and yminimum and ymaximum to the second component. This
|
|
has the effect of setting the size of the displayable.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xfill">
|
|
<code class="descname">xfill</code> - boolean<a class="headerlink" href="#style-property-xfill" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If true, the displayable will expand to fill all available
|
|
horizontal space. If not true, it will only be large enough to
|
|
contain its children.</p>
|
|
<p>This only works for displayables that can change size.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-yfill">
|
|
<code class="descname">yfill</code> - boolean<a class="headerlink" href="#style-property-yfill" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If true, the displayable will expand to fill all available
|
|
vertical space. If not true, it will only be large enough to
|
|
contain its children.</p>
|
|
<p>This only works for displayables that can change size.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-area">
|
|
<code class="descname">area</code> - tuple of (int, int, int, int)<a class="headerlink" href="#style-property-area" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The tuple is interpreted as (<cite>xpos</cite>, <cite>ypos</cite>, <cite>width</cite>,
|
|
<cite>height</cite>). Attempts to position the displayable such that it's
|
|
upper-left corner is at <cite>xpos</cite> and <cite>ypos</cite>, and its size is <cite>width</cite>
|
|
and <cite>height</cite>.</p>
|
|
<p>It does this by setting the xpos, ypos, xanchor, yanchor,
|
|
xmaximum, ymaximum, xminimum, yminimum, xfill, and yfill
|
|
properties to appropriate values.</p>
|
|
<p>This will not work with all displayables and all layouts.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-mipmap">
|
|
<code class="descname">mipmap</code> - boolean or None<a class="headerlink" href="#style-property-mipmap" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>This controls if textures created by this displayable are mipmapped.
|
|
This applies only to certain displayables, including <a class="reference internal" href="text.html#Text" title="Text"><code class="xref py py-func docutils literal notranslate"><span class="pre">Text()</span></code></a>,
|
|
<a class="reference internal" href="movie.html#Movie" title="Movie"><code class="xref py py-func docutils literal notranslate"><span class="pre">Movie()</span></code></a>, and dissolves.</p>
|
|
<p>If None, the default for this is taken from config variables such
|
|
as <a class="reference internal" href="config.html#var-config.mipmap_text"><code class="xref std std-var docutils literal notranslate"><span class="pre">config.mipmap_text</span></code></a>, <a class="reference internal" href="config.html#var-config.mipmap_movies"><code class="xref std std-var docutils literal notranslate"><span class="pre">config.mipmap_movies</span></code></a>, and
|
|
<a class="reference internal" href="config.html#var-config.mipmap_dissolves"><code class="xref std std-var docutils literal notranslate"><span class="pre">config.mipmap_dissolves</span></code></a>.</p>
|
|
</dd></dl>
|
|
|
|
</div>
|
|
<div class="section" id="text-style-properties">
|
|
<span id="id3"></span><h3>Text Style Properties<a class="headerlink" href="#text-style-properties" title="Permalink to this headline"> link</a></h3>
|
|
<dl class="style-property">
|
|
<dt id="style-property-antialias">
|
|
<code class="descname">antialias</code> - boolean<a class="headerlink" href="#style-property-antialias" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, the default, TrueType font text will be rendered
|
|
anti-aliased.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-adjust_spacing">
|
|
<code class="descname">adjust_spacing</code> - boolean or str<a class="headerlink" href="#style-property-adjust_spacing" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, Ren'Py will adjust the spacing of drawable-resolution text
|
|
to match the spacing of the text rendered at virtual resolution, to
|
|
ensure the size of frames and other containers holding text does not
|
|
change.</p>
|
|
<p>When set to False, text will not change in size, but it is the creator's
|
|
responsibility to ensure there is enough space to layout text at any
|
|
window size.</p>
|
|
<p>When set to the string "horizontal", text will adjust in the horizontal
|
|
direction only. When set to the string "vertical", text will adjust in
|
|
the vertical direction only.</p>
|
|
<p>Defaults to True for most text, but False for text in an <code class="docutils literal notranslate"><span class="pre">input</span></code>.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-altruby_style">
|
|
<code class="descname">altruby_style</code> - style or None<a class="headerlink" href="#style-property-altruby_style" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If not None, this should be a style object. The style that's used for
|
|
alternate ruby text.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-black_color">
|
|
<code class="descname">black_color</code> - color<a class="headerlink" href="#style-property-black_color" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>When rendering an image-based font, black will be mapped to this
|
|
color. This has no effect for TrueType fonts.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-bold">
|
|
<code class="descname">bold</code> - boolean<a class="headerlink" href="#style-property-bold" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, render the font in a bold style. For a TrueType font,
|
|
this usually involves synthetically increasing the font weight. It
|
|
can also cause the font to be remapped, using
|
|
<a class="reference internal" href="config.html#var-config.font_replacement_map"><code class="xref std std-var docutils literal notranslate"><span class="pre">config.font_replacement_map</span></code></a>.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-caret">
|
|
<code class="descname">caret</code> - displayable or None<a class="headerlink" href="#style-property-caret" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If not None, this should be a displayable. The input widget will
|
|
use this as the caret at the end of the text. If None, a 1 pixel
|
|
wide blinking line is used as the caret.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-color">
|
|
<code class="descname">color</code> - color<a class="headerlink" href="#style-property-color" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The color the text is rendered in. When using a TrueType font,
|
|
the font is rendered in this color. When using an image-based
|
|
font, white is mapped to this color.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-first_indent">
|
|
<code class="descname">first_indent</code> - int<a class="headerlink" href="#style-property-first_indent" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The amount that the first line of text in a paragraph is indented
|
|
by, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-font">
|
|
<code class="descname">font</code> - string<a class="headerlink" href="#style-property-font" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>A string giving the name of the font used to render text.</p>
|
|
<p>For a TrueType font file, this is usually the name of the file
|
|
containing the font (like <code class="docutils literal notranslate"><span class="pre">"DejaVuSans.ttf"</span></code>). To select a second
|
|
font in a collection, this can be prefixed with a number and
|
|
at sign (like <code class="docutils literal notranslate"><span class="pre">"0@font.ttc"</span></code> or <code class="docutils literal notranslate"><span class="pre">"1@font.ttc"</span></code>). For an
|
|
image-based font, this should be the name used to register the
|
|
font.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-size">
|
|
<code class="descname">size</code> - int<a class="headerlink" href="#style-property-size" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The size of the font on the screen. While this is nominally in
|
|
pixels, font files may have creative interpretations of this
|
|
value.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-italic">
|
|
<code class="descname">italic</code> - boolean<a class="headerlink" href="#style-property-italic" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If true, the text will be rendered in italics. For a TrueType font,
|
|
this usually involves synthetically increasing the font slant. It
|
|
can also cause the font to be remapped, using
|
|
<a class="reference internal" href="config.html#var-config.font_replacement_map"><code class="xref std std-var docutils literal notranslate"><span class="pre">config.font_replacement_map</span></code></a>.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-justify">
|
|
<code class="descname">justify</code> - boolean<a class="headerlink" href="#style-property-justify" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, additional whitespace is inserted between words so that
|
|
the left and right margins of each line are even. This is not
|
|
performed on the last line of a paragraph.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-kerning">
|
|
<code class="descname">kerning</code> - float<a class="headerlink" href="#style-property-kerning" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>A kerning adjustment, the number of pixels of space that's added
|
|
between each pair of characters. (This can be negative to remove
|
|
space between characters.)</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-language">
|
|
<code class="descname">language</code> - string<a class="headerlink" href="#style-property-language" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Controls the language family used to break text into lines. Legal
|
|
values are:</p>
|
|
<dl class="docutils">
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"unicode"</span></code> (default)</dt>
|
|
<dd>Uses the Unicode linebreaking algorithm, which is suitable for
|
|
most languages.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"japanese-strict"</span></code></dt>
|
|
<dd>Formats Japanese text in a "strict" manner. It
|
|
forbids breaks before small kana and prolonged sound marks.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"japanese-normal"</span></code></dt>
|
|
<dd>Formats Japanese text in a "normal" manner. It
|
|
allows breaks before small kana, prolonged sound marks, and
|
|
certain hyphens.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"japanese-loose"</span></code></dt>
|
|
<dd>Formats Japanese text in a "loose" manner. It allows breaks
|
|
before small kana , prolonged sound marks, iteration marks,
|
|
inseparable characters, centered punctuation marks, and postfixes;
|
|
and allows breaks before prefixes.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"korean-with-spaces"</span></code></dt>
|
|
<dd>Used for Korean text delimited by whitespace. This prevents linebreaking
|
|
between adjacent Korean characters.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"western"</span></code></dt>
|
|
<dd>Allows breaking only at whitespace. Suitable for most
|
|
languages.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"anywhere"</span></code></dt>
|
|
<dd>Allows breaking at anywhere without ruby.</dd>
|
|
</dl>
|
|
<p>The three Japanese breaking modes are taken from the <a class="reference external" href="http://www.w3.org/TR/css3-text/#line-break">CSS3 text module</a>.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-layout">
|
|
<code class="descname">layout</code> - string<a class="headerlink" href="#style-property-layout" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Controls how words are allocated to lines. Legal values are:</p>
|
|
<dl class="docutils">
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"tex"</span></code> (default)</dt>
|
|
<dd>Uses the Knuth-Plass linebreaking algorithm, which attempts to minimize
|
|
the difference in line lengths of all but the last line.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"subtitle"</span></code></dt>
|
|
<dd>Uses the Knuth-Plass linebreaking algorithm, but attempts to even out
|
|
the lengths of all lines.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"greedy"</span></code></dt>
|
|
<dd>A word is placed on the first line that has room for it.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"nobreak"</span></code></dt>
|
|
<dd>Do not line-break.</dd>
|
|
</dl>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-line_leading">
|
|
<code class="descname">line_leading</code> - int<a class="headerlink" href="#style-property-line_leading" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The number of pixels of spacing to include above each line.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-line_overlap_split">
|
|
<code class="descname">line_overlap_split</code> - int<a class="headerlink" href="#style-property-line_overlap_split" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>When in slow text mode, and two lines overlap, this many pixels of
|
|
the overlap are allocated to the top line. Increase this if the
|
|
bottoms of characters on the top line are clipped.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-line_spacing">
|
|
<code class="descname">line_spacing</code> - int<a class="headerlink" href="#style-property-line_spacing" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The number of pixels of spacing to include below each line.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-min_width">
|
|
<code class="descname">min_width</code> - int<a class="headerlink" href="#style-property-min_width" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Sets the minimum width of each line of that. If a line is shorter
|
|
than this, it is padded to this length, with <code class="docutils literal notranslate"><span class="pre">text_align</span></code> used to
|
|
specify where such padding is placed.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-newline_indent">
|
|
<code class="descname">newline_indent</code> - boolean<a class="headerlink" href="#style-property-newline_indent" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If true, the <a class="reference internal" href="#style-property-first_indent"><code class="xref std std-propref docutils literal notranslate"><span class="pre">first_indent</span></code></a> indentation is used after
|
|
each newline in a string. Otherwise, the <a class="reference internal" href="#style-property-rest_indent"><code class="xref std std-propref docutils literal notranslate"><span class="pre">rest_indent</span></code></a>
|
|
indentation is used.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-outlines">
|
|
<code class="descname">outlines</code> - list of tuple of (int, color, int, int)<a class="headerlink" href="#style-property-outlines" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>This is a list of outlines that are drawn behind the text. Each
|
|
tuple specifies an outline, and outlines are drawn from back to
|
|
front.</p>
|
|
<p>The list contains (<cite>size</cite>, <cite>color</cite>, <cite>xoffset</cite>, <cite>yoffset</cite>)
|
|
tuples. <cite>size</cite> is the amount the font is expanded by, in
|
|
pixels. <cite>color</cite> is the color of the outline. <cite>xoffset</cite> and
|
|
<cite>yoffset</cite> are the amount the outline is shifted by, in pixels.</p>
|
|
<p>The outline functionality can also be used to give drop-shadows to
|
|
fonts, by specifying a size of 0 and non-zero offsets.</p>
|
|
<p>By default, <cite>size</cite>, <cite>xoffset</cite> and <cite>yoffset</cite> are scaled with the text.
|
|
When given as the absolute type, they are not scaled. For example:</p>
|
|
<div class="highlight-renpy notranslate"><div class="highlight"><pre><span></span><span class="k">style</span> <span class="k">default</span><span class="p">:</span>
|
|
<span class="na">outlines</span> <span class="p">[</span> <span class="p">(</span><span class="n">absolute</span><span class="p">(</span><span class="mi">1</span><span class="p">),</span> <span class="s2">"#000"</span><span class="p">,</span> <span class="n">absolute</span><span class="p">(</span><span class="mi">0</span><span class="p">),</span> <span class="n">absolute</span><span class="p">(</span><span class="mi">0</span><span class="p">))</span> <span class="p">]</span>
|
|
</pre></div>
|
|
</div>
|
|
<p>will always produce a 1 pixel-wide border.</p>
|
|
<p>Outlines only work with TrueType fonts. Outlines only work when applied
|
|
to an entire Text displayable. They do not work when applied to a hyperlink,
|
|
text tag, or other method that applies to only a portion of the text.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-outline_scaling">
|
|
<code class="descname">outline_scaling</code> - string<a class="headerlink" href="#style-property-outline_scaling" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>This determines how outline sizes and offsets are scaled when the
|
|
window is scaled.</p>
|
|
<dl class="docutils">
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"linear"</span></code></dt>
|
|
<dd><p class="first">The default, best for text with thick outlines. The window scaling factor
|
|
is applied to the outline size, and then rounded to an integer.
|
|
This looks better for thick outlines, but concentric outlines of similar
|
|
thickness may become indistinguishable.</p>
|
|
<p class="last">The resulting width is always at least 1 pixel.</p>
|
|
</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"step"</span></code></dt>
|
|
<dd><p class="first">Best for text that uses thin outlines and text
|
|
that uses multiple outlines. The window scaling factor is
|
|
rounded down to an integer and applied to the outline size
|
|
and offsets. This ensures that multiple outlines all scale together,
|
|
without risk of eclipsing one another, but this yields different visual
|
|
results depending on the size of the game window.</p>
|
|
<p class="last">The window scaling factor is always above 1.</p>
|
|
</dd>
|
|
</dl>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-rest_indent">
|
|
<code class="descname">rest_indent</code> - int<a class="headerlink" href="#style-property-rest_indent" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Specifies the number of pixels the second and later lines in a
|
|
paragraph are indented by.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-ruby_style">
|
|
<code class="descname">ruby_style</code> - style or None<a class="headerlink" href="#style-property-ruby_style" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If not None, this should be a style object. The style that's used for
|
|
ruby text.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-slow_abortable">
|
|
<code class="descname">slow_abortable</code> - boolean<a class="headerlink" href="#style-property-slow_abortable" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, a click that reaches the Text object will cause the slow
|
|
text to abort, which means that the rest of the slow text will be
|
|
displayed instantly.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-slow_cps">
|
|
<code class="descname">slow_cps</code> - int or True<a class="headerlink" href="#style-property-slow_cps" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If a number, shows text at the rate of that many characters per
|
|
second. If True, shows text at the speed taken from the "Text
|
|
Speed" preference.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-slow_cps_multiplier">
|
|
<code class="descname">slow_cps_multiplier</code> - float<a class="headerlink" href="#style-property-slow_cps_multiplier" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The speed of the text is multiplied by this number. This can be
|
|
used to have a character that speaks at a faster-than-normal rate
|
|
of speed.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-strikethrough">
|
|
<code class="descname">strikethrough</code> - boolean<a class="headerlink" href="#style-property-strikethrough" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, a line is drawn through the text.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-text_align">
|
|
<code class="descname">text_align</code> - float<a class="headerlink" href="#style-property-text_align" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>This is used when a line is shorter than the width of the text
|
|
displayable. It determines how much of the extra space is placed
|
|
on the left side of the text. (And hence, the text alignment.)</p>
|
|
<p>0.0 will yield left-aligned text, 0.5 centered text, and 1.0
|
|
right-aligned text.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-underline">
|
|
<code class="descname">underline</code> - boolean<a class="headerlink" href="#style-property-underline" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, an underline will be added to the text.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-hyperlink_functions">
|
|
<code class="descname">hyperlink_functions</code> - tuple of (function, function, function)<a class="headerlink" href="#style-property-hyperlink_functions" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>This is a tuple of three functions relating to hyperlinks in text.</p>
|
|
<p>The first item is the hyperlink style function. When called with a single
|
|
argument, the argument of the hyperlink, it must return a style object to
|
|
use for the hyperlink, such as <code class="docutils literal notranslate"><span class="pre">style.hyperlink_text</span></code>. Note that a
|
|
style object is not a string.</p>
|
|
<p>The second item is the hyperlink clicked function. This function is called
|
|
when a hyperlink is chosen by the user. If it returns a value other than
|
|
None, the interaction returns that value.</p>
|
|
<p>The third item is the hyperlink focus function. This function is called
|
|
with the argument of the hyperlink when the hyperlink gains focus, and
|
|
with None when it loses focus. If it returns a value other than None,
|
|
the interaction returns that value.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-vertical">
|
|
<code class="descname">vertical</code> - boolean<a class="headerlink" href="#style-property-vertical" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, the text will be rendered vertically.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-hinting">
|
|
<code class="descname">hinting</code> - str<a class="headerlink" href="#style-property-hinting" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Controls how the font will be hinted. This should be one of the following
|
|
strings:</p>
|
|
<dl class="docutils">
|
|
<dt>"auto"</dt>
|
|
<dd>The default, forces use of the Freetype auto hinter.</dd>
|
|
<dt>"bytecode"</dt>
|
|
<dd>Uses bytecode hinting information found in the font.</dd>
|
|
<dt>"none"</dt>
|
|
<dd>Does not hint the font.</dd>
|
|
</dl>
|
|
</dd></dl>
|
|
|
|
</div>
|
|
<div class="section" id="window-style-properties">
|
|
<span id="id4"></span><h3>Window Style Properties<a class="headerlink" href="#window-style-properties" title="Permalink to this headline"> link</a></h3>
|
|
<p>Window properties are used to specify the look of windows, frames, and
|
|
buttons. <a class="reference internal" href="#margin-style-properties"><span class="std std-ref">Margin Style Properties</span></a> also form part of this group.</p>
|
|
<dl class="style-property">
|
|
<dt id="style-property-background">
|
|
<code class="descname">background</code> - displayable or None<a class="headerlink" href="#style-property-background" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>A displayable that is used as the background of the window. This
|
|
is often a <a class="reference internal" href="displayables.html#Frame" title="Frame"><code class="xref py py-func docutils literal notranslate"><span class="pre">Frame()</span></code></a>, allowing the size of the background to
|
|
scale with the size of the window.</p>
|
|
<p>If None, no background is drawn, but other properties function as
|
|
if the background was present.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-foreground">
|
|
<code class="descname">foreground</code> - displayable or None<a class="headerlink" href="#style-property-foreground" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If not None, this displayable is drawn above the contents of the
|
|
window.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-left_padding">
|
|
<code class="descname">left_padding</code> - int<a class="headerlink" href="#style-property-left_padding" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The amount of space between the background and the left side of
|
|
the window content, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-right_padding">
|
|
<code class="descname">right_padding</code> - int<a class="headerlink" href="#style-property-right_padding" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The amount of space between the background and the right side of
|
|
the window content, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xpadding">
|
|
<code class="descname">xpadding</code> - int<a class="headerlink" href="#style-property-xpadding" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting left_padding and right_padding to the same
|
|
value.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-top_padding">
|
|
<code class="descname">top_padding</code> - int<a class="headerlink" href="#style-property-top_padding" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The amount of space between the background and the top side of
|
|
the window content, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-bottom_padding">
|
|
<code class="descname">bottom_padding</code> - int<a class="headerlink" href="#style-property-bottom_padding" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The amount of space between the background and the bottom side of
|
|
the window content, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-ypadding">
|
|
<code class="descname">ypadding</code> - int<a class="headerlink" href="#style-property-ypadding" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting top_padding and bottom_padding to the same
|
|
value.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-padding">
|
|
<code class="descname">padding</code> - tuple<a class="headerlink" href="#style-property-padding" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>When given a two-item tuple, equivalent to setting xpadding and
|
|
ypadding to the two items. When given a four-item tuple, equivalent
|
|
to setting left_padding, top_padding, right_padding, and bottom_padding
|
|
to the four items.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-size_group">
|
|
<code class="descname">size_group</code> - string or None<a class="headerlink" href="#style-property-size_group" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If not None, this should be a string. Ren'Py will render all
|
|
windows with the same size_group value at the same size.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-modal">
|
|
<code class="descname">modal</code> - boolean or callable<a class="headerlink" href="#style-property-modal" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, the window is treated as modal. Events will stop propagating
|
|
through layers while the mouse is within the window or button. If False,
|
|
the window is not modal.</p>
|
|
<p>This may also be a callable function. If it is, the function is called
|
|
with (ev, x, y, w, h), where <cite>ev</cite> is either a pygame event, or None to
|
|
represent a generic mouse event; <cite>x</cite> and <cite>y</cite> are coordinates relative
|
|
to the window, and <cite>w</cite> and <cite>h</cite> are the height and width of the window.
|
|
If the callable returns true, the windows is treated as modal. If it
|
|
returns false, it is not.</p>
|
|
</dd></dl>
|
|
|
|
</div>
|
|
<div class="section" id="button-style-properties">
|
|
<span id="id5"></span><h3>Button Style Properties<a class="headerlink" href="#button-style-properties" title="Permalink to this headline"> link</a></h3>
|
|
<dl class="style-property">
|
|
<dt id="style-property-child">
|
|
<code class="descname">child</code> - displayable or None<a class="headerlink" href="#style-property-child" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If not None, this gives a displayable that replaces the child of the
|
|
button. For example, this (as insensitive_child) can be used to replace the
|
|
contents of an insensitive button with an image that indicates the button
|
|
is locked.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-hover_sound">
|
|
<code class="descname">hover_sound</code> - string<a class="headerlink" href="#style-property-hover_sound" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>A sound that is played when the button gains focus.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-activate_sound">
|
|
<code class="descname">activate_sound</code> - string<a class="headerlink" href="#style-property-activate_sound" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>A sound that is played when the button is activated (clicked). This is also
|
|
played when a bar or drag is activated.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-mouse">
|
|
<code class="descname">mouse</code> - string<a class="headerlink" href="#style-property-mouse" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The mouse style that is used when the button is focused. This
|
|
should be one of the styles in <a class="reference internal" href="config.html#var-config.mouse"><code class="xref std std-var docutils literal notranslate"><span class="pre">config.mouse</span></code></a>.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-focus_mask">
|
|
<code class="descname">focus_mask</code> - multiple<a class="headerlink" href="#style-property-focus_mask" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>A mask that's used to control what portions of the button can be
|
|
focused, and hence clicked on. The type of this property determines
|
|
how it is interpreted.</p>
|
|
<dl class="docutils">
|
|
<dt>Displayable</dt>
|
|
<dd>The areas of the displayable that are not transparent cause the button
|
|
to be focused.</dd>
|
|
<dt>True</dt>
|
|
<dd>The button itself is used as the displayable (so
|
|
non-transparent areas of the button cause the button to be
|
|
focused).</dd>
|
|
<dt>callable</dt>
|
|
<dd><p class="first">If a non-displayable callable (like a function, method, or object
|
|
with a <code class="docutils literal notranslate"><span class="pre">__call__</span></code> method) is given, the function is called with two
|
|
arguments, the x and y offset from the top-left corner of the
|
|
displayable.</p>
|
|
<p>If the function returns a callable when called with two arguments,
|
|
that callable is called with four arguments - the x and y offsets, and the width
|
|
and height of the displayable.</p>
|
|
<p class="last">If the function returns true, the displayable is focused.</p>
|
|
</dd>
|
|
<dt>None</dt>
|
|
<dd>If none is given, the entire button can be focused.</dd>
|
|
</dl>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-keyboard_focus">
|
|
<code class="descname">keyboard_focus</code> - boolean<a class="headerlink" href="#style-property-keyboard_focus" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, the default, this button can be focused using the keyboard focus
|
|
mechanism, if it can be focused at all. If False, the keyboard focus
|
|
mechanism will skip this button. (The keyboard focus mechanism is used
|
|
by keyboards and keyboard-like devices, such as joypads.)</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-key_events">
|
|
<code class="descname">key_events</code> - boolean<a class="headerlink" href="#style-property-key_events" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, keyboard-generated events are passed to the children of this
|
|
button. If False, those events are not propagated. In this default style,
|
|
this is set to True while the button is hovered, and False otherwise.</p>
|
|
<p>Setting this to True can be used to propagate keyboard events to an input
|
|
inside a button, even when the button isn't focused.</p>
|
|
</dd></dl>
|
|
|
|
</div>
|
|
<div class="section" id="bar-style-properties">
|
|
<span id="id6"></span><h3>Bar Style Properties<a class="headerlink" href="#bar-style-properties" title="Permalink to this headline"> link</a></h3>
|
|
<p>Bars are drawn with gutters on the left and right, that when clicked can cause
|
|
the bar to move by a small amount. The remaining space is the portion of the
|
|
bar that can change, with the amount on each side proportional to the bar's
|
|
value as a fraction of the range.</p>
|
|
<p>The thumb is an area in the center of the bar that can be dragged by the user.</p>
|
|
<p>When a bar is drawn, the thumb's shadow is drawn first. Then the left/bottom
|
|
and right/top sides of the bar, followed by the thumb itself.</p>
|
|
<p>Note that the valid sides of a bar depend on the value of the bar_vertical
|
|
property. If it's True, the top and bottom sides are relevant. Otherwise, the
|
|
left and right sides are used.</p>
|
|
<dl class="style-property">
|
|
<dt id="style-property-bar_vertical">
|
|
<code class="descname">bar_vertical</code> - boolean<a class="headerlink" href="#style-property-bar_vertical" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, the bar has a vertical orientation. If False, it has a
|
|
horizontal orientation.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-bar_invert">
|
|
<code class="descname">bar_invert</code> - boolean<a class="headerlink" href="#style-property-bar_invert" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, the value of the bar is represented on the right/top
|
|
side of the bar, rather than the left/bottom side.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-bar_resizing">
|
|
<code class="descname">bar_resizing</code> - boolean<a class="headerlink" href="#style-property-bar_resizing" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, we resize the sides of the bar. If False, we render the
|
|
sides of the bar at full size, and then crop them.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-left_gutter">
|
|
<code class="descname">left_gutter</code> - int<a class="headerlink" href="#style-property-left_gutter" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The size of the gutter on the left side of the bar, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-right_gutter">
|
|
<code class="descname">right_gutter</code> - int<a class="headerlink" href="#style-property-right_gutter" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The size of the gutter on the right side of the bar, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-top_gutter">
|
|
<code class="descname">top_gutter</code> - int<a class="headerlink" href="#style-property-top_gutter" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The size of the gutter on the top side of the bar, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-bottom_gutter">
|
|
<code class="descname">bottom_gutter</code> - int<a class="headerlink" href="#style-property-bottom_gutter" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The size of the gutter on the bottom side of the bar, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-left_bar">
|
|
<code class="descname">left_bar</code> - displayable<a class="headerlink" href="#style-property-left_bar" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The displayable used for the left side of the bar.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-right_bar">
|
|
<code class="descname">right_bar</code> - displayable<a class="headerlink" href="#style-property-right_bar" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The displayable used for the right side of the bar.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-top_bar">
|
|
<code class="descname">top_bar</code> - displayable<a class="headerlink" href="#style-property-top_bar" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The displayable used for the top side of the bar.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-bottom_bar">
|
|
<code class="descname">bottom_bar</code> - displayable<a class="headerlink" href="#style-property-bottom_bar" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The displayable uses for the bottom side of the bar.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-base_bar">
|
|
<code class="descname">base_bar</code> - displayable<a class="headerlink" href="#style-property-base_bar" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>A single displayable that is used for left_bar/right_bar or
|
|
top_bar/bottom_bar, as appropriate. (This can be used
|
|
with thumb to make a slider or scrollbar.)</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-thumb">
|
|
<code class="descname">thumb</code> - displayable or None<a class="headerlink" href="#style-property-thumb" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If not None, this is a displayable that is drawn over the break
|
|
between the sides of the bar.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-thumb_shadow">
|
|
<code class="descname">thumb_shadow</code> - displayable or None<a class="headerlink" href="#style-property-thumb_shadow" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If not None, this is a displayable that is drawn over the break
|
|
between the sides of the bar.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-thumb_offset">
|
|
<code class="descname">thumb_offset</code> - int<a class="headerlink" href="#style-property-thumb_offset" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The amount that by which the thumb overlaps the bars, in
|
|
pixels. To have the left and right bars continue unbroken, set
|
|
this to half the width of the thumb in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-mouse_alt">
|
|
<code class="descname">mouse</code> - string<a class="headerlink" href="#style-property-mouse_alt" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The mouse style that is used when the button is focused. This
|
|
should be one of the styles in <a class="reference internal" href="config.html#var-config.mouse"><code class="xref std std-var docutils literal notranslate"><span class="pre">config.mouse</span></code></a>.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-unscrollable">
|
|
<code class="descname">unscrollable</code> - string or None<a class="headerlink" href="#style-property-unscrollable" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Controls what happens if the bar is unscrollable (if the range is
|
|
set to 0, as is the case with a viewport containing a displayable
|
|
smaller than itself). There are three possible values:</p>
|
|
<dl class="docutils">
|
|
<dt><code class="docutils literal notranslate"><span class="pre">None</span></code></dt>
|
|
<dd>Renders the bar normally.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"insensitive"</span></code></dt>
|
|
<dd>Renders the bar in the insensitive state. This allows the
|
|
bar to change its style to reflect its lack of usefulness.</dd>
|
|
<dt><code class="docutils literal notranslate"><span class="pre">"hide"</span></code></dt>
|
|
<dd>Prevents the bar from rendering at all. Space will be allocated
|
|
for the bar, but nothing will be drawn in that space.</dd>
|
|
</dl>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-keyboard_focus_alt">
|
|
<code class="descname">keyboard_focus</code> - boolean<a class="headerlink" href="#style-property-keyboard_focus_alt" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, the default, this button can be focused using the keyboard focus
|
|
mechanism, if it can be focused at all. If False, the keyboard focus
|
|
mechanism will skip this button. (The keyboard focus mechanism is used
|
|
by keyboards and keyboard-like devices, such as joypads.)</p>
|
|
</dd></dl>
|
|
|
|
</div>
|
|
<div class="section" id="box-style-properties">
|
|
<span id="id7"></span><h3>Box Style Properties<a class="headerlink" href="#box-style-properties" title="Permalink to this headline"> link</a></h3>
|
|
<p>These are used for the horizontal and vertical box layouts.</p>
|
|
<dl class="style-property">
|
|
<dt id="style-property-spacing">
|
|
<code class="descname">spacing</code> - int<a class="headerlink" href="#style-property-spacing" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The spacing between members of this box, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-first_spacing">
|
|
<code class="descname">first_spacing</code> - int<a class="headerlink" href="#style-property-first_spacing" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If not None, the spacing between the first and second members of
|
|
this box, in pixels. This overrides the spacing property.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-box_reverse">
|
|
<code class="descname">box_reverse</code> - boolean<a class="headerlink" href="#style-property-box_reverse" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, the placement of the items in the box will be reversed. When
|
|
this is True, a hbox will be filled right-to-left, and a vbox will
|
|
be filled bottom-to-top. This defaults to False.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-box_wrap">
|
|
<code class="descname">box_wrap</code> - boolean<a class="headerlink" href="#style-property-box_wrap" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, then boxes will wrap when they reach the end of a line or column.
|
|
If False (the default), they will extend past the end of the line.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-box_wrap_spacing">
|
|
<code class="descname">box_wrap_spacing</code> - int<a class="headerlink" href="#style-property-box_wrap_spacing" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>When box_wrap is True, this is the spacing between wrapped lines
|
|
or columns. (So it is the vertical spacing between lines in a wrapped
|
|
hbox, and the horizontal spacing between columns in a wrapped vbox.)</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-order_reverse">
|
|
<code class="descname">order_reverse</code> - boolean<a class="headerlink" href="#style-property-order_reverse" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If False, the default, the items in the box will be drawn first-to-last,
|
|
with the first item in the box being below the second, and so on. If True,
|
|
this order will be reversed, and the first item in the box will be above
|
|
all other items in the box.</p>
|
|
</dd></dl>
|
|
|
|
</div>
|
|
<div class="section" id="grid-style-properties">
|
|
<span id="id8"></span><h3>Grid Style Properties<a class="headerlink" href="#grid-style-properties" title="Permalink to this headline"> link</a></h3>
|
|
<p>These are the properties used by the grid and vpgrid displayables.
|
|
<a class="reference internal" href="#margin-style-properties"><span class="std std-ref">Margin Style Properties</span></a> also form part of this group.</p>
|
|
<dl class="style-property">
|
|
<dt id="style-property-spacing_alt">
|
|
<code class="descname">spacing</code> - int<a class="headerlink" href="#style-property-spacing_alt" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The spacing between cells of the grid, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xspacing">
|
|
<code class="descname">xspacing</code> - int or None<a class="headerlink" href="#style-property-xspacing" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The spacing between cells of the grid in the horizontal direction, in pixels.
|
|
This takes precedence over the spacing property when it is not None.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-yspacing">
|
|
<code class="descname">yspacing</code> - int or None<a class="headerlink" href="#style-property-yspacing" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The spacing between cells of the grid in the vertical direction, in pixels.
|
|
This takes precedence over the spacing property when it is not None.</p>
|
|
</dd></dl>
|
|
|
|
</div>
|
|
<div class="section" id="fixed-style-properties">
|
|
<span id="id9"></span><h3>Fixed Style Properties<a class="headerlink" href="#fixed-style-properties" title="Permalink to this headline"> link</a></h3>
|
|
<p>These are used with the fixed layout.</p>
|
|
<dl class="style-property">
|
|
<dt id="style-property-fit_first">
|
|
<code class="descname">fit_first</code> - boolean or "width" or "height"<a class="headerlink" href="#style-property-fit_first" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, then the size of the fixed layout is shrunk to be equal with
|
|
the size of the first item in the layout. If "width", only the width is changed
|
|
(the fixed will fill the screen vertically). Similarly, "height" only changes
|
|
the height.</p>
|
|
<p>The position of the child is ignored for the purpose of fit_first.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xfit">
|
|
<code class="descname">xfit</code> - boolean<a class="headerlink" href="#style-property-xfit" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, the size of the fixed layout is shrunk horizontally to match the
|
|
right side of the rightmost child of the fixed.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-yfit">
|
|
<code class="descname">yfit</code> - boolean<a class="headerlink" href="#style-property-yfit" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>If True, the size of the fixed layout is shrunk vertically to match the
|
|
bottom side of the bottommost child of the fixed.</p>
|
|
</dd></dl>
|
|
|
|
<p>When these properties are supplied, the children of the fixed are first
|
|
offered the full area given to the fixed by its parent. Once the size
|
|
and placement of the children are known, these properties are then used
|
|
to select the size of the fixed.</p>
|
|
</div>
|
|
<div class="section" id="margin-style-properties">
|
|
<span id="id10"></span><h3>Margin Style Properties<a class="headerlink" href="#margin-style-properties" title="Permalink to this headline"> link</a></h3>
|
|
<p>Margin properties are used to add transparent space around some
|
|
displayables. Most notably: windows, frames, buttons and outside
|
|
a grid or vpgrid.</p>
|
|
<dl class="style-property">
|
|
<dt id="style-property-left_margin">
|
|
<code class="descname">left_margin</code> - int<a class="headerlink" href="#style-property-left_margin" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The amount of transparent space to the left of the displayable, in
|
|
pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-right_margin">
|
|
<code class="descname">right_margin</code> - int<a class="headerlink" href="#style-property-right_margin" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The amount of transparent space to the right of the displayable, in
|
|
pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-xmargin">
|
|
<code class="descname">xmargin</code> - int<a class="headerlink" href="#style-property-xmargin" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting left_margin and right_margin to the same
|
|
value.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-top_margin">
|
|
<code class="descname">top_margin</code> - int<a class="headerlink" href="#style-property-top_margin" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The amount of transparent space above the displayable, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-bottom_margin">
|
|
<code class="descname">bottom_margin</code> - int<a class="headerlink" href="#style-property-bottom_margin" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>The amount of transparent space below the displayable, in pixels.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-ymargin">
|
|
<code class="descname">ymargin</code> - int<a class="headerlink" href="#style-property-ymargin" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>Equivalent to setting top_margin and bottom_margin to the same
|
|
value.</p>
|
|
</dd></dl>
|
|
|
|
<dl class="style-property">
|
|
<dt id="style-property-margin">
|
|
<code class="descname">margin</code> - tuple<a class="headerlink" href="#style-property-margin" title="Permalink to this definition"> link</a></dt>
|
|
<dd><p>When given a two-item tuple, equivalent to setting xmargin and
|
|
ymargin to the two items. When given a four-item tuple, equivalent
|
|
to setting left_margin, top_margin, right_margin, and bottom_margin
|
|
to the four items.</p>
|
|
</dd></dl>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<footer class="footer">
|
|
<div class="container">
|
|
<p class="pull-right">
|
|
<a href="#">Back to top</a>
|
|
|
|
</p>
|
|
<p>
|
|
© Copyright 2012-2022, Tom Rothamel.<br/>
|
|
Created using <a href="http://sphinx-doc.org/">Sphinx</a> 1.8.6.<br/>
|
|
</p>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
</html> |