Introduction
In this article, we will learn about how to make pictures with rounded corners in ASP.NET. Here are the steps involved:
- Add to your project a webform (for example, PictureViewer.aspx).
- In the code-file "PictureViewer.aspx.cs", insert this code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Drawing;
using System.Drawing.Imaging;
public partial class PictureViewer : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string Filename = Request.QueryString["Filename"];
Int32 Radius = Convert.ToInt32(Request.QueryString["Radius"]) ;
if (!String.IsNullOrEmpty(Filename) &&
Radius > 0)
{
System.Drawing.Bitmap bmp = MakeRoundedCorners(Filename, Radius);
Response.ContentType = "image/Png";
bmp.Save(Response.OutputStream, ImageFormat.Png);
}
}
private Bitmap MakeRoundedCorners(String Filename,Int32 Radius)
{
System.Drawing.Image im =
System.Drawing.Image.FromFile(Server.MapPath(Filename));
Bitmap Bmp = new Bitmap(im, im.Width, im.Height);
Graphics G = Graphics.FromImage(Bmp);
Brush brush = new System.Drawing.SolidBrush(Color.Red);
for (int i = 0; i < 4; i++)
{
Point[] CornerUpLeft = new Point[3];
CornerUpLeft[0].X = 0;
CornerUpLeft[0].Y = 0;
CornerUpLeft[1].X = Radius;
CornerUpLeft[1].Y = 0;
CornerUpLeft[2].X = 0;
CornerUpLeft[2].Y = Radius;
System.Drawing.Drawing2D.GraphicsPath pathCornerUpLeft =
new System.Drawing.Drawing2D.GraphicsPath();
pathCornerUpLeft.AddArc(CornerUpLeft[0].X, CornerUpLeft[0].Y,
Radius, Radius, 180, 90);
pathCornerUpLeft.AddLine(CornerUpLeft[0].X, CornerUpLeft[0].Y,
CornerUpLeft[1].X, CornerUpLeft[1].Y);
pathCornerUpLeft.AddLine(CornerUpLeft[0].X, CornerUpLeft[0].Y,
CornerUpLeft[2].X, CornerUpLeft[2].Y);
G.FillPath(brush, pathCornerUpLeft);
pathCornerUpLeft.Dispose();
Bmp.RotateFlip(RotateFlipType.Rotate90FlipNone);
}
brush.Dispose();
G.Dispose();
Color backColor = Bmp.GetPixel(0, 0);
Bmp.MakeTransparent(backColor);
return Bmp;
}
}
- In Default.aspx, insert:
<body style="background-color:Black">
<form id="form1" runat="server" >
<asp:Image runat="server" ID="MyPicture"
ImageUrl="~/PictureViewer.aspx?Filename=Wolf.jpg&Radius=50"/>
<asp:Image runat="server" ID="Image1"
ImageUrl="~/PictureViewer.aspx?Filename=me.jpg&Radius=120"/>
</form>
</body>
- Don’t forget to add your own pictures in the project instead of mine: Wolf.jpg and me.jpg.
Good luck!