FMX Vertical Grid

[pro_imaj]

Merhaba,

Mobil tarafta aşağıdaki resimdeki gibi dikey yada yatay olarak bu şekilde nasıl bir liste oluşturabilirim. Bu konuda hangi bileşenler yada nasıl ilerlemeyi tavsiye edersiniz.



Teşekkürler.

[Abdullah ILGAZ]

Merhaba,

Eğer grid gerekliliği yoksa TVertScrollbox ile oluşturacağınız komponenti çalışma anında gerektiği kadar üretip parent olarak scrollbox'a atamasını yapabilirsiniz.

Komponent için ön gördüğüm;

- TRectangle // dış çerçevenin olduğu ana konteynır olur. StrokeKind solid, $FFE4E5E9, 2px kalınlık
- - TRectangle // üst kısım (görsel ve başlık) için beyaz arkaplanlı bölüm, Fill $FFFFFFFF
- - - TImage // Align Client, Margin 3-3-3-3
- - - TLabel // Align Bottom, TextAlign center, VerticalAlign center, FontSize 12, WordWrap true
- - TRectangle // alt kısım (fiyat ve sepete ekle) için krem-gri bölüm, Fill $FFF5FAFE
- - - TLabel // Align Left, MarginLeft 3
- - - TRectangle // XRadius, YRadius 100, Fill $FF00a2b6, HitTest true (Tıklanılabilir)
- - - - TImage // beyaz + ikonu, HitTest false

Dipnot: Yükseklik kıstaslarını sizin belirlemenizde fayda var.

[engerex]

Bir inceleyin : http://www.delphican.com/showthread.php?...34#pid1034

[mcuyan]

Grid Layout da deneyebilirsiniz.. Runtime Column ve row lar oluşturup bunların değerlerini hesaplatmanız lazım.. Biraz matematik çalıştırıcaksınız.. Grid layout nesnesinin içine de rectangle ları yerleştiriceksiniz.. Rectangle lara imaj ve buton yerleştirebilirsiniz..

[TescilsizUzman]

Merhaba,
Tüm mobil uygulamalarda bu tip listelemeler için ListView kullanılır. @Abdullah ILGAZ bey'in önerileri de iyi bir alternatif yöntemdir.

Tasarım anı görüntüsü
   

Çalışma anı görüntüsü

var
 I: Integer;
 lvItem: TListViewItem;
begin
 ListView1.BeginUpdate;
 try
   lvItem := ListView1.Items.Add;
   lvItem.Data['Text1'] := 'CHUPA CHUPS AROMALI LOLİPOP 29GR';
   lvItem.Data['Text3'] := '1,20';
   TListItemImage(lvItem.Objects.FindDrawable('Image2')).ImageIndex := 0;
   TListItemImage(lvItem.Objects.FindDrawable('Image4')).ImageIndex := 2;

   lvItem := ListView1.Items.Add;
   lvItem.Data['Text1'] := 'ÇEREZZA MISIR ÇEREZİ SÜPER BOY 112 GR PEYNİR-SOGAN SİNEMA';
   lvItem.Data['Text3'] := '4,45';
   TListItemImage(lvItem.Objects.FindDrawable('Image2')).ImageIndex := 1;
   TListItemImage(lvItem.Objects.FindDrawable('Image4')).ImageIndex := 2;
 finally
   ListView1.EndUpdate;
 end;
end;

Önemli Not: Bu ve benzeri tüm konular Yeni Kaynak Kitabımızda detaylı anlatılmıştı. Kimse okumuyor galiba. 

[pro_imaj]

Cevaplar için teşekkürler,

Görsel bir şeyler yapmak biraz ufuk'la ilgili sanırım. ListView içerisine edit koyamıyorduk en son hatırladığım kadarıyla bu konuda bir gelişme varmı acaba. 

@"Fesih ARSLAN"  Haklısınız bu aralar kitaba bakamıyorum, telafi edeceğim. Araştırmadan okumadan olmuyor, olmadığıda görülüyor malesef.