jQuery Asp.Net Fotoğraf Kırpmak

geri

Fotoğraf kırpmak (crop) işlemi dışarıdan karışık bir işmiş gibi görünsede esasında çok basit bir işlemdir. Hele ki jCrop diye güzel jquery eklentisi varken bu işlem hem kolay hemde eğlencelidir. Olayın mantığına bakacak olursak, jCrop bizim için resim üzerinde seçtiğimiz kısımın yükseklik, genişlik, x ve y değerlerini alıyor. Sornasın da bu bilgiler eşliğinde orjinal resim üzerinde kesme işlemini yapıyoruz. Eklentinin bir çok ayarı ve özelliği bulunuyor, bunlara buradan ulaşabilirsiniz. Az kaldı unutuyordum, projenize jquery.js ve jCrop u eklemeyi unutmayın :)

default.aspx

[html]

<asp:Literal runat="server" ID="ltrImage" /> <asp:Button ID="Crop" runat="server" Text="Crop Image" onclick="Crop_Click" Visible="false" />

\[/html\]

default.aspx.cs

[csharp] protected void Crop_Click(object sender, EventArgs e) { int x = Convert.ToInt32(X.Value); int y = Convert.ToInt32(Y.Value); int w = Convert.ToInt32(W.Value); int h = Convert.ToInt32(H.Value); string strFileName = Crop.CommandArgument; System.Drawing.Image image = Bitmap.FromFile(Server.MapPath("~/crop/" + strFileName));

Bitmap bmp = new Bitmap(w, h, image.PixelFormat); Graphics g = Graphics.FromImage(bmp); g.DrawImage(image, new Rectangle(0, 0, w, h), new Rectangle(x, y, w, h), GraphicsUnit.Pixel);

bmp.Save(HttpContext.Current.Request.PhysicalApplicationPath + "crop/reSize-" + strFileName, image.RawFormat); ltrImage.Text = "<img src=\"reSize-" + strFileName + "\" id=\"cropImage\" alt=\"" + strFileName + "\" />"; }

protected void Upload_Click(object sender, EventArgs e) { FileUpload1.SaveAs(Server.MapPath("~/crop/" + FileUpload1.FileName)); ltrImage.Text = "<img src=\"" + FileUpload1.FileName + "\" id=\"cropImage\" alt=\"" + FileUpload1.FileName + "\" />"; Crop.CommandArgument=FileUpload1.FileName; Crop.Visible = true; } [/csharp]

Çalışan örneğe buradan bakabilirsiniz, örneği indirmek için buraya tıklayabilirsiniz. Herkese iyi çalışmalar..

2010-07-12 | asp-net, jquery