somethinglikegames.de

Mein Blog über Spieleentwicklung und das Drumherum


Kategorien


Tags

Opacity

Im letzten Artikel zu den Blending-Modes hatte ich das Thema Deckkraft anfangs ausgeklammert, um es nochmal separat zu betrachten, leider habe ich diese separate Betrachtung dann vor der Veröffentlichung vergessen. Somit findet diese Betrachtung etwas separater statt, als ich es ursprünglich meinte 😉

Die Deckkraft ist generell unabhängig vom gewählten Blending-Mode. Über diesen Wert wird nach dem Ausführen des gewählten Blending-Modes eingestellt, wie das Blending-Ergebnis mit dem Hintergrund verrechnet wird, also wie stark der Hintergrund überdeckt wird. 100% Deckkraft bedeutet, dass das Blending-Ergebnis volle Deckkraft hat und das neue Gesamtergebnis darstellt. 0% Deckkraft wiederum bedeutet, dass der Hintergrund unverändert übernommen wird. Bei allen Werten dazwischen wird abhängig von der eingestellten Deckkraft das Verhältnis beider Werte bestimmt, sodass die nachfolgende Formel gilt:

Falls die Formel zu anstrengend ist, kannst du auch direkt zu den Beispielen springen, wo mit “echten” Zahlen gerechnet wird.

\(p_\text{opa} = O * p_\text{new} + (1 - O) * p_\text{bg}\)

\(p_\text{opa}\)
Pixel des Gesamtergebnisses
\(O\)
Eingestellte Deckkraft zwischen 0 und 1
\(p_\text{new}\)
Pixel des Blending-Ergebnisses
\(p_\text{bg}\)
Hintergrundpixel

Beispiele

Die nachfolgenden Beispiele sind immer gleich aufgebaut. Zuerst definiere ich die Werte, anschließend setze ich sie in die Formel ein und zum Schluss wird das Ergebnis berechnet.

Beispiel 1

  • Deckkraft \(O \mathrel{\unicode{x2254}} 1\)
  • Pixel des Blending-Ergebnisses \(p_\text{new} \mathrel{\unicode{x2254}} 0.25\)
  • Hintergrundpixel \(p_\text{bg} \mathrel{\unicode{x2254}} 0.8\)

\(\begin{eqnarray} p_\text{opa} &=& O * p_\text{new} + (1 - O) * p_\text{bg} \\ &=& 1 * 0.25 + (1 - 1) * 0.8 \\ &=& 0.25 + 0 * 0.8 \\ &=& 0.25 + 0 \\ &=& 0.25 \\ \end{eqnarray}\)

Beispiel 1 (graphisch)

Beispiel 1 (graphisch)

Beispiel 2

  • Deckkraft \(O \mathrel{\unicode{x2254}} 0\)
  • Pixel des Blending-Ergebnisses \(p_\text{new} \mathrel{\unicode{x2254}} 0.25\)
  • Hintergrundpixel \(p_\text{bg} \mathrel{\unicode{x2254}} 0.8\)

\(\begin{eqnarray} p_\text{opa} &=& O * p_\text{new} + (1 - O) * p_\text{bg} \\ &=& 0 * 0.25 + (1 - 0) * 0.8 \\ &=& 0 + 1 * 0.8 \\ &=& 0 + 0 \\ &=& 0.8 \\ \end{eqnarray}\)

Beispiel 2 (graphisch)

Beispiel 2 (graphisch)

Beispiel 3

  • Deckkraft \(O \mathrel{\unicode{x2254}} 0.3\)
  • Pixel des Blending-Ergebnisses \(p_\text{new} \mathrel{\unicode{x2254}} 0.25\)
  • Hintergrundpixel \(p_\text{bg} \mathrel{\unicode{x2254}} 0.8\)

\(\begin{eqnarray} p_\text{opa} &=& O * p_\text{new} + (1 - O) * p_\text{bg} \\ &=& 0.3 * 0.25 + (1 - 0.3) * 0.8 \\ &=& 0.075 + 0.7 * 0.8 \\ &=& 0.075 + 0.56 \\ &=& 0.635 \\ \end{eqnarray}\)

Beispiel 3 (graphisch)

Beispiel 3 (graphisch)