Blokları Tekrarlamak

Top  Previous  Next

Dinamik sayfaları geliştiriken genellikle liste halindeki (Ürün Listesi, Sipariş Listesi, Ülke Listesi, vs) verilerle uğraşır ve onları sayfa üzerinde görüntülemek için dinamik tablolar inşa ederiz.

Şimdi bir veritabanı sorgulaması sonucunda elde edilen ürünleri sayfa üzerinde görüntülemek istediğimizi varsayalım. Aşağıda verilen XML dokümanını kopyalayıp yeni bir XML dokümanı içine yapıştırın ve dosyayı "c:\xml\urunler.xml" olarak kaydedin.

 

<?xml version="1.0" encoding="UTF-8"?>

<root>

<urunler>

  <item>

    <AD>Masaüstü Bilgisayar</AD>

    <STOK>20</STOK>

    <FIYAT>799.99</FIYAT>

  </item>

  <item>

    <AD>Dizüstü Bilgisayar</AD>

    <STOK>10</STOK>

    <FIYAT>1199.99</FIYAT>

  </item>

  <item>

    <AD>Lazer Yazıcı</AD>

    <STOK>5</STOK>

    <FIYAT>649.00</FIYAT>

  </item>

  <item>

    <AD>Sabit Disk Sürücüsü</AD>

    <STOK>30</STOK>

    <FIYAT>88.5</FIYAT>

  </item>

</urunler>

</root>

 

Sorgu sonucu elde edilen her bir ürün için <urunler> veri kaynağı iminin altında bir <item> imi yer almaktadır. Ürün özellikleri olan AD, STOK ve FIYAT ise <item> iminin altında aynı adlı imlerle ifade edilmektedirler.

Şimdi, her bir <item> iminde yer alan değerleri sayfa üzerinde göstebilmek için bir tekrarlama mekanizmasına ihtiyacımız var.

Adımlar:

1.Projenizde yeni bir sayfa oluşturun
2.Sayfanın "Önizleme için XML Dosyası" özelliğine "c:\xml\urunler.xml" değerini verin.
3."Temel Elemanlar" araç çubuğu üzerinde yer alan Panel elemanı (PanelIcon) ikonuna tıklayın ve sonrasında sayfa üzerinde boş bir alana tıklayın. Sayfa üzerinde bir panel elemanı oluşacaktır.
4.Elemanın "Tekrarlama | Her Bir .. İçin" özelliğine  "/urunler/item" değerini verin
5.Panelin içine 3 adet metin elemanı ekleyin ve elemanlar seçili iken "Yanaştırma ve Çapalar" araç çubuğu üzerindeki sola yanaştır (DockToLeft) ikonuna tıklayın. Bu sayede elemanlar kendiliğinden üst tarafta ve yanyana dizilecektir.
6.Metin elemanlarının değerlerinin $vof() fonksiyonları kullanarak aşağıdaki gibi belirleyin.

RepeatingPanelView

7.$vof() tanımlarının "/urunler/item" düğümlerine göreceli olarak verildiğine dikkat edin. Eğer bu tanımlar "$vof(/urunler/item/AD)" şekinde verilseydi hatalı olurdu; çünkü bir tanımın ilk karakteri olarak "/" karakteri kullanılırsa bu o tanımın göreceli değil mutlak olduğunu gösterir ve bu durumda içine odaklanılan <item> imi altındaki <AD> imi yerine, her defasında XML dokümanının kökünden başlanılır ve bulunan ilk "urunler/item/AD" imi kullanılır.
8.STOK metin alanının değerini ortaya (AlignCenter) ve FIYAT alanının değerini sağa hizalayın (AlignRight).
9.FIYAT alanının "Değer Biçimi" özelliğine "#.###,00" verin.
10.Panel elemanı üzerine tıklayarak seçin ve sonra elemanın alt ve sağ tafafındaki kullanılmayan alanı yok etmek için Hizalama ve Boyutlandırma araç çubuğu üzerindeki  (SchrinkContainer) ikonuna tıklayın.
11.Ön izlemek için F9 tuşuna basın; Tarayıcı üzerindeki sonuç aşağıdakine benzer olacaktır.
 
RepeatingResultInBrowser
 
12.Düşük stok seviyesi uyarısı için elemanının "Yazı Tipi | Renk" özelliğine "$vof(STOK < 20 ? 'red')" değerini verin.
13.Ek olarak, sayfa üzerinde çift numaralı satırları farklı renklendirmek için panelin "Arkaplan | Renk" özelliğine "$vof(position() mod 2 = 0 ? 'silver')" değerini verin.
 
Background_Font_Color
 
14.Aşağıdakine benzer bir sonuç elde etmek için tekrar F9 tuşuna basın.
 

RepeatingPanelView_2

 

 

camera2

Nasıl yapıldığını izle