Publié le 08/11/2010
Auteur fobec
Réseaux sociaux
0 partages
0 tweets
0 plus
0 commentaires

Dessiner un degrade horizontal sur une image PNG

L'extension GD rassemble toutes les fonctions pour générer des images dynamiquement. En complément à l'article sur la création de graphique en PHP, la class HorizontalGradient génère un dégradé horizontal avec les critères suivants:
- couleur de départ et de fin du dégradé au format hexadécimal,
- la hauteur et la largeur de l'image.

Dessiner sur le canvas d'un PNG

En fait, il n'existe pas de fonction dégradé dans la librairie GD de PHP. L'astuce consiste à tracer une multitude de ligne à chaque fois d'une couleur différente. Ainsi dans une boucle allant du 1er pixel à la largeur de l'image, la class dessine un trait.
<?
/**
 * Générer un degradé horizontal sur une image png
 */
class HorizontalGradient {
 
    private $sColors=array('R'=>0, 'G'=>0, 'B'=>0);
    private $eColors=array('R'=>0, 'G'=>0, 'B'=>0);
 
    /**
     * Fixer les couleurs de départ et de fin du dégradé
     * @param string $startcolor
     * @param string $endcolor
     */
    public function setColors($startcolor, $endcolor) {
        if (strlen($startcolor)==6) {
            $this->sColors['R']=hexdec(substr($startcolor,0,2));
            $this->sColors['G']=hexdec(substr($startcolor,2,2));
            $this->sColors['B']=hexdec(substr($startcolor,4,2));
        }
 
        if (strlen($endcolor)==6) {
            $this->eColors['R']=hexdec(substr($endcolor,0,2));
            $this->eColors['G']=hexdec(substr($endcolor,2,2));
            $this->eColors['B']=hexdec(substr($endcolor,4,2));
        }
    }   
 
    /**
     * Dessiner le degradé sur l'image
     * @param int $width
     * @param int $height
     */
    public function drawCanvas($width, $height) {
        $canvas = imagecreatetruecolor($width, $height);
        $steps['R']=($this->eColors['R']-$this->sColors['R'])/$width;
        $steps['G']=($this->eColors['G']-$this->sColors['G'])/$width;
        $steps['B']=($this->eColors['B']-$this->sColors['B'])/$width;
 
        for ($i=0; $i<$width; $i++) {
            $r = $this->sColors['R'] + $i*$steps['R'];
            $g = $this->sColors['G'] + $i*$steps['G'];
            $b = $this->sColors['B'] + $i*$steps['B'];
            $c=imagecolorallocate($canvas,$r,$g,$b);
            imageline($canvas, $i, 0, $i, $height, $c);
        }
 
        header("Content-Type: image/png");
        imagepng($canvas);
        imagedestroy($canvas);
    }   
}
?>

Dégradé bleu au violet


Utilisons la class pour créer un rectangle de 350 px sur 50 px, le dégradé s'opère de gauche à droite du violet au rose. Le résultat est affiché sous forme d'une image PNG directement dans le navigateur. Pour sauvegarder le dégradé, modifiez la class en supprimant le bloc header(...) et en indiquant le chemin de l'image à enregistrer.
<? 
/**
 * Exemple de dégradé
 */
$HorizontalGradient=new HorizontalGradient();
//du bleu au rose
$HorizontalGradient->setColors('0000FF', 'FF00FF');
//image de 350px X 50px
$HorizontalGradient->drawCanvas(350, 50);
?>
Voir ci-dessous le dégradé de couleur obtenu:

php_gradient

Ajouter un commentaire

Les champs marqués d'un * sont obligatoires, les adresses emails se sont pas publiées.

A lire aussi

Réseaux sociaux
Présentation de l'article
Catégorie
php5 - class
Mise a jour
08/11/2010
Visualisation
vu 3143 fois
Public
Internaute
Auteur de la publication
Fobec
Admin
Auteur de 261 articles
|BIO_PSEUDO|
Commentaires récents

Publié par Axel dans java

la position sur mouseDragged a ete corrigee dans l'article.
Merci Alpcom !

Publié par Jacques dans CMS

Cette méthode produit une gamme de gris qui ne tient pas compte des caractéristiques de la vision humaine.
En vidéo on utilise la fonction luminance qui représente mieux les jaunes et les ve...

Publié par bakouz dans java

Bonjour Axel,
je suis tombe sur ton site un peu par hasard.
Hasard car je ne le connaissais pas jusqu'a maintenant, et non du hasard car c'est exactement ce genre de class que je recherchais. !...

Publié par Axel dans java

L'astuce de la conversion en gris se situe dans imagedst.
Le BufferedImage imagesrc contient l'image en couleur, imagedst est une image cree en nuance de gris. Lorsque l'on copie l'image colorisee...

Publié par bapsmaitihere dans logiciel

je souhaite tester