summaryrefslogtreecommitdiff
path: root/manuals/chickadee/Blending.html
blob: 0a54bbe270edbdf24c9815ede91e348c7ea2951e (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
<!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

Permission is granted to copy, distribute and/or modify this document
under the terms of the GNU Free Documentation License, Version 1.3
or any later version published by the Free Software Foundation;
with no Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts.
A copy of the license is included in the section entitled "GNU
Free Documentation License".

A copy of the license is also available from the Free Software
Foundation Web site at http://www.gnu.org/licenses/fdl.html.


* Chickadee: (chickadee).     Game programming toolkit for Guile.

The document was typeset with
http://www.texinfo.org/ (GNU Texinfo).
 -->
<!-- Created by GNU Texinfo 6.7, http://www.gnu.org/software/texinfo/ -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Blending (The Chickadee Game Toolkit)</title>

<meta name="description" content="Blending (The Chickadee Game Toolkit)">
<meta name="keywords" content="Blending (The Chickadee Game Toolkit)">
<meta name="resource-type" content="document">
<meta name="distribution" content="global">
<meta name="Generator" content="makeinfo">
<link href="index.html" rel="start" title="Top">
<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="Framebuffers.html" rel="next" title="Framebuffers">
<link href="3D-Models.html" rel="prev" title="3D Models">
<style type="text/css">
<!--
a.summary-letter {text-decoration: none}
blockquote.indentedblock {margin-right: 0em}
div.display {margin-left: 3.2em}
div.example {margin-left: 3.2em}
div.lisp {margin-left: 3.2em}
kbd {font-style: oblique}
pre.display {font-family: inherit}
pre.format {font-family: inherit}
pre.menu-comment {font-family: serif}
pre.menu-preformatted {font-family: serif}
span.nolinebreak {white-space: nowrap}
span.roman {font-family: initial; font-weight: normal}
span.sansserif {font-family: sans-serif; font-weight: normal}
ul.no-bullet {list-style: none}
@media (min-width: 1140px) {
    body {
        margin-left: 14rem;
        margin-right: 4rem;
        max-width: 52rem;
    }
}

@media (min-width: 800px) and (max-width: 1140px) {
    body {
        margin-left: 6rem;
        margin-right: 4rem;
        max-width: 52rem;
    }
}

@media (max-width: 800px) {
    body {
        margin: 1rem;
    }
}

-->
</style>
<link rel="stylesheet" type="text/css" href="https://dthompson.us/css/dthompson.css">


</head>

<body lang="en">
<span id="Blending"></span><div class="header">
<p>
Next: <a href="Framebuffers.html" accesskey="n" rel="next">Framebuffers</a>, Previous: <a href="3D-Models.html" accesskey="p" rel="prev">3D Models</a>, Up: <a href="Graphics.html" accesskey="u" rel="up">Graphics</a> &nbsp; [<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="Blending-1"></span><h4 class="subsection">2.3.10 Blending</h4>

<p>Rendering a scene often involves drawing layers of objects that
overlap each other.  Blending determines how two overlapping pixels
are combined in the final image that is rendered to the screen.
</p>
<p>Chickadee provides the following blend modes:
</p>
<dl>
<dt id="index-blend_003aalpha">Variable: <strong>blend:alpha</strong></dt>
<dd><p>Blend pixels according to the values of their alpha channels.  This is
the most commonly used blend mode.
</p></dd></dl>

<dl>
<dt id="index-blend_003areplace">Variable: <strong>blend:replace</strong></dt>
<dd><p>Overwrite the output pixel color with the color being drawn.
</p></dd></dl>

<dl>
<dt id="index-blend_003aadd">Variable: <strong>blend:add</strong></dt>
<dd><p>Add all pixel color values together.  The more colors blended
together, the more white the final color becomes.
</p></dd></dl>

<dl>
<dt id="index-blend_003asubtract">Variable: <strong>blend:subtract</strong></dt>
<dd><p>Subtract all pixel color values.  The more colors blended together,
the more black the final color becomes.
</p></dd></dl>

<dl>
<dt id="index-blend_003amultiply">Variable: <strong>blend:multiply</strong></dt>
</dl>

<dl>
<dt id="index-blend_003adarken">Variable: <strong>blend:darken</strong></dt>
</dl>

<dl>
<dt id="index-blend_003alighten">Variable: <strong>blend:lighten</strong></dt>
</dl>

<dl>
<dt id="index-blend_003ascreen">Variable: <strong>blend:screen</strong></dt>
</dl>

<p>Custom blend modes can be created using the <code>make-blend-mode</code> procedure:
</p>
<dl>
<dt id="index-make_002dblend_002dmode">Procedure: <strong>make-blend-mode</strong> <em>equation source-function destination-function</em></dt>
<dd><p>Return a new custom blend mode that applies <var>source-function</var> to
the source color, <var>destination-function</var> to the destination color,
and finally applies <var>equation</var> to the transformed
source/destination color values.  These arguments are <em>not</em>
procedures, but symbolic representations of the functions that OpenGL
supports.
</p>
<p>Valid values for <var>equation</var> are:
</p>
<ul>
<li> <code>add</code>
</li><li> <code>subtract</code>
</li><li> <code>reverse-subtract</code>
</li><li> <code>min</code>
</li><li> <code>max</code>
</li><li> <code>alpha-min</code>
</li><li> <code>alpha-max</code>
</li></ul>

<p>Valid values for <var>source-function</var> are:
</p>
<ul>
<li> <code>zero</code>
</li><li> <code>one</code>
</li><li> <code>destination-color</code>
</li><li> <code>one-minus-destination-color</code>
</li><li> <code>source-alpha-saturate</code>
</li><li> <code>source-alpha</code>
</li><li> <code>one-minus-source-alpha</code>
</li><li> <code>destination-alpha</code>
</li><li> <code>one-minus-destination-alpha</code>
</li><li> <code>constant-color</code>
</li><li> <code>one-minus-constant-color</code>
</li><li> <code>constant-alpha</code>
</li><li> <code>one-minus-constant-alpha</code>
</li></ul>

<p>Valid values for <var>destination-function</var> are:
</p>
<ul>
<li> <code>zero</code>
</li><li> <code>one</code>
</li><li> <code>source-color</code>
</li><li> <code>one-minus-source-color</code>
</li><li> <code>source-alpha</code>
</li><li> <code>one-minus-source-alpha</code>
</li><li> <code>destination-alpha</code>
</li><li> <code>one-minus-destination-alpha</code>
</li><li> <code>constant-color</code>
</li><li> <code>one-minus-constant-color</code>
</li><li> <code>constant-alpha</code>
</li><li> <code>one-minus-constant-alpha</code>
</li></ul>

</dd></dl>

<hr>
<div class="header">
<p>
Next: <a href="Framebuffers.html" accesskey="n" rel="next">Framebuffers</a>, Previous: <a href="3D-Models.html" accesskey="p" rel="prev">3D Models</a>, Up: <a href="Graphics.html" accesskey="u" rel="up">Graphics</a> &nbsp; [<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>



</body>
</html>