Blog

usingSystem;
usingSystem.Web;
usingSystem.IO;
usingSystem.Drawing;

Simdi sinifimizi yazalim.

//Oto resize isimli bir sinif olusturduk.

public class OtoResize

{

    //Resimlerimizi yeniden boyutlandirtikdan sonra geriye byte dizisi olarak döndürecegiz. Bunun için KucukResimOlustur isimli bir metot yaziyoruz. Bu metot static olsun ki sinifi örneklemeden metodumuzu kullanabilelim.

    public static byte[] KucukResimOlustur(stringdosyaYolu, intyukseklik, intgenislik, stringdosyaUzantisi)

    {

        dosyaYolu = HttpContext.Current.Server.MapPath(dosyaYolu);

        // Image tipinde bir degisken tanimlayip, Image tipinin Fromfile metodunu kullanarak dosya yoluna göre resmi img degiskenenine gönderdik.

        Imageimg =  Image.FromFile(dosyaYolu);

        dosyaUzantisi = dosyaUzantisi.ToLower();

        byte[] buffer = null;

        //Resmin orjinal boyutlarini aliyoruz.

        inttempGenislik = img.Size.Width;

        inttempYukseklik = img.Size.Height;

        //Resmin yeniden boyutlandirilip boyutlandirilamayacagina bakiyoruz.

        boolgenislikResize = (genislik > 0 && tempGenislik > genislik && tempGenislik > yukseklik);

        boolyukseklikResize = (yukseklik > 0 && tempYukseklik > yukseklik && tempYukseklik > genislik);

        if(genislikResize || yukseklikResize)

        {

            intiStart;

            Decimalayrac;

            //Resmi enine göre yeniden boyutlandiriyoruz.

            if(genislikResize)

            {

                iStart = tempGenislik;

                ayrac = Math.Abs((Decimal)iStart / (Decimal)genislik);

                tempGenislik = genislik;

                tempYukseklik = (int)Math.Round((Decimal)(tempYukseklik / ayrac));

            }

            else //resmi boyuna göre yeniden boyutlandiriyoruz.

            {

                iStart = tempYukseklik;

                ayrac = Math.Abs((Decimal)iStart / (Decimal)yukseklik);

                tempYukseklik = yukseklik;

                tempGenislik = (int)Math.Round((Decimal)(tempGenislik / ayrac));

            }

            // GetThumbnailImage metodunu kullanarak resmi yeniden boyutlandiriyoruz ve yeni resmi olusturuyoruz.

            ImageyeniResimDosyasi = img.GetThumbnailImage(tempGenislik, tempYukseklik, null, newSystem.IntPtr());

           // MemoryStream sinifini kullanarak resmin çiktisini olusturuyoruz.

            using(MemoryStreamms = new MemoryStream())

            {

                if(dosyaUzantisi.IndexOf("jpg") > -1)

                {

                    yeniResimDosyasi.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg);

                }

                else if(dosyaUzantisi.IndexOf("png") > -1)

                {

                    yeniResimDosyasi.Save(ms, System.Drawing.Imaging.ImageFormat.Png);

                }

                else if(dosyaUzantisi.IndexOf("gif") > -1)

                {

                    yeniResimDosyasi.Save(ms, System.Drawing.Imaging.ImageFormat.Gif);

                }

                else

                {

                    yeniResimDosyasi.Save(ms, System.Drawing.Imaging.ImageFormat.Bmp);

                }

                buffer = ms.ToArray(); 

            }

        }

        returnbuffer;

    }

}
 
Sinifimizi yazdik, simdi birde bu resmi otomatik olarak olusturacak bir ara sayfa yapalim. Bu sayfa yukarida ki parametreleri (dosyaYolu, yukseklik, genislik, dosyaUzantisi)alsin ve sinifimizin içindeki KucukResimOlustur metoduna göndersin. Geri dönen degere göre de resimlerin çiktisini olustursun. Projeme DinamikResim.aspx isimli bir sayfa ekledim. Simdi load eventine gidip asagidakileri yazalim.


protectedvoid Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
Response.Clear();
//Parametreleri aliyoruz.
int yukseklik= 200;
int genislik = 250;
if (Request["genislik"] != null)
{
genislik = Int32.Parse(Request["genislik"].ToString());
}
if (Request["yukseklik"] != null)
{
yukseklik = Int32.Parse(Request["yukseklik"].ToString());
}
string ResimAdi = Request.QueryString["ResimAdi"];
string uzanti = System.IO.Path.GetExtension(Server.MapPath(ResimAdi));
//Parametreleri metodumuza gönderiyoruz...
byte[] pBuffer = OtoResize.KucukResimOlustur(ResimAdi, yukseklik,genislik,uzanti);
Response.ContentType = "image/" + uzanti;
//Sayfamizin contenttype'ni image olarak belirledik ve Resmimiz olusturuluyor...
Response.OutputStream.Write(pBuffer, 0, pBuffer.Length);
Response.End();
}
}

Evet, ara sayfamizi da yazdik. Simdi bunu kullanalim.

<imgsrc="DinamikResim.aspx?ResimAdi=semgoksu.jpg&genislik=100" />
<br/>
<imgsrc="DinamikResim.aspx?ResimAdi=semgoksu.jpg&genislik=200" />
<br/>
<imgsrc="DinamikResim.aspx?ResimAdi=semgoksu.jpg&genislik=300" />



Dinamik ve resimde bozulma olmadan resimleri farkli boyutlarda görüntüleyebildik. :0) Simdi projemize bir sayfa daha ekleyelim. Bu sayfada da resimleri görüntüleyecegiz. Ekleyecegimiz sayfaya da galeri.aspx ismini verelim. Bu sayfada basitçe bir resim galerisi yapacagiz. Verileri database'den getirecegiz. Galeri isimli bir tablo olusturalim.



Tablomuzu olusturduktan sonra içerisine veriler girelim. Dosya yolu alaninda sadece resimlere ait açiklama ve dosya adini tutacagiz.



Simdi sayfamizi hazirlayalim. Ilk olarak sayfamiza datalist ve image nesnesi ekleyelim nesnesi ekleyelim. Datalistte küçük resimler olusacak. Üzerine geldigimizde de image nesnesi üzerinde yine dinamik olarak olusturacagimiz büyük resim görüntülenecek.

Datalistimizin HTML Kodlari

<script>
functionResimDegistir(dosyaYolu)
{
  document.getElementById('galeriBuyukResim').src ='DinamikResim.aspx?ResimAdi=images/'+ dosyaYolu + "&genislik=350";
}
</script>

 
Küçük resimlerin üzerine geldigimizde büyük resmi yükleyecek javascript kodunu yazdik.

<img id="galeriBuyukResim" runat="server" /><br /><br />
<asp:DataList ID="DataList1" runat="server" RepeatDirection="Horizontal" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<img src='<%# "DinamikResim.aspx?ResimAdi=images/"+ Eval("DosyaYolu")+ "&genislik=100" %>' onmouseover="ResimDegistir('<%#Eval("DosyaYolu") %>')" /><br />
<%# Eval("Aciklama") %>
</ItemTemplate>
<ItemStyle Font-Bold="True" Font-Names="Trebuchet MS" Font-Size="11px" HorizontalAlign="Center" Width="110px" />
</asp:DataList>
Verilerimiz de çekelim.

protectedvoid Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
ResimleriGetir();
}
}

private void ResimleriGetir()
{
SqlConnection Cnn = new SqlConnection("Server=.; Database=Netron; uid=sa; pwd=sa12345");
SqlDataAdapter Da = new SqlDataAdapter("Select * from Galeri",Cnn);
DataTable Dt = new DataTable();
Da.Fill(Dt);
DataList1.DataSource = Dt;
DataList1.DataBind();
//Büyük resim için ilk resmi büyük resme yüklüyoruz.
galeriBuyukResim.Src = "DinamikResim.aspx?ResimAdi=images/"+Dt.Rows[0]["DosyaYolu"].ToString() + "&genislik=350&height=200";
}

Simdi haziriz. Çalistiralim,

Iste Sonuç. Resimler de herhangi bir bozulma yok. Tek bir resim kullanarak galerimizi olusturduk. :0)

Bu makalenin de sonunda geldik. Baska bir makale de görüsmek üzere.

Sem Göksu

sem.goksu@yazilimgunlugu.com
www.semgoksu.com | www.yazilimgunlugu.com

Kaynaklar

www.msdn.com
www.codeproject.com