create rounded corners
written by: admin
Date Written: 10/16/09
Last Updated: 6/22/12
This page demonstrates how to use PHP's
ImageMagick to create four rounded corner images (top right, top left, bottom right, and bottom left). The images are in png format with dimensions 100px X 100px. The second line
$test="yellow"; determines the color. If the color you specify is located in the list of colors below that line then the script will produce four corners with that color. Traditional color declarations are in hexadecimal and ImageMagick uses the base 10 number system when creating colors, so there is a code below that integrates the conversion of hexadecimal to integer.
rounded corners script
<?php
$test="yellow";
$test=strtolower($test);
$test=str_replace('#','',$test);
$colorname=array("silver"=>"c0c0c0",
"aqua"=>"00ffff",
"teal"=>"008080",
"cyan"=>"00fff",
"red"=>"ff0000",
"green"=>"008000",
"blue"=>"0000ff",
"orange"=>"ffa500",
"yellow"=>"ffff00",
"purple"=>"800080",
"tan"=>"d2b48c",
"beige"=>"f5f5dc",
"turquoise"=>"40e0d0",
"maroon"=>"800000",
"navy"=>"000080",
"gold"=>"ffd700",
"gray"=>"808080",
"indigo"=>"4b0082",
"pink"=>"ffc0cb",
"brown"=>"a52a2a"
);
if (array_key_exists($test, $colorname)) $test=$colorname[$test];
$a[0]=substr("$test",0,1);
$a[1]=substr("$test",1,1);
$a[2]=substr("$test",2,1);
$a[3]=substr("$test",3,1);
$a[4]=substr("$test",4,1);
$a[5]=substr("$test",5,1);
foreach ($a as &$b)
{
if ($b=='a') $b=10;
if ($b=='b') $b=11;
if ($b=='c') $b=12;
if ($b=='d') $b=13;
if ($b=='e') $b=14;
if ($b=='f') $b=15;
}
$b1=(($a[0]*16)+$a[1]);
$b2=(($a[2]*16)+$a[3]);
$b3=(($a[4]*16)+$a[5]);
$image = imagecreatetruecolor(100, 100);
$bg = imagecolorallocate($image, 0, 0, 0);
imagefilledrectangle($image, 0, 0, 100, 100, $bg);
$col_ellipse = imagecolorallocate($image, $b1, $b2, $b3);
imagefilledarc($image, 0, 100, 200, 200, 270, 360, $col_ellipse, IMG_ARC_PIE);
imagecolortransparent($image, $bg);
header("Content-type: image/png");
imagepng($image, 'test.png');
system("convert test.png -write tr.png png:-");
system("convert test.png -flip -write br.png png:-");
system("convert test.png -flop -write tl.png png:-");
system("convert test.png -flop -flip -write bl.png png:-");
?>
The same trick using css
A similar trick using just CSS can be accomplished with
border–radius. I do not use it because it does not work so well in versions of internet explorer prior to IE9.
<style type="text/css">
.example1 {
border-radius: 15px;
width:250px;
height:250px;
background-image:url('images/screenshots/noir18.jpg');
}
</style>
<div class='example1'> </div>
TAGS: php,
css