diff options
Diffstat (limited to 'manuals/chickadee/Sprites.html')
| -rw-r--r-- | manuals/chickadee/Sprites.html | 64 |
1 files changed, 53 insertions, 11 deletions
diff --git a/manuals/chickadee/Sprites.html b/manuals/chickadee/Sprites.html index 93a0967..2575e87 100644 --- a/manuals/chickadee/Sprites.html +++ b/manuals/chickadee/Sprites.html @@ -1,6 +1,6 @@ <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> -<!-- Copyright (C) 2017-2020 David Thompson davet@gnu.org +<!-- Copyright (C) 2017-2021 David Thompson davet@gnu.org Permission is granted to copy, distribute and/or modify this document under the terms of the GNU Free Documentation License, Version 1.3 @@ -32,7 +32,7 @@ http://www.texinfo.org/ (GNU Texinfo). <link href="Index.html" rel="index" title="Index"> <link href="index.html#SEC_Contents" rel="contents" title="Table of Contents"> <link href="Graphics.html" rel="up" title="Graphics"> -<link href="9_002dPatches.html" rel="next" title="9-Patches"> +<link href="Fonts.html" rel="next" title="Fonts"> <link href="Textures.html" rel="prev" title="Textures"> <style type="text/css"> <!-- @@ -82,10 +82,10 @@ ul.no-bullet {list-style: none} <body lang="en"> <span id="Sprites"></span><div class="header"> <p> -Next: <a href="9_002dPatches.html" accesskey="n" rel="next">9-Patches</a>, Previous: <a href="Textures.html" accesskey="p" rel="prev">Textures</a>, Up: <a href="Graphics.html" accesskey="u" rel="up">Graphics</a> [<a href="index.html#SEC_Contents" title="Table of contents" rel="contents">Contents</a>][<a href="Index.html" title="Index" rel="index">Index</a>]</p> +Next: <a href="Fonts.html" accesskey="n" rel="next">Fonts</a>, Previous: <a href="Textures.html" accesskey="p" rel="prev">Textures</a>, Up: <a href="Graphics.html" accesskey="u" rel="up">Graphics</a> [<a href="index.html#SEC_Contents" title="Table of contents" rel="contents">Contents</a>][<a href="Index.html" title="Index" rel="index">Index</a>]</p> </div> <hr> -<span id="Sprites-1"></span><h4 class="subsection">2.3.3 Sprites</h4> +<span id="Sprites-1"></span><h4 class="subsection">5.3.3 Sprites</h4> <p>For those who are new to this game, a sprite is a 2D rectangular bitmap that is rendered to the screen. For 2D games, sprites are the @@ -118,6 +118,8 @@ changed by specifying <var>blend-mode</var>. arbitrary section of the screen, specify <var>rect</var>. </p></dd></dl> +<span id="Sprite-Batches"></span><h4 class="subsubsection">5.3.3.1 Sprite Batches</h4> + <p>It’s not uncommon to need to draw hundreds or thousands of sprites each frame. However, GPUs (graphics processing units) are tricky beasts that prefer to be sent few, large chunks of data to render @@ -127,12 +129,12 @@ for rendering a few dozen sprites, but will become a serious bottleneck when rendering hundreds or thousands of sprites. To deal with this, a technique known as “sprite batching” is used. Instead of drawing each sprite immediately, the sprite batch will build up a -large of buffer of sprites to draw and send them to the GPU all at -once. There is one caveat, however. Batching only works if the -sprites being drawn share a common texture. A good strategy for -reducing the number of different textures is to stuff many bitmaps -into a single image file and create a “texture atlas” -(see <a href="Textures.html">Textures</a>) to access the sub-images within. +large buffer of sprites to draw and send them to the GPU all at once. +There is one caveat, however. Batching only works if the sprites +being drawn share a common texture. A good strategy for reducing the +number of different textures is to stuff many bitmaps into a single +image file and create a “texture atlas” (see <a href="Textures.html">Textures</a>) to access +the sub-images within. </p> <dl> <dt id="index-make_002dsprite_002dbatch">Procedure: <strong>make-sprite-batch</strong> <em>texture [#:capacity 256]</em></dt> @@ -178,10 +180,50 @@ parent is the batch texture may be specified as <var>texture-region</var>. default. </p></dd></dl> +<span id="g_t9_002dPatches"></span><h4 class="subsubsection">5.3.3.2 9-Patches</h4> + +<p>A 9-patch is a method of rendering a texture so that it can be +stretched to cover an area of any size without becoming distorted. +This is achieved by dividing up the sprite into nine regions: +</p> +<ul> +<li> the center, which can be stretched or tiled horizontally and vertically +</li><li> the four corners, which are never stretched or tiled +</li><li> the left and right sides, which can be stretched or tiled vertically +</li><li> the top and bottom sides, which can be stretched or tiled horizontally +</li></ul> + +<p>The most common application of this technique is for graphical user +interface widgets like buttons and dialog boxes which are often +dynamically resizable. By using a 9-patch, they can be rendered at +any size without scaling artifacts. The <code>(chickadee graphics +9-patch)</code> module provides this functionality. +</p> +<dl> +<dt id="index-draw_002d9_002dpatch">Procedure: <strong>draw-9-patch</strong> <em>texture rect [#:margin 0] [#:top-margin margin] [#:bottom-margin margin] [#:left-margin margin] [#:right-margin margin] [#:mode stretch] [#:origin] [#:scale] [#:rotation] [#:blend-mode] [#:tint white]</em></dt> +<dd> +<p>Draw a 9-patch over the area <var>rect</var> using <var>texture</var> whose +stretchable/tileable patches are defined by the given margin +measurements. The corners are never stretched/tiled, the left and +right edges will be stretched/tiled vertically, the top and bottom +edges may be stretched/tiled horizontally, and the center may be +stretched/tiled in both directions. +</p> +<p><var>mode</var> may be either <code>stretch</code> (the default) or <code>tile</code>. +</p> +<p><var>margin</var> specifies the margin size for all sides of the 9-patch. +To make margins of differing sizes, the <var>top-margin</var>, +<var>bottom-margin</var>, <var>left-margin</var>, and <var>right-margin</var> +arguments may be used. +</p> +<p>Refer to <code>draw-sprite</code> for information about the other arguments +as they are the same. +</p></dd></dl> + <hr> <div class="header"> <p> -Next: <a href="9_002dPatches.html" accesskey="n" rel="next">9-Patches</a>, Previous: <a href="Textures.html" accesskey="p" rel="prev">Textures</a>, Up: <a href="Graphics.html" accesskey="u" rel="up">Graphics</a> [<a href="index.html#SEC_Contents" title="Table of contents" rel="contents">Contents</a>][<a href="Index.html" title="Index" rel="index">Index</a>]</p> +Next: <a href="Fonts.html" accesskey="n" rel="next">Fonts</a>, Previous: <a href="Textures.html" accesskey="p" rel="prev">Textures</a>, Up: <a href="Graphics.html" accesskey="u" rel="up">Graphics</a> [<a href="index.html#SEC_Contents" title="Table of contents" rel="contents">Contents</a>][<a href="Index.html" title="Index" rel="index">Index</a>]</p> </div> |