Rectangle with rounded edges, with a tranparent fill

tonelm54
tonelm54 used Ask the Experts™
on
Im trying to create a rectangle with a tranparent fill in PHP, as I want to be able to eventually change the shape with $_GET, however I cannot get it to work with static values at the moment. All I seem to get is a big black rectangle.

I abandoned my code, as it appeared someone else has been trying this as well at the php website, but still I cant get it to work :-(

What Im tring to do it make something similar to:-
Rounded Rectangle
What I get is:-
Test image
My Code Im trying to get working is:-
<?php

function draw_roundrectangle($img, $x1, $y1, $x2, $y2, $radius, $color,$filled=1) {
    if ($filled==1){
        imagefilledrectangle($img, $x1+$radius, $y1, $x2-$radius, $y2, $color);
        imagefilledrectangle($img, $x1, $y1+$radius, $x1+$radius-1, $y2-$radius, $color);
        imagefilledrectangle($img, $x2-$radius+1, $y1+$radius, $x2, $y2-$radius, $color);

        imagefilledarc($img,$x1+$radius, $y1+$radius, $radius*2, $radius*2, 180 , 270, $color, IMG_ARC_PIE);
        imagefilledarc($img,$x2-$radius, $y1+$radius, $radius*2, $radius*2, 270 , 360, $color, IMG_ARC_PIE);
        imagefilledarc($img,$x1+$radius, $y2-$radius, $radius*2, $radius*2, 90 , 180, $color, IMG_ARC_PIE);
        imagefilledarc($img,$x2-$radius, $y2-$radius, $radius*2, $radius*2, 360 , 90, $color, IMG_ARC_PIE);
    }else{
        imageline($img, $x1+$radius, $y1, $x2-$radius, $y1, $color);
        imageline($img, $x1+$radius, $y2, $x2-$radius, $y2, $color);
        imageline($img, $x1, $y1+$radius, $x1, $y2-$radius, $color);
        imageline($img, $x2, $y1+$radius, $x2, $y2-$radius, $color);

        imagearc($img,$x1+$radius, $y1+$radius, $radius*2, $radius*2, 180 , 270, $color);
        imagearc($img,$x2-$radius, $y1+$radius, $radius*2, $radius*2, 270 , 360, $color);
        imagearc($img,$x1+$radius, $y2-$radius, $radius*2, $radius*2, 90 , 180, $color);
        imagearc($img,$x2-$radius, $y2-$radius, $radius*2, $radius*2, 360 , 90, $color);
    }                
}

$canvas = imagecreatetruecolor(200, 200);
draw_roundrectangle($canvas,10,10,40,40,50,$black);

header('Content-Type: image/jpeg');
imagejpeg($canvas);
imagedestroy($canvas);

?>

Open in new window


Any ideas?
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Commented:
in php you have to have an image for the rounded corner
in html 5 its easy to do it in a div and cs3

see
http://net.tutsplus.com/tutorials/html-css-techniques/html-5-and-css-3-the-techniques-youll-soon-be-using/

Author

Commented:
My problem is I need to do this for users still using IE 6, which HTML5 (to my understanding) wont allow me to do rounded corners, hence thinking of doing this as a background image to my div.
Fundamentals of JavaScript

Learn the fundamentals of the popular programming language JavaScript so that you can explore the realm of web development.

Commented:
the link I posted is using the gd library in php and images for the corners
i started metioning html 5 but edited my comment when I found the link

Commented:
by the way users still using ie6 not for much longer microsoft are doing silent updates to ie
Most Valuable Expert 2011
Top Expert 2016

Commented:
You might find this helpful.  You can set the black color to be transparent.
http://php.net/manual/en/function.imagecolorallocatealpha.php

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial