Flutter Dersleri: Dart Temellerinden Yayına Kadar
Dart dilinin temelleri, widget ağacı, layout, navigasyon, asenkron veri, state management ve animasyonlar. Her ders kısa bir açıklama, çalışan kod ve çoğunda tarayıcıda denenebilen canlı DartPad örneğiyle gelir. Sıfırdan başlıyorsanız yazıları aşağıdaki sırayla okuyabilirsiniz.
61 yazı
Dart Temelleri
- Dart'ta Tip Dönüşümleri ve Static DeğişkenlerFlutter öğrenmeye başlarken Dart'ın temellerini öğreniyorum. Bugün tip dönüşümleri ve static değişkenlerle ilgili öğrendiklerimi paylaşıyorum.
- Dart'ta Enum ve Composition - Kod Düzenini Nasıl Sağlarız?Dart öğrenmeye devam ediyorum. Bugün enum yapıları ve composition (birleştirme) konularını öğrendim. Gerçek hayat örnekleriyle anlatıyorum.
- Dart'ta Kalıtım (Inheritance) ve Polymorphism RehberiOOP'nin en önemli kavramlarından kalıtım ve polymorphism'i öğreniyorum. Extends, override ve super anahtar kelimeleriyle neler yapabileceğimize bakıyoruz.
- Dart'ta Interface ve Implements: Sınıflara Ekstra ÖzellikAbstract class'lar ve implements anahtar kelimesi ile sınıflarımıza nasıl ekstra özellikler ekleyebileceğimizi öğreniyorum.
- Dart Collections: List, HashSet ve HashMap ile Veri YönetimiDart'ta veri yapıları ile çalışmayı öğreniyorum. List, HashSet ve HashMap arasındaki farklar ve kullanım alanlarını keşfediyorum.
- Dart'ta Hata Yönetimi: Try-Catch ve Asenkron İşlemlerDart'ta try-catch ile hata yönetimini ve async-await ile asenkron programlamayı öğreniyorum. Future ve await kavramları.
Flutter’a Başlangıç
- Flutter ile Mobil Uygulama Geliştirmeye BaşlangıçFlutter'a sıfırdan başlangıç: kurulum, flutter doctor, ilk projeyi oluşturup çalıştırma, proje yapısı, hot reload ve sonrasında izlenecek öğrenme sırası.
- Flutter'a Giriş: Widget Ağacı, Row, Column ve Stack YapılarıDart'ı öğrendikten sonra nihayet Flutter'a geçiş yaptım. İlk günümde widget ağacını, Row, Column ve Stack yapılarını öğreniyorum.
- Flutter: Kendi Widget'larımızı OluşturmakFlutter'da özel widget yazmak: const constructor ve super.key, zorunlu ve opsiyonel parametreler, widget sınıfı mı yardımcı metod mu, sık yapılan hatalar.
- Flutter Yaşam Döngüsü (Life Cycle): StatefulWidget RehberiFlutter'da StatefulWidget yaşam döngüsü metodları ve uygulama yaşam döngüsü yönetimi. initState, dispose, didUpdateWidget ve setState kullanımı.
Layout ve Boyutlandırma
- Flutter: Center Widget Detaylı KullanımıCenter widget ile nesneleri ortalama ve farklı senaryolarda Center kullanımı.
- Flutter: Align Widget ile İnce Hizalama İşlemleriAlign widget ile içinde bulunduğu alana göre detaylı hizalama işlemleri ve Alignment özellikleri.
- Flutter: Padding ile İç Boşluk YönetimiPadding widget ile widget'ların etrafında iç boşluk oluşturma ve EdgeInsets kullanımı.
- Flutter: SizedBox ile Boyutlandırma ve BoşlukSizedBox widget'ı ile boyutlandırma işlemleri ve görünmeyen boşluklar oluşturma.
- Flutter: Expanded Widget ile Alan GenişletmeExpanded'ın derinlemesine incelemesi: flex oranı nasıl hesaplanır, iç içe kullanım, Row ve Column dışında neden çalışmaz ve en sık görülen üç hata.
- Flutter: Spacer Widget ile Esnek BoşluklarSpacer widget ile Row ve Column içinde esnek boşluk oluşturma ve dikkat edilmesi gerekenler.
- Flutter: Expanded, Flexible ve Spacer KarşılaştırmasıFlutter'da Expanded, Flexible ve Spacer farklarını öğrenin; layout hatalarını önleyin ve alan paylaşımını doğru yönetin.
- Flutter: Expanded, Flexible ve Spacer ile Layout KontrolüExpanded, Flexible ve Spacer'ı birlikte kullanan dört hazır tarif: araç çubuğu, kart alt satırı, form satırları ve responsive ikiye bölünmüş ekran.
- Flutter: mainAxisSize ile Alan KontrolümainAxisSize, Row ve Column'un ana eksende ne kadar yer kaplayacağını belirler. max ve min farkı, kısıtlarla ilişkisi ve sık yapılan hatalar.
- Flutter: mainAxisSize ile Row ve Column Alignment KontrolümainAxisAlignment.center yazdınız ama hiçbir şey değişmedi mi? mainAxisSize, mainAxisAlignment ve crossAxisAlignment'ın birlikte nasıl çalıştığını açıklıyorum.
- Flutter: mainAxisSize ile Kompakt Dialog ve Buton GruplarıDialog ekranı boydan boya mı kaplıyor? mainAxisSize.min ile dialog, bottom sheet ve buton gruplarını içeriğe sardıran hazır tarifler.
- Flutter: MediaQuery ile Ekrana Göre OranlamaMediaQuery.sizeOf, paddingOf ve textScalerOf ile ekrana göre boyutlama; ne zaman LayoutBuilder veya FractionallySizedBox daha doğru olur ve sık yapılan hatalar.
- Flutter: LayoutBuilder ile Ekran Boyutuna Göre TasarımLayoutBuilder widget'ı ile farklı ekran boyutlarına göre dinamik ve responsive tasarımlar oluşturma.
- Flutter: LayoutBuilder ile Responsive Breakpoint TasarımıLayoutBuilder ile mobile, tablet, desktop ve web için breakpoint tabanlı responsive Flutter arayüzleri oluşturun.
Temel Widget’lar ve Girdi
- Flutter: Resim Eklemek - Assets ve Image.assetFlutter projesine resim ekleme, pubspec.yaml yapılandırması ve Image.asset widget kullanımı.
- Flutter: Card Widget ve Tasarım KullanımıFlutter Card rehberi: Material 3 Card.filled ve Card.outlined, resimde clipBehavior, InkWell ile tıklanabilir kart, sık hatalar ve ürün kartı örneği.
- Flutter: Giriş Widget'ları ve Durum GöstergeleriSwitch, Checkbox, Radio, Slider ve SegmentedButton ne zaman kullanılır? ProgressIndicator türleri, sık yapılan hatalar ve örnek bir ayarlar ekranı.
- Flutter: Form Widget ve Girdi KontrolleriFlutter Form ve TextFormField ile doğrulama: validate() ile save() farkı, autovalidateMode, odak yönetimi, controller dispose ve giriş formu örneği.
- Flutter: DropdownButton Kullanımı ve ÖzellikleriFlutter DropdownButton ve DropdownButtonFormField kullanımı, Material 3 DropdownMenu, il-ilçe senaryosu ve value hatasının çözümü.
- Flutter: Tarih ve Saat Seçiciler (DatePicker & TimePicker)Flutter showDatePicker ve showTimePicker: tarih aralığı, Türkçe takvim, context.mounted, randevu senaryosu ve bir gün kayan tarih hatası.
- Flutter: GestureDetector Kullanımı ve Dokunma OlaylarıFlutter GestureDetector ile tıklama, sürükleme ve pinch olayları; InkWell farkı, HitTestBehavior, sık hatalar ve yakınlaştırılabilir fotoğraf örneği.
- Flutter: FloatingActionButton (FAB) Kullanımı ve ÖzellikleriFlutter FloatingActionButton: M3 boyutları, extended FAB, konumlandırma, kaydırırken gizleme, heroTag çakışması ve hatırlatıcı ekranı örneği.
Geri Bildirim ve Menüler
- Flutter: SnackBar ve SnackBarAction KullanımıFlutter SnackBar ve ScaffoldMessenger kullanımı: Geri Al aksiyonu, floating görünüm, kuyruk sorunu ve await sonrası context hataları.
- Flutter: AlertDialog Kullanımı ve ÖzelleştirmeFlutter AlertDialog ile onay alma, girdi toplama ve adaptive dialog; context.mounted, StatefulBuilder ve taşma hatalarının çözümü.
- Flutter: PopupMenuButton Kullanımı ve Menü YapılarıFlutter PopupMenuButton ile üç nokta menüsü: enum ile tip güvenliği, onSelected ve onTap farkı, liste satırı senaryosu ve sık hatalar.
Uygulama İskeleti ve Navigasyon
- Flutter: AppBar Widget ve ÖzelleştirmeFlutter AppBar rehberi: title, leading, actions ve bottom kullanımı, Material 3'te kaydırınca renk değişimi ve sık yapılan hataların çözümü.
- Flutter'da Navigator ile Sayfalar Arası Geçiş ve Veri TransferiFlutter'da Navigator kullanarak sayfalar arası geçiş yapmak, veri aktarımı ve back stack yönetimi. push, pop, pushReplacement metodları.
- Flutter: BottomNavigationBar KullanımıFlutter BottomNavigationBar: currentIndex ve state, IndexedStack ile sayfa durumu koruma, fixed/shifting farkı, kaybolan öğeler hatası ve sepet rozeti örneği.
- Flutter: BottomNavigationBar ve NavigationBar KarşılaştırmasıBottomNavigationBar'dan Material 3 NavigationBar'a geçiş: özellik eşleme tablosu, labelBehavior, NavigationBarThemeData, karar rehberi ve uyarlanabilir kabuk örneği.
- Flutter: TabBar ve TabBarView KullanımıFlutter TabBar ve TabBarView: DefaultTabController mı kendi TabController'ınız mı, sekme durumunu koruma, Material 3 ayarları ve sık yapılan hatalar.
- Flutter: Drawer Widget ve Yan Menü KullanımıFlutter Drawer ile yan menü: temel kurulum, Material 3 NavigationDrawer, menüyü kapatıp sayfaya geçme ve Scaffold.of context hatasının çözümü.
Listeler ve Kaydırma
- Flutter: SingleChildScrollView ve ScrollView KullanımıFlutter SingleChildScrollView rehberi: Column ile ne zaman doğru, klavye açılınca taşma hatası, Expanded unbounded height sorunu ve IntrinsicHeight çözümü.
- Flutter: ListView Widget KullanımıFlutter ListView rehberi: builder ile tembel listeleme, separated, itemExtent, shrinkWrap maliyeti ve unbounded height hatasının çözümü.
- Flutter: GridView Widget KullanımıFlutter GridView rehberi: count, extent ve builder kurucuları, iki grid delegate'in farkı, childAspectRatio taşma hatası ve shrinkWrap maliyeti.
- Flutter: SingleChildScrollView, ListView, NestedScrollViewFlutter'da scroll yapıları arasındaki farkları, performans etkilerini ve nested scroll sorunlarını doğru widget seçimiyle çözün.
- Flutter: SliverAppBar ile Sticky Header ve Search Bar TasarımıFlutter'da SliverAppBar kullanarak kaydırıldığında küçülen, pinlenen ve arama barı içeren modern başlık alanları oluşturun.
- Flutter: SliverAppBar ile Kategori Başlığı ve Arama AlanıSliverAppBar ile kategori seçimi, arama kutusu ve scroll ile kayan üst başlık yapıları oluşturun.
Asenkron Veri ve State Management
- Flutter: FutureBuilder ile Asenkron ListelemeFlutter FutureBuilder rehberi: snapshot durumlarını doğru okuma, Future'ı build içinde oluşturma hatası, initState çözümü ve setState ile yenileme.
- Flutter: StreamBuilder ile Gerçek Zamanlı Veri AkışıFlutter'da StreamBuilder kullanımı, Stream ve Future farkı, gerçek zamanlı veri akışları ve StreamController ile custom stream oluşturma.
- Flutter: Provider ile State ManagementFlutter'da Provider paketi ile state yönetimi, ChangeNotifier, Consumer, MultiProvider kullanımı ve best practices.
- Flutter: Riverpod ile Modern State ManagementFlutter'da Riverpod paketi ile state yönetimi, Provider vs Riverpod karşılaştırması, StateNotifier, StateProvider ve best practices.
Animasyonlar
- Flutter: Implicit Animations ile Sıfır Çaba, Maksimum EtkiAnimatedContainer, AnimatedOpacity, AnimatedPositioned ve diğer implicit animation widget'larıyla kod yazmadan animasyon ekleyin.
- Flutter Explicit Animations: AnimationController RehberiAnimationController, Tween, AnimatedBuilder ile Flutter'da profesyonel animasyonlar oluşturun. Explicit animations'ın tüm detaylarını öğrenin.
- Flutter Hero Animasyonları ve Sayfa Geçiş EfektleriHero animasyonları ve özel sayfa geçişleriyle Flutter uygulamanızı akıcı hale getirin. SlideTransition, FadeTransition, ScaleTransition.
- Flutter: Hero Animasyon Hızı ve Geçiş Süresi KontrolüFlutter'da Hero animasyon hızını, transition duration'ı ve curve ayarlarını kontrol ederek daha premium page transition deneyimi oluşturun.
- Flutter: Hero Animasyon Hataları ve En İyi UygulamalarFlutter Hero animasyonunda duplicate tag, material uyumsuzluğu ve geçiş kırılmalarını nasıl önleyeceğinizi öğrenin.
Yayın ve Gerçek Proje Notları
- Flutter'da Uygulama İkonu Oluşturma ve AyarlamaFlutter uygulamanıza hem Android hem iOS için farklı boyutlarda özel ikon nasıl eklenir? flutter_launcher_icons paketi ile otomatik ikon oluşturma.
- Flutter'da Kamerayı Kullanıcıya Bırakmak: Yön Zorlamadan Video ÇekmekFlutter camera paketinde önizlemenin ters dönmesi, kayıt başlarken donma ve bildirim merkezi açılınca kameranın kilitlenmesi. Recapday'i geliştirirken çözdüğüm üç somut hatayı ve yön zorlamadan çalışan kamera ekranının kodunu anlatıyorum.
- Firebase Auth + Kendi PHP Sunucun: Composer Olmadan Token Doğrulama ve Hesap SilmeKimlik Firebase'de, veri kendi sunucunuzda. Peki PHP tarafı gelen jetona nasıl güvenecek? Paylaşımlı hostingte composer olmadan RS256 doğrulaması ve mağazaların zorunlu tuttuğu hesap silme akışının tam kurulumu.
- ffmpeg ile Telefonda Video Birleştirme: Farklı Oranlardaki Klipleri Tek Vloga ÇevirmekKimi dikey kimi yatay, kimi video kimi fotoğraf. Recapday'de bu karışımı sunucu kullanmadan, telefonda tek bir 1920x1080 vloga çeviren ffmpeg zincirini adım adım anlatıyorum: bulanık dolgu, Türkçe karakterli yazı, müzik ve ölçülmüş sıkıştırma.
