venerdì 6 marzo 2015

Gradienti: esempi pratici

I gradienti possono essere utilizzati per ottenere oggetti grafici complessi, ad esempio utilizzando dei gradienti uno su l'altro e modificando le varie trasparenze, potete ottenere una sfera come questa:
Potete anche aggiungere degli effetti particolari, ad esempio con un gradiente di tipo conico, ripetizione 30, mirror e wrap attivati, potete arrivare a questo risultato:



Inoltre potete animare la sfera come in questo video:

Il codice dell'animazione si può scaricare da qui.
Oltre che il property inspector, per le trasparenze c'è sempre la comoda proprietà blendlevel, mentre per giocare con i gradienti, c'è la proprietà fillGradient.
La proprietà fillGradient è un array, con le seguenti chiavi:
  • type - il tipo, può essere uno dei seguenti valori: linear, radial, conical, spiral, diamond, xy, sqrtxy
  • ramp - Una lista di colori per il gradiente. Ogni riga di questa lista deve contenere cinque numeri separati da virgola ("0.5,255,0,0,125"); i numeri rappresentano in ordine:
    • posizione - è un numero decimale tra 0 e 1 (compresi).
    • colore - è una tripletta che esprime il colore in formato RGB (255,0,88).
    • trasparenza - un numero intero tra 0 e 255 che rappresenta la trasparenza. Il valore 0 significa completamente trasparente, il 255 completamente opaco.
  • from - le coordinate del punto di partenza del gradiente
  • to - le coordinate del punto di arrivo del gradiente
  • via - un punto tra parteza e arrivo che influisce sia sulla scalla che l'inclinazione del gradiente.
  • quality - la qualità che può essere solo: normal, good
  • repeat - le ripetizioni tra la partenza e l'arrivo, può essere solo un numero intero tra 1 e 255.
  • mirror - se attivare l'effetto specchiato, può essere solo vera (true) o falsa (false).
  • wrap - se attivare l'effetto riempitivo, può essere solo vera (true) o falsa (false).