Comment on page
Gelişmiş Kullanım
Bu sayfa, `AdvStory` widget'ının gelişmiş kullanım örneğini içerir.
AdvStory(
storyCount: 5,
storyBuilder: (index) async {
// Hikaye döndürün, hikaye ileriki bölümlerde açıklanacak.
},
trayBuilder: (index) {
// Herhangi bir widget döndürün. AdvStoryTray ön tanımlı
// özelleştirilebilir bir hikaye tepsisidir, bunu kullanabilir
// veya kendi animasyonlu/animasyonsuz hikaye tepsilerinizi
// oluşturabilirsiniz.
// Tepsi oluşturma ileriki bölümlerde açıklanacak.
},
controller: AdvStoryController(),
buildStoryOnTrayScroll: true,
preloadStory: true,
preloadContent: true,
style: const AdvStoryStyle(),
)
- storyCount: hikaye sayısı.
trayBuilder
vestoryBuilder
buint
değere göre çalıştırılır. - buildStoryOnTrayScroll: Hikayelerin dokunulduğunda veya tepsi listesi kaydırıldığında oluşturulmasını ayarlar.
true
olarak ayarlandığında hikaye ekranının açılmasını hızlandırır ancakstoryBuilder
fonksiyonun çalıştırılma sıklığını arttırır.storyBuilder
içerisinde sunucunuza istekler gönderiyorsanız,rate limit
için bunufalse
olarak ayarlamak isteyebilirsiniz. - preloadStory: hikaye önyüklemenin etkin olup olmamasını ayarlar.
true
olarak ayarlandığında 3 hikaye ve bu hikayelerin içeriklerinin bir bölümünü aynı anda hafızada tutar, aksi takdirde sadece bir hikayeyi hafızada tutar. İçeriklerinizin çoğu video ise ve performans problemleri görüyorusanız bunufalse
olarak ayarlayabilirsiniz. Ancak, bunu yapmadan önce video dosyalarının boyutlarını kontrol edin. - preloadContent: içerik ön yüklemenin etkin olup olmamasını ayarlar.
true
olarak ayarlandığında bir hikayeye ait 3 içeriği aynı anda hafızada tutar, aksi takdirde sadece bir içeriği hafızada tutar. Çoğu zaman bunufalse
olarak ayarlamanıza gerek yoktur. Bu, performansı ciddi şekilde azaltır. Yalnızca kaynaklarınız gerçekten çok büyük boyutlardaysa bunu devre dışı bırakmak isteyebilirsiniz.
Hikayeleri oluştururken çalıştırılan builder fonksiyonu,
Story
döndürür. Her hikaye için yalnızca bir defa çalışır, AdvStory
widget'ı hafızadan kaldırılana kadar hikayeleri tutar ve asenkron olabilir. Hikaye bir içerik grubudur ve
AdvStory
içerikleri contentBuilder
fonksiyonunu çalıştırarak oluşturur. İçerik, ön tanımlı içeriklerden biri olabilir veya kendi içeriklerinizi oluşturabilirsiniz.Ön tanımlı içerikler çoğu durumu kapsar, ancak
AdvStory
geliştiricilerin daha özel durumlar için kendi içeriklerini oluşturmasına izin verir. Geliştirici, herhangi bir şeyi hikaye içeriği olarak oluşturabilir. Örneğin, ses içeriği, birden fazla video içeren içerikler, fotoğraf ve videonun beraber olduğu içerikler, reklamlar...contentBuilder
'dan sadece içerik döndürmeyi ve başka bir işlem yapmamayı tercih edin. AdvStory hafıza kullanımını azaltmak için içerikleri saklamaz, sadece medya dosyalarını geçiçi belleğe kayıt eder ve bu fonksiyonu aynı içerik için birden fazla defa çalıştırabilir. Örneğin, içerik 4 görüntülenirken
AdvStory
2. içeriği hafızadan kaldırır ve eğer kullanıcı tekrar içerik 3'e giderse 2. içeriği oluşturmak için storyBuilder
tekrar çalıştırılır.Story({
required int contentCount,
required AdvStoryContent Function(int index) contentBuilder,
Widget? header,
Widget? footer,
})
- header: hikayenin üst bölümü. Bu varsayılan hikaye başlığıdır ve içerikler için özelleştirilebilir. Bu başlık
ImageContent
,VideoContent
veSimpleCustomContent
tiplerine uygulanabilir.AdvStory
StoryHeader
adında, bir satırda fotoğraf ve yazı görüntüleyen bir ön tanımlı başlığa sahiptir. - footer: hikaye alt bölümü. Bu varsayılan hikaye alt bölümüdür ve içerikler için özelleştirilebilir. Bu alt bölüm
ImageContent
,VideoContent
veSimpleCustomContent
tiplerine uygulanabilir.
AdvStory({
required Widget Function(int index) trayBuilder,
....
})
Hikaye tepsilerini oluşturmak için çalıştırılan
builder
fonksiyonu. AdvStory
'de iki tip tepsi vardır, animasyonlu ve animasyonsuz tepsiler. Animasyonlu ve animasyonsuz tepsiler arasındaki fark şudur,
trayBuilder
fonksiyonundan animasyonlu bir tepsi döndürüldüğünde AdvStory
animasyonu başlatır, hikayeyi ve içeriği göstermek için hazırlar ve hikaye görünümü açar. Bu, kullanıcıya açılan ilk ekranda bir yükleniyor ekranı gösterilmesini engeller. Animasyonsuz tepsilerde tepsiye dokunulduğunda hikaye görünümü hemen açılır ve AdvStory
hikaye ve içeriği hazırlanana kadar bir yükleniyor ekranı gösterir.Animasyonsuz tepsiler herhangi bir widget olabilir ancak animasyonlu tepsiler bazı kurallara sahiptir. Kendi animasyonlu tepsilerinizi oluşturmak için özel hikaye tepsileri oluşturma bölümüne bakın.
AdvStoryTray
son derece özelleştirilebilir bir animasyonlu hikaye tepsisidir, içerik hazırlanırken hoş bir kenarlık döndürme animasyonu gösterir. 
size
: Hikaye tepsisi boyutu.
borderGradient
: Kenarlığa uygulanan renk geçişi. Düz bir renk için aynı iki rengi kullanın.
shimmerStyle
: Fotoğraf yüklenirken gösterilen efekt stili.
shape
: Oval veya dörtgen tepsi oluşturmak için kısa yol.
strokeWidth
: kenarlık boyutunu ayarlar.
borderRadius
: kenarlığın eğimini ayarlar. Bu parametre ayrıca tepsi içerisinde gösterilen fotoğrafın şeklini de etkiler.gapSize
: Fotoğraf ve kenarlık arasındaki saydam alanın boyutunu ayarlar.AdvStory
geliştiricilerin en önemli bölümler için kendi widget'larını oluşturmasına izin verir ancak bazı widget'lar geliştirici tarafından oluşturulamaz, bu ayarlar bu widget'ları etkiler.- hideBars: hikaye görünümünün tam ekran olup olmamasını ayarlar. Varsayılan değer
true
, durum ve navigasyon çubuklarını gizler. Bunufalse
olarak ayarlamak medyanın beklenmedik şekilde boyutlanmasına sebep olabilir. - loadingScreen: özel yükeniyor ekranı. Bu, kendi, yükleniyor ekranınızı kullanmak istediğinizde yararlıdır.
AdvStory
varsayılan yükleniyor ekranıCircularProgressIndicator
benzeri bir widget'dır.
AdvStoryStyle(
indicatorStyle: const IndicatorStyle(),
trayListStyle: const TrayListStyle(),
loadingStyle: const LoadingStyle(),
loadingScreen: Widget? null,
hideBars: true,
),
Hikaye geri sayım göstergesi için seçenekler.

backgroundColor
: Boş gösterge rengi. Varsayılan renkColor(0xe6bdbdbd)
.valueColor
: Dolu gösterge rengi. Varsayılan renkbeyaz
.height
: Gösterge yüksekliğini ayarlar. Varsayılan değer2.5
.padding
: İlk/son hikaye tepsisi ve ekran kenarları arasındaki boşluk. Varsayılan değerEdgeInsets.symmetric(horizontal: 4, vertical: 8)
.spacing
: Göstergeler arasındaki boşluk miktarını ayarlar. Varsayılan değer3
.
Hikaye tepsisi seçenekleri.

padding
: Tepsi listesi ve üst widget arasındaki boşluk. Varsayılan değerEdgeInsets.symmetric(horizontal: 12.0)
.spacing
: Tepsiler arasındaki boşluk miktarı. Varsayılan değer12.0
.direction
: Hikaye tepsisi listesi yönü, tepsiler yan yana veya alt alta gösterilebilir. Dikey listeyi galeride görebilirsiniz. Varsayılan değerAxis.horizontal
.
AdvStoryTray
özelleştirme seçeneklerini örnek projeyi çalıştırarak deneyin veya kullanımı buradan inceleyin.Yükleniyor ekranı stilleri.
backgroundColor
: yükleniyor ekranı arka plan rengi (indicator değil!). Varsayılan değer aydınlık tema içinColor(0xFFFDFBF9)/mat beyaz
, karanlık tema içinColor(0xFF1B1B1B)/mat siyah.
gradientColors
: gösterge renkleri. Dönme efektini güzel göstermek için son renk yerineColors.transparent
kullanın. Varsayılan değer[Color(0xCC4b689c), Color(0x00000000)]
.colorStops
: renk geçiş durakları.fillDuration
: gösterge dönüşü tamamlanma süresi. Varsayılan değer3 saniye
.size
: gösterge boyutu. Varsayılan değer50
.strokeWidth
: gösterge kenar kalınlığı. Varsayılan değer7.0
.
Last modified 1yr ago