Bu yazımda kullanılması gereken bir nesneyi tanıtacagım;

DataList

Peki bu nesneyi nerelerde kullanabiliriz;

• Ürün listelemede
• Menü yapma
• Resim galerisi yapımında kullanabiliriz.

Aslında nesnemizin sınırları çerçevesinde hayalgücümüzün elverdigince kullanabiliriz.

İsterseniz direk kullanımına geçelim ToolBox>Data>DataList diyerek Datalist imizi ekliyoruz İçine birde DataSource ekleyerek DataListimizi Veritabanımıza bağlıyoruz bize veritabanımızdaki verileri gösteren basit bir template sunar.

Yukarıda Görmüş oldugunuz kısımlar tamamen düzenlebilir kısımlardır. Bizde genel anlamda bu kısımlara deginiyor olacağız.

Yanda gördüğümüz “ok” işaretini tıkladıktan sonra Property Builder.. ‘ı tıklayarak ayarlarımızı düzenleyecegimiz kısma geçiyoruz

Columns değerimiz sütunlarımızı belirtmekte değerimizi 3 yaptığımız taktirde 3 sütunlu bir listeye sahip olacağız

Direction değerimiz tablolarımızın yatay veya dikey olarak dizilmesini sağlar default değer olarak Vertical seçilidir biz bunu Horizontal olarak değiştirirsek yatay bir

Şimdilik bize lazım olabilecek kısımlar bunlar isterseniz format sekmesinden farklı biçimler için farklı stiller tasarlayabiliriz..

 

Ben Colums kısmını 4 Direction kısmını ise vertical olarak bıraktım..

Sıra gedi Template Tasarlamaya, buranın mantığına kısaca değinicek olursak template kısmı repeat eden kısım, bu kısım veritabanında gelen verileri sırasıyla hazırladığımız şablonda yerlerine koyar ve bu işlemi veriler bitene kadar tekrarlar, işte bizde bu tekrar eden kısmı tasarlıyacağız;

Yine ok işeretine tıklayarak Edit Templates diyoruz ve karşımıza herşeyi düzenleyebildigimiz şablon ekranımız geliyor “[" ve "]” işaretleri arasında olan yazılar veritabanından çekilen kısımlar gerikalan kısımlar ise verilerimizi belirtmek için kullandığımız yazılar

Biz bu kısmı kendi ihtiyaçlarımıza göre düzenleyeceğiz düzenlemek içinse sadece bir iki küçük şey ekleyip yazıların fontunu ve büyüklüğünü ayarlayarak sitediğimiz şekli vereceğiz

Öncelikle burdaki gereksiz şeyleri silmemiz gerek, biz ürün listeleyeceğimiz için çok fazla ayrıntıya gerek yok.

ProductName, ProductProperties1, ProductProperties2, ProductProperties3, ProductPrice Bize gerekenler gerisini silebiliriz

Sildikten sonra Ürünümüzü gösterebilmek için bir adet image nesnesi ekliyoruz ekledikten sonra nesnemizin hemen sağüst köşesinde bulunan oka tıklıyoruz ve “EditDataBindings…” diyoruz ve nesnemizin özelliklerini veritabanındaki verilere bağlayacagımız ekran geliyor.

Örneğin imege nesnemizin yükseklik ve genişliğini veritabanından çekebiliriz

Peki bunu nasıl yaparız..

Bindable properties kısmından nesnemizin özelliğini seçiyoruz bu özellikler herbir nesnede farkılık gösterir örneğin bi texbox ta text kısmını bağlayabiliriz. Show all properties dersek nesnemizin bütün özellikleri gözükecektir, biz ImageUrl kısmını kullanacagız bu şekilde resmimizin urlsini veritabanından seçerek resmimizi göstereceğiz.

Bound to kısmından tablomuzun imageurlmizin bulundugu kısmı seçiyoruz. Bende bu ProductImageUrl olarak kayıtlıydı, Ok diyerek bitiriyoruz.

Sonrasında template imizi düzenliyoruz.

Düzenledikten sonra Projemizi çalıştırıyoruz çalıştırdıgımızda oluşturduğumuz template 3 sütun halinde aşşağıya doğru sıralanmış ürünleri göremeyecegiz çünkü veritabanımızda veri yok veritabanımızı doldurduğumuzda ürünlerimiz listelenecektir.

Takıldığınız verler için bana adresinden bana mail yoluyla ulaşabilirsiniz..

Daha ayrıntılı bilgi için burayı ziyaret edebilirsiniz

 

Ahmet Enes DABANLIOĞLU - MIWtech YKB