1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"><!-- InstanceBegin template="/Templates/default_template.dwt" codeOutsideHTMLIsLocked="false" --> 3<head> 4<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5<meta http-equiv="Content-Style-Type" content="text/css" /> 6<!-- InstanceBeginEditable name="CSS の相対パス指定" --> 7<link href="../../../common/manual.css" rel="stylesheet" type="text/css" /> 8<!-- InstanceEndEditable --> 9<!-- InstanceBeginEditable name="ページのタイトル" --> 10<title>フレームバッファへの書き込み</title> 11<!-- InstanceEndEditable --> 12</head> 13<body> 14<div> 15 <div class="body"> <!-- InstanceBeginEditable name="本文のタイトル" --> 16 <h1>フレームバッファへの書き込み</h1> 17 <!-- InstanceEndEditable --> <!-- InstanceBeginEditable name="本文" --> 18 <p>ここでは、書き込みテストの判定で使用が決まったフラグメントをフレームバッファへ書き込むまでの処理のしくみについて説明します。</p> 19 <p>CreativeStudio では、フレームバッファへ書き込むさいの処理、<em>ブレンドモード</em>の項目には 4 種類あります。<br /> 20 以下の表はブレンドモードの選択項目をまとめたものです。</p> 21 22 <table> 23 <thead> 24 <tr> 25 <th>項目</th> 26 <th>説明</th> 27 </tr> 28 </thead> 29 <tbody> 30 <tr> 31 <th>未使用</th> 32 <td>ブレンド処理を行いません。不透明の表現になります。</td> 33 </tr> 34 <tr> 35 <th>ブレンド処理</th> 36 <td>フラグメントのカラーやアルファとフレームバッファのカラーやアルファに対してスケールをかけた後、ブレンディング方程式を用いて混ぜ合わせます。</td> 37 </tr> 38 <tr> 39 <th>セパレート<br /> 40 ブレンド処理</th> 41 <td>フラグメントのカラーやアルファとフレームバッファのカラーやアルファとを、各色成分とアルファ値ごとにスケールをかけた後、ブレンディング方程式を用いて混ぜ合わせます。</td> 42 </tr> 43 <tr> 44 <th>論理演算</th> 45 <td>フラグメントのカラーやアルファとフレームバッファのカラーやアルファとを論理演算を用いて混ぜ合わせます。</td> 46 </tr> 47 </tbody> 48 </table> 49 50 <h2>ブレンド処理</h2> 51 <p>ここでは、フラグメントごとの混ぜ合わせ<em>、ブレンド処理</em>について説明します。</p> 52 <!-- #BeginLibraryItem "/Library/glossary_blending.lbi" --> 53 <!-- ブレンド処理 ( blending ) --> 54 <p><em>ブレンド処理</em>とは、書き込みテストの判定により、使用が決まったフラグメントのカラーやアルファ ( これを<em>ソースカラー、ソースアルファ</em>と呼びます ) と書き込み先のフレームバッファ上で同じ位置に存在するカラーやアルファ ( これを<em>デスティネーションカラー、デスティネーションアルファ</em>と呼びます ) に対して行う処理のことです。ソースとデスティネーションに対して係数を乗算 ( スケール ) し、ブレンディング方程式で混ぜ合わせた結果をフレームバッファへ書き戻します。</p> 55 <!-- #EndLibraryItem --> 56 <p>以下の図は、ブレンド処理の流れを説明したものです。</p> 57 <img class="user_guide_chart" src="assets/write_frame_buffer_blending.png" alt="ブレンド処理の流れ"/> 58 <h3>ブレンド元係数とブレンド先係数</h3> 59 <!-- #BeginLibraryItem "/Library/glossary_blending_coefficient.lbi" --> 60 <!-- ブレンド処理の係数 ( blending_coefficient ) --> 61 <p><em>ブレンド元係数</em>とは、ソースカラーやソースアルファに対して乗算する係数のことです。その結果はソースの要素として使用されます。<br /> 62 <em>ブレンド先係数</em>とはデスティネーションカラーやデスティネーションアルファに対して乗算する係数のことです。その結果はデスティネーションの要素として使用されます。<br /> 63 CreativeStudio において、係数はカラーとアルファでそれぞれ個別に設定できます。</p> 64 <!-- #EndLibraryItem --> 65 <h4>ブレンドカラー</h4> 66 <!-- #BeginLibraryItem "/Library/glossary_blend_color.lbi" --> 67 <!-- ブレンドカラー ( blend_color ) --> 68 <p><em>ブレンドカラー</em>とは、ブレンド元係数とブレンド先係数で使用できる、固定のカラーとアルファです。</p> 69 <p class="warning">テクスチャコンバイナのコンスタントカラーとは設定箇所が異なります。</p> 70 <!-- #EndLibraryItem --> 71 <p>以下の図は、係数の種類をまとめたものです。</p> 72 <img class="user_guide_chart" src="assets/write_frame_buffer_blending_coefficient.png" alt="ブレンド処理の係数"/> 73 <p class="hint">係数において、 1 から引かれたカラーやアルファは反転します。</p> 74 <h3>ブレンディング方程式</h3> 75 <!-- ブレンディング方程式 ( blending_equation ) --> 76 <p><em>ブレンディング方程式</em>とは、ソース の要素( ブレンド元係数を乗算した結果 ) とデスティネーションの要素( ブレンド先係数を乗算した結果 )を混ぜ合わせる為の計算式です。<br /> 77 CreativeStudio において、ブレンディング方程式はカラーとアルファでそれぞれ個別に設定できます。</p> 78 <p>以下の図はブレンディング方程式について、カラーのブレンドを例に説明したものです。</p> 79 <img class="user_guide_chart" src="assets/write_frame_buffer_blending_equation.png" alt="ブレンディング方程式"/> 80 <p>以下のブレンド元係数とブレンド先の係数のカラーイメージを入力値としてブレンディング方程式による混ぜ合わせについて説明します。</p> 81 <table class="thumb"> 82 <thead> 83 <tr> 84 <th>ブレンド元係数</th> 85 <th>ブレンド先係数</th> 86 </tr> 87 </thead> 88 <tbody> 89 <tr> 90 <td><img class="thumb" src="assets//write_frame_buffer_blending_coefficient_source.png" alt="ブレンド元係数"/></td> 91 <td><img class="thumb" src="assets//write_frame_buffer_blending_coefficient_target.png" alt="ブレンド先係数"/></td> 92 </tr> 93 </tbody> 94 </table> 95 <p>以下の表は、ブレンディング方程式の種類をまとめたものです。</p> 96 <table> 97 <thead> 98 <tr> 99 <th class="thumb">項目</th> 100 <th class="thumb">演算子名</th> 101 <th class="thumb">結果</th> 102 <th>説明</th> 103 </tr> 104 </thead> 105 <tbody> 106 <tr> 107 <th class="thumb">ソースとデスティネーションを加算</th> 108 <th class="thumb">ADD</th> 109 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_add.png" alt="ブレンディング式ADD"/></td> 110 <td>ブレンド元係数 + ブレンド先係数</td> 111 </tr> 112 <tr> 113 <th class="thumb">ソースからデスティネーションを減算</th> 114 <th class="thumb">SUBTRACT</th> 115 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_sub.png" alt="ブレンディング式SUB"/></td> 116 <td>ブレンド元係数 - ブレンド先係数</td> 117 </tr> 118 <tr> 119 <th class="thumb">デスティネーションからソースを減算</th> 120 <th class="thumb">REVERSE_SUBTRACT</th> 121 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_reverse_sub.png" alt="ブレンディング式REVERCE_SUB"/></td> 122 <td>ブレンド先係数 - ブレンド元係数</td> 123 </tr> 124 <tr> 125 <th class="thumb">ソースとデスティネーションのより小さい方</th> 126 <th class="thumb">MIN</th> 127 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_min.png" alt="ブレンディング式MIN"/></td> 128 <td>ブレンド元係数とブレンド先係数を比較して、値の小さい方を使用。</td> 129 </tr> 130 <tr> 131 <th class="thumb">ソースとデスティネーションのより大きい方</th> 132 <th class="thumb">MAX</th> 133 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_max.png" alt="ブレンディング式MAX"/></td> 134 <td>ブレンド元係数とブレンド先係数を比較して、値の大きい方を使用。</td> 135 </tr> 136 </tbody> 137 </table> 138 <h2>セパレートブレンド処理</h2> 139 140 <p>セパレートブレンド処理とは、書き込みテストの判定により、使用が決まったフラグメントのカラーやアルファ (「ソースカラー」「ソースアルファ」) と書き込み先のフレームバッファ上で同じ位置に存在するカラーやアルファ (「デスティネーションカラー」「デスティネーションアルファ」) に対して行う処理のことです。</p> 141 <p>ソースとデスティネーションの各色成分とアルファ値に対して係数を乗算して、ブレンディング方程式で混ぜ合わせた結果をフレームバッファへ書き戻します。</p> 142 143 144 145 <h2>論理演算</h2> 146 <p><em>論理演算</em>とは書き込みテストの判定により、使用が決まったフラグメントのカラー ( <em>ソースカラー</em> ) と書き込み先のフレームバッファ上で同じ位置に存在するカラー ( <em>デスティネーションカラー</em> ) に対して行う処理です。</p> 147 <p>ソースカラーとデスティネーションカラーに対して 1( 真 )か 0( 偽 )かの 2 通りの入力値に対して 1 つの値を出力する計算方法<em>論理演算</em>を行い、その結果をフレームバッファへ書き戻します。</p> 148 149 150 151 152 153 <p>以下の図は、論理演算の流れを説明したものです。</p> 154 <img class="user_guide_chart" src="assets/write_frame_buffer_logical_operations.png" alt="論理演算の流れ"/> 155 <p>以下のソースカラー ( A ) とデスティネーションカラー ( B ) のイメージを入力値として論理演算による混ぜ合わせについて説明します。<br /> 156 ここでは説明を簡略化する為に白黒のイメージを使用します。白の領域を 1 、黒の領域を 0 とします。</p> 157 <p> </p> 158 <table class="thumb"> 159 <thead> 160 <tr> 161 <th>ソースカラー</th> 162 <th>デスティネーションカラー</th> 163 </tr> 164 </thead> 165 <tbody> 166 <tr> 167 <td><img class="thumb" src="assets//write_frame_buffer_source_color.png" alt="ブレンド元係数"/></td> 168 <td><img class="thumb" src="assets//write_frame_buffer_destination_color.png" alt="ブレンド先係数"/></td> 169 </tr> 170 </tbody> 171 </table> 172 <p>以下の表は、論理演算の種類をまとめたものです。 CreativeStudio では<em>演算方法</em>から選択できます。</p> 173 <table> 174 <thead> 175 <tr> 176 <th class="thumb">項目</th> 177 <th class="thumb">演算子名</th> 178 <th class="thumb">結果</th> 179 <th>説明</th> 180 </tr> 181 </thead> 182 <tbody> 183 <tr> 184 <th class="thumb">すべてのビット値を 0</th> 185 <th class="thumb">CLEAR</th> 186 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_clear.png" alt="論理演算CLEAR"/></td> 187 <td>RGBA に 0 を書き込みます。</td> 188 </tr> 189 <tr> 190 <th class="thumb">ソースカラーの<br /> 191 ビット値</th> 192 <th class="thumb">COPY</th> 193 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_copy.png" alt="論理演算COPY"/></td> 194 <td>ソースをそのまま書き込みます。</td> 195 </tr> 196 <tr> 197 <th class="thumb">デスティネーションカラーの<br /> 198 ビット値</th> 199 <th class="thumb">NOOP</th> 200 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_noop.png" alt="論理演算NOOP"/></td> 201 <td>何も書き込みません。フレームバッファの値が使用されます。</td> 202 </tr> 203 <tr> 204 <th class="thumb">すべてのビット値を 1</th> 205 <th class="thumb">SET</th> 206 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_set.png" alt="論理演算SET"/></td> 207 <td>RGBA に 1 を書き込みます。</td> 208 </tr> 209 <tr> 210 <th class="thumb">ソースカラーの<br /> 211 反転ビット値</th> 212 <th class="thumb">COPY_INVERTED</th> 213 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_copy_inverted.png" alt="論理演算INVERTED"/></td> 214 <td>ソースを反転します。</td> 215 </tr> 216 <tr> 217 <th class="thumb">デスティネーションカラーの<br /> 218 反転ビット値</th> 219 <th class="thumb">INVERT</th> 220 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_invert.png" alt="論理演算INVERT"/></td> 221 <td>デスティネーションを反転します。</td> 222 </tr> 223 <tr> 224 <th class="thumb">ソースとデスティネーションカラーの反転ビット値の論理積</th> 225 <th class="thumb">AND_REVERSE</th> 226 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_and_reverse.png" alt="論理演算AND_REVERSE"/></td> 227 <td>ソースと、反転したデスティネーションの論理積です。<br /> 228 A と B の両方が 1 の部分を出力します。</td> 229 </tr> 230 <tr> 231 <th class="thumb">ソースとデスティネーションカラーの反転ビット値の論理和</th> 232 <th class="thumb">OR_REVERSE</th> 233 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_or_reverse.png" alt="論理演算OR_REVERSE"/></td> 234 <td>ソースと、反転したデスティネーションの論理和です。<br /> 235 <em>論理和</em>は、A と B のいずれかに 1 が在る場合は 1 を出力し、それ以外の場合には 0 を出力します。</td> 236 </tr> 237 <tr> 238 <th class="thumb">ソースとデスティネーションカラーの<br /> 239 論理積</th> 240 <th class="thumb">AND</th> 241 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_and.png" alt="論理演算AND"/></td> 242 <td>ソースとデスティネーションの論理積です。<br /> 243 <em>論理積</em>は、A と B の両方が 1 の部分を出力します。</td> 244 </tr> 245 <tr> 246 <th class="thumb">ソースとデスティネーションカラーの<br /> 247 論理和</th> 248 <th class="thumb">OR</th> 249 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_or.png" alt="論理演算OR"/></td> 250 <td>ソースとデスティネーションの論理和です。<br /></td> 251 </tr> 252 <tr> 253 <th class="thumb">ソースとデスティネーションカラーの論理積の反転ビット値</th> 254 <th class="thumb">NAND</th> 255 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_nand.png" alt="論理演算NAND"/></td> 256 <td>ソースとデスティネーションの論理積を反転します。<br /> 257 <em>否定論理積</em>( Not_And )とも呼びます。すべての入力値が 1 の場合に 0 を出力し、それ以外の場合には 1 を出力します。</td> 258 </tr> 259 <tr> 260 <th class="thumb">ソースとデスティネーションカラーの論理和の反転ビット値</th> 261 <th class="thumb">NOR</th> 262 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_nor.png" alt="論理演算NOR"/></td> 263 <td>ソースとデスティネーションの論理和を反転します。<br /> 264 <em>否定論理和</em>( Not_Or )とも呼びます。すべての入力値が 0 の場合に 1 を出力し、それ以外の場合には 0 を出力します。</td> 265 </tr> 266 <tr> 267 <th class="thumb">ソースとデスティネーションカラーの<br /> 268 排他的論理和</th> 269 <th class="thumb">XOR</th> 270 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_xor.png" alt="論理演算XOR"/></td> 271 <td>ソースとデスティネーションの排他的論理和です。<br /> 272 <em>排他的論理和</em>は、入力値が異なる場合に 1 を出力し、同じときには 0 を出力します。</td> 273 </tr> 274 <tr> 275 <th class="thumb">ソースとデスティネーションカラーの<br /> 276 排他的論理和の反転ビット値</th> 277 <th class="thumb">EQUTV</th> 278 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_equtv.png" alt="論理演算EQUTV"/></td> 279 <td>ソースとデスティネーションの排他的論理和を反転します。</td> 280 </tr> 281 <tr> 282 <th class="thumb">ソースカラーの<br /> 283 反転ビット値と、<br /> 284 デスティネーションカラーの論理積</th> 285 <th class="thumb">AND_INVERTED</th> 286 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_and_inverted.png" alt="論理演算AND_INVERTED"/></td> 287 <td>反転したソースとデスティネーションの論理積です。</td> 288 <tr> 289 <th class="thumb">ソースカラーの<br /> 290 反転ビット値と、<br /> 291 デスティネーションカラーの論理和</th> 292 <th class="thumb">OR_INVERTED</th> 293 <td class="thumb"><img class="thumb" src="assets/write_frame_buffer_logical_or_inverted.png" alt="論理演算OR_INVERTED"/></td> 294 <td>反転したソースとデスティネーションの論理和です。</td> 295 </tr> 296 </tbody> 297 </table> 298 <!-- InstanceEndEditable --> </div> 299 <div class="footer" /> 300</div> 301</body> 302<!-- InstanceEnd --></html> 303