Modalità di fusione SkiaSharp

Articolo
03/05/2024

Questi articoli si concentrano sulla BlendMode proprietà di SKPaint. La BlendMode proprietà è di tipo SKBlendMode, un'enumerazione con 29 membri.

La BlendMode proprietà determina cosa accade quando viene eseguito il rendering di un oggetto grafico (spesso denominato origine) su oggetti grafici esistenti (denominati destinazione). In genere, ci aspettiamo che il nuovo oggetto grafico scuoti gli oggetti sottostanti. Ciò avviene solo perché la modalità di fusione predefinita è SKBlendMode.SrcOver, il che significa che l'origine viene disegnata sulla destinazione. Gli altri 28 membri di SKBlendMode causano altri effetti. Nella programmazione grafica, la tecnica di combinazione di oggetti grafici in vari modi è nota come composizione.

Enumerazione SKBlendModes

Le modalità di fusione SkiaSharp corrispondono strettamente a quelle descritte nella specifica W3C Compositing and Blending Level 1 . La panoramica di Skia SkBlendMode fornisce anche informazioni di base utili. Per un'introduzione generale alle modalità di fusione, l'articolo Modalità Blend in Wikipedia è un buon inizio. Le modalità Blend sono supportate in Adobe Foto hop, quindi sono disponibili molte informazioni online aggiuntive sulle modalità blend in tale contesto.

I 29 membri dell'enumerazione SKBlendMode possono essere suddivisi in tre categorie:

Porter-Duff	Separabili	Non separabile
`Clear`	`Modulate`	`Hue`
`Src`	`Screen`	`Saturation`
`Dst`	`Overlay`	`Color`
`SrcOver`	`Darken`	`Luminosity`
`DstOver`	`Lighten`
`SrcIn`	`ColorDodge`
`DstIn`	`ColorBurn`
`SrcOut`	`HardLight`
`DstOut`	`SoftLight`
`SrcATop`	`Difference`
`DstATop`	`Exclusion`
`Xor`	`Multiply`
`Plus`

I nomi di queste tre categorie avranno un significato maggiore nelle discussioni che seguono. L'ordine in cui sono elencati i membri è uguale a quello della definizione dell'enumerazione SKBlendMode . I 13 membri dell'enumerazione nella prima colonna hanno i valori interi da 0 a 12. La seconda colonna sono membri di enumerazione che corrispondono a numeri interi da 13 a 24 e i membri nella terza colonna hanno valori da 25 a 28.

Queste modalità di fusione vengono illustrate approssimativamente nello stesso ordine nel documento W3C Compositing and Blending Level 1, ma esistono alcune differenze: la Src modalità è denominata Copy nel documento W3C ed Plus è denominata Light. Il documento W3C definisce una modalità di fusione normale non inclusa in SKBlendModes perché sarebbe uguale SrcOvera . La Modulate modalità blend (nella parte superiore della seconda colonna) non è inclusa nel documento W3C e la discussione sulla Multiply modalità precede Screen.

Poiché la Modulate modalità blend è unica per Skia, verrà discussa come una modalità Porter-Duff aggiuntiva e come modalità separabile.

L'importanza della trasparenza

Storicamente, la composizione è stata sviluppata in combinazione con il concetto del canale alfa. In una superficie di visualizzazione, ad esempio l'oggetto SKCanvas e una bitmap a colori completi, ogni pixel è costituito da 4 byte: 1 byte ciascuno per i componenti rosso, verde e blu e un byte aggiuntivo per la trasparenza. Questo componente alfa è 0 per la trasparenza completa e 0xFF per l'opacità completa, con diversi livelli di trasparenza tra tali valori.

Molte delle modalità di fusione si basano sulla trasparenza. In genere, quando un SKCanvas oggetto viene ottenuto per la prima volta in un PaintSurface gestore o quando viene creato un SKCanvas oggetto per disegnare su una bitmap, il primo passaggio è questa chiamata:

canvas.Clear();

Questo metodo sostituisce tutti i pixel dell'area di disegno con pixel neri trasparenti, equivalenti a new SKColor(0, 0, 0, 0) o all'intero 0x00000000. Tutti i byte di tutti i pixel vengono inizializzati su zero.

L'area di disegno di un oggetto SKCanvas ottenuto in un PaintSurface gestore potrebbe sembrare avere uno sfondo bianco, ma solo perché ha SKCanvasView uno sfondo trasparente e la pagina ha uno sfondo bianco. È possibile dimostrare questo fatto a se stessi impostando la Xamarin.FormsBackgroundColor proprietà di SKCanvasView su un Xamarin.Forms colore:

canvasView.BackgroundColor = Color.Red;

In alternativa, in una classe che deriva da ContentPageè possibile impostare il colore di sfondo della pagina:

BackgroundColor = Color.Red;

Vedrai questo sfondo rosso dietro la grafica SkiaSharp perché l'area di disegno SkiaSharp stessa è trasparente.

L'articolo SkiaSharp Transparency ha illustrato alcune tecniche di base nell'uso della trasparenza per disporre più elementi grafici in un'immagine composita. Le modalità di fusione vanno oltre questo, ma la trasparenza rimane fondamentale per le modalità di fusione.

Modalità di fusione SkiaSharp

Enumerazione SKBlendModes

L'importanza della trasparenza