asp.net, jquery ve diğer web teknolojileri üzerine » crop http://www.apostylee.com asp.net, jquery ve diğer web teknolojileri üzerine, biraz da kişisel. Mon, 10 Oct 2011 11:49:03 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 jQuery Asp.Net Fotoğraf Kırpmak http://www.apostylee.com/asp-net-crop-image/ http://www.apostylee.com/asp-net-crop-image/#comments Mon, 12 Jul 2010 12:06:17 +0000 apoStyLEE http://www.apostylee.com/?p=739

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

<script type="text/javascript">
		    jQuery(document).ready(function() {
		    jQuery('#cropImage').Jcrop({
		            onSelect: updateCoords
		        });
		    });
		    function updateCoords(c) {
		        jQuery('#X').val(c.x);
		        jQuery('#Y').val(c.y);
		        jQuery('#W').val(c.w);
		        jQuery('#H').val(c.h);
		    };
		</script>

<body>
    <form id="form1" runat="server">
        <asp:FileUpload ID="FileUpload1" runat="server" />
        <asp:Button ID="UploadImage" runat="server" Text="Upload Image" onclick="Upload_Click" />

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

        <!-- hidden fileds -->
        <asp:HiddenField ID="X" runat="server" />
        <asp:HiddenField ID="Y" runat="server" />
        <asp:HiddenField ID="W" runat="server" />
        <asp:HiddenField ID="H" runat="server" />
    </form>
</body>

default.aspx.cs

    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;
    }

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

]]> http://www.apostylee.com/asp-net-crop-image/feed/ 5