Comment, avec gd, dessiner un rectangle transparent plein avec des coins arrondis.

Commenter

Contenu du snippet

GD ne propose pas de rectangle aux coins arrondis.
Certains proposent de croiser deux rectangles et de remplir les coins
avec des cercles.
Mais cela n'est pas utilisable avec une couleur transparente, car les parties où il y a des superpositions sont moins transparentes que les autres.
Je vous propose donc, de faire :
- la partie horizontale vraiment rectangulaire,
- puis de construire les deux flancs arrondis, ligne de 1 pixel de large
par ligne de 1 pixel de large tout en faisant varier la longueur
du segment de manière à obtenir l'arc de cercle souhaité.

Source / Exemple : 


<?php
    /**


         
  •  Comment, avec GD, dessiner un rectangle transparent plein avec des coins arrondis.

    •      
  •  

    •      
  •  GD ne propose pas de rectangle aux coins arrondis.

    •      
  •  Certains proposent de croiser deux rectangles et de remplir les coins

    •      
  •  avec des cercles.

    •      
  •  Mais cela n'est pas utilisable avec une couleur transparente, 

    •      
  •  car les parties où il y a des superpositions sont moins transparentes.

    •      
  •  

    •      
  •  Je vous propose donc, de faire :

    •      
  •   - la partie horizontale vraiment rectangulaire, 

    •      
  •   - puis de construire les deux flancs arrondis, ligne de 1 pixel de large 

    •      
  •     par ligne de 1 pixel de large tout en faisant varier la longueur 

    •      
  •     du segment de manière à obtenir l'arc de cercle souhaité.

    •      
  •     

    •      
  •  Ce petit script fonctionne.   

    •      
  •  

    •      
  •  @author : Rainbow

    •      
  •  

    •      
  • /

	
	/** Création de l'image-png de base, de couleur bleu-ciel */
	header ("Content-type: image/png");
	$image = imagecreatetruecolor(500,400);
	$ciel = imagecolorallocate($image, 230, 240, 255);
	imagefill($image,0,0,$ciel);
	
	/** Trait noir, pour vérifier la transparence */
	$noir = imagecolorallocate($image, 0, 0, 0);
	imageline($image,50, 10, 300, 350, $noir);
	
	/** rectangle jaune opaque, idem */
	$jaune = imagecolorallocate($image, 255, 255, 0);
	imagefilledrectangle($image,50, 50, 300, 100, $jaune);
	
	/** rectangle jaune un peu transparent (32/127), idem */
	$jaune_alpha = imagecolorallocatealpha($image, 255, 255, 0, 32);
	imagefilledrectangle($image,50, 150, 300, 200, $jaune_alpha);
	
	/** Passons au choses sérieuses */
	/** Pour dessiner un rectangle aux coins arrondis */
	function rectangleArrondi($image, $x0, $y0, $x1, $y1, $rayon, $couleur) {
		/** $couleur peut-être opaque ou transparente */
		/** On s'assure que le rayon n'est pas trop grand. 
			Pour simplifier le dessin des flancs, supposons que $x0<$x1 
			et $y0<$y1


    		
  • /

		$largeur = $x1-$x0;
		if (($y1-$y0)<$largeur) { $largeur = $y1-$y0;}
		if ((2*$rayon)>($largeur-1)) { $rayon = floor(($largeur-1)/2);}
		/** On dessine la partie horizontale réellement rectangulaire */
		imagefilledrectangle($image, $x0+$rayon, $y0, $x1-$rayon, $y1, $couleur);
		/** On dessine, ligne verticale par ligne verticale, les deux flancs arrondis */
		for ($r=1;$r<=$rayon;$r++) {
			$reduction = round(sqrt($rayon*$rayon - $r*$r)); /** merci Pythagore */
			/** flanc gauche */
			imageline($image,
				$x0+$rayon-$r, $y0+$rayon - $reduction, 
				$x0+$rayon-$r, $y1-$rayon + $reduction, 
				$couleur);
			/** flanc droit */
			imageline($image,
				$x1-$rayon+$r, $y0+$rayon - $reduction, 
				$x1-$rayon+$r, $y1-$rayon + $reduction, 
				$couleur);
		}
	}
	/** On utilise la fonction ci-devant, pour dessiner notre rectangle arrondi */
	rectangleArrondi($image, 50, 250, 300, 300, 15, $jaune_alpha);
	
	/** On affiche à l'écran puis on libère la mémoire */
	imagepng($image);
	imagedestroy($image);
?>

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (cs_Rainbow)