Profil özet kartı gibi senaryolarda görsel, ad ve pozisyon bilgisini dikey sırayla üst üste hizalamak için kullanılır.
Vertical Stack elementi, kullanıcı arayüzü elementlerini dikey bir düzende üst üste hizalamak için kullanılan temel bir layout elementidir. İçindeki UI elementlerini tek bir kolon yapısında düzenleyerek içeriklerin daha okunabilir, düzenli ve hiyerarşik bir yapıda sunulmasını sağlar. Bu elementin kullanımını Profil Özet Kartı Oluşturma senaryosu üzerinden inceleyeceğiz.
Başlamak için Data Sources alanındaki Tables bölümünden ekrandaki tabloyu oluşturun. Ardından New SQL Action ile örnek verileri ekleyen aksiyonu oluşturun; tablo adının önüne "dbo." ekleyin, test edip kaydedin. Aynı adımları verileri sağlayan ve filtreleyen aksiyon için de tekrarlayın.
Sayfaya bir Row elementi sürükleyin, Desktop alanından tek sütun olarak ayarlayın ve Column'ı ortalayın. İçine bir Panel elementi yerleştirin; Styling Layout alanından genişlik ve yüksekliği ayarlayın, arka planı beyaz olarak seçin ve Border alanından Radius değerini 50 olarak belirleyin. Panel içine bir Vertical Stack elementi sürükleyin; içine bir Image elementi ekleyin ve Styling alanından genişlik ile yüksekliği ayarlayın. Image elementinin altına iki Label elementi sürükleyin.
Sayfaya Initial Action ile aksiyonu bağlayın. Ardından Image elementinin Value alanını ve her iki Label elementinin Value alanlarını sırasıyla tanımlayın.
Preview butonuna bastığınızda, Vertical Stack ile oluşturulan profil kartında kullanıcıya ait profil görseli, ad ve pozisyon bilgilerinin düzenli biçimde üst üste hizalandığını göreceksiniz. Bu yapı sayesinde kart içindeki tüm bilgiler sade, okunabilir ve estetik bir görünümle sunulur.