Table des matières
Il existe différents types de effets et transformations qui peut être appliqué sur toile, cela permet de générer des images qui auparavant ne pouvaient être imaginées qu'en flash et autres outils similaires.Parmi ces effets, nous avons la création d'ombres qui nous permet de donner un relief aux dessins que nous incorporons dans notre ToileIl existe également des effets de transparence, qui permettent de superposer un élément sur un autre, générant des probabilités de conception infinies.
Nuances
Les ombres nous permettent de donner un effet de profondeur et de relief à nos éléments, sur la toile nous pouvons incorporer ces ombres aux éléments, pour cela nous avons les propriétés suivantes qui nous permettent de les personnaliser en fonction de ce que nous voulons réaliser avec elles :
- OmbreFlou : Définit le degré de netteté de l'ombre sur une valeur plus élevée, moins de netteté et plus de dispersion.
- couleur de l'ombre : Permet de définir la couleur de l'ombre.
- shadowOffsetX : Définit le point de sortie horizontal de l'ombre.
- shadowOffsetY : Définit le point de chute vertical de l'ombre.
Exemple Votre navigateur ne supporte pas l'élément Toile Dans cet exemple, nous appliquons des ombres à un rectangle ainsi qu'à du texte et à une courbe, voyons à quoi cela ressemble dans le navigateur :
Pour établir la transparence, nous avons deux moyens, le premier est d'utiliser le fonction rgba dans les attributs fillStyle Oui coupStyle; la deuxième façon que nous avons est d'utiliser la propriété de dessin globalAlpha qui s'applique universellement.
Voyons ci-dessous un exemple utilisant la seconde forme qui est la plus simple et la plus directe à appliquer, nous soulignons que les valeurs qu'elle accepte globalAlpha ils sont 0 pour une transparence totale Oui 1 pour le rendre totalement opaque, dans le cas de l'exemple nous utiliserons 0.5 comme valeur qui nous permet un juste milieu :
Exemple Votre navigateur ne supporte pas l'élément Toile Comme on peut le voir, ce que nous avons fait a été de tracer un rectangle sur le texte et grâce à globalAlpha on voit l'effet de transparence qui permet d'apprécier les deux figures dessinées :
