Flutter

bilgipedi.com.tr sitesinden
Flutter
Google-flutter-logo.svg
Orijinal yazar(lar) Google
Geliştirici(ler) Google ve topluluk
İlk yayınlanma Mayıs 2017
Güncel sürüm 3.0.0 / 11 Mayıs 2022
Platform Android, iOS, Google Fuchsia, Web, Windows, macOS ve Linux
Tür Yazılım Framework'ü
Resmî sitesi flutter.dev

Flutter, Google tarafından oluşturulan açık kaynaklı bir UI yazılım geliştirme kitidir. Android, iOS, Windows, Mac, Linux ve web için uygulamalar geliştirmek için kullanılıyor. Flutter'ın ilk sürümü "Sky" olarak biliniyordu ve Android işletim sisteminde çalışıyordu. Flutter ilk olarak 2015 Dart geliştirici zirvesinde tanıtıldı. Tanıtımında sabit bir şekilde saniyede 120 FPS çalışan uygulamalar geliştirilebileceği belirtildi. 4 Aralık 2018'de Flutter 1.0, Flutter Live etkinliğinde ilk "kararlı sürüm" olarak yayımlandı. 11 Aralık 2019'da Flutter Interactive etkinliğinde Flutter 1.12 yayımlandı.

6 Mayıs 2020'de, 2.8 sürümündeki Dart SDK ve 1.17.0 sürümündeki Flutter, Metal API'a desteğin eklendiği ve iOS cihazlarındaki (yaklaşık %50) ana widget'larındaki performansı büyük ölçüde artırdı. Ağ etkinlikleri izleme aracı ve çok daha fazlası eklendi.

İlk olarak 2015 yılında tanımlanan Flutter, Mayıs 2017'de piyasaya sürülmüştür.

Tarihçe

Flutter'ın ilk sürümü "Sky" olarak biliniyordu ve Android işletim sistemi üzerinde çalışıyordu. Saniyede 120 kare hızında tutarlı bir şekilde render edebilme hedefiyle 2015 Dart geliştirici zirvesinde tanıtıldı. Eylül 2018'de Şangay'da düzenlenen Google Geliştirici Günleri'nin açılış konuşmasında Google, Flutter 1.0'dan önceki son büyük sürüm olan Flutter Release Preview 2'yi duyurdu. Aynı yılın 4 Aralık'ında Flutter Live etkinliğinde, çerçevenin ilk kararlı sürümünü ifade eden Flutter 1.0 yayınlandı. 11 Aralık 2019'da Flutter 1.12, Flutter Interactive etkinliğinde yayınlandı.

6 Mayıs 2020'de, iOS cihazlarda performansı yaklaşık %50 artıran Metal API desteğinin yanı sıra yeni Material widget'ları ve ağ izleme geliştirme araçları ekleyen Dart yazılım geliştirme kiti (SDK) sürüm 2.8 ve Flutter 1.17.0 yayınlandı.

3 Mart 2021'de Google, çevrimiçi bir Flutter Engage etkinliği sırasında Flutter 2'yi yayınladı. Bu büyük güncelleme, yeni bir CanvasKit görüntüleyici ve web'e özel widget'larla web tabanlı uygulamalar için resmi destek, Windows, macOS ve Linux için erken erişim masaüstü uygulama desteği ve geliştirilmiş Uygulama Ekleme API'leri getirdi. Bu sürümde ayrıca, birçok harici pakette birçok kırılma değişikliğine ve soruna neden olan sağlam null güvenliği özelliğine sahip Dart 2.0 kullanıldı; ancak Flutter ekibi bu sorunları hafifletmek için talimatlar ve araçlar ekledi.

8 Eylül 2021'de Dart 2.14 ve Flutter 2.5 Google tarafından yayınlandı. Güncelleme, Android tam ekran modunda iyileştirmeler ve Google'ın Material You adlı Materyal Tasarımının en son sürümünü getirdi. Dart, tiftik koşullarını standartlaştıran ve Apple Silicon desteğini kararlı olarak işaretleyen iki yeni güncelleme aldı.

Flutter'ın mevcut kararlı kanalı 3.0.2 ve Dart sürümü 2.17.3'tür.

Çerçeve mimarisi

Flutter'ın başlıca bileşenleri şunlardır:

  • Dart platformu
  • Flutter motoru (Skia Grafik Motoru)
  • Vakıf kütüphanesi
  • Tasarıma özel widget'lar
  • Flutter Geliştirme Araçları (DevTools)

Dart platformu

Flutter uygulamaları Dart dilinde yazılır ve dilin daha gelişmiş özelliklerinin çoğundan yararlanır.

Bir uygulama yazarken ve hata ayıklarken Flutter, tam zamanında yürütme motoruna sahip olan Dart sanal makinesinde çalışır. Bu, hızlı derleme sürelerinin yanı sıra kaynak dosyalarda yapılan değişikliklerin çalışan bir uygulamaya enjekte edilebildiği "sıcak yeniden yükleme" sağlar. Flutter, çoğu durumda kaynak kodda yapılan değişikliklerin yeniden başlatma veya herhangi bir durum kaybı gerektirmeden çalışan uygulamaya anında yansıtıldığı durum bilgisi içeren sıcak yeniden yükleme desteğiyle bunu daha da genişletir.

Daha iyi performans için, Flutter uygulamalarının tüm platformlardaki sürümleri zamanın ilerisinde (AOT) derleme kullanır.

Flutter motoru

Flutter'ın temel olarak C++ dilinde yazılan motoru, Google'ın Skia grafik kütüphanesini kullanarak düşük seviyeli işleme desteği sağlar. Ayrıca, Android ve iOS tarafından sağlananlar gibi platforma özgü SDK'lar ile arayüz oluşturur. Flutter Motoru, Flutter uygulamalarını barındırmak için taşınabilir bir çalışma zamanıdır. Animasyon ve grafikler, dosya ve ağ I/O'su, erişilebilirlik desteği, eklenti mimarisi ve Dart çalışma zamanı ve derleme araç zinciri dahil olmak üzere Flutter'ın temel kütüphanelerini uygular. Çoğu geliştirici, Flutter ile reaktif bir çerçeve ve bir dizi platform, düzen ve temel widget'ı sağlayan Flutter Framework aracılığıyla etkileşime girer.

Vakıf kütüphanesi

Dart ile yazılan Foundation kütüphanesi, motorla iletişim kurmak için API'ler gibi Flutter kullanarak uygulamalar oluşturmak için kullanılan temel sınıfları ve işlevleri sağlar.

Tasarıma özel widget'lar

Flutter çerçevesi, belirli tasarım dillerine uygun iki widget seti içerir: Material Design widget'ları Google'ın aynı adlı tasarım dilini uygularken Cupertino widget'ları Apple'ın iOS İnsan arayüzü yönergelerini uygular.

IDE Desteği

Flutter, eklentiler aracılığıyla aşağıdaki IDE'ler ve editörler için resmi destek sağlar:

  • IntelliJ IDEA
  • Android Studio
  • Visual Studio Kodu
  • Emacs

Diğer IDE'ler topluluk destekli eklentilerle veya komut satırından Flutter araçları kullanılarak kullanılabilir.

Widget'lar

Flutter, tamamen işlevsel bir uygulama sunmak için çeşitli widget'lar kullanır. Bu araçlar Flutter'ın çerçeve mimarisini oluşturur. Flutter'ın Widget Kataloğu, çerçeve hakkında tam bir açıklama ve API sağlar.

Flutter'da Widget'ların Temelleri

Widget'lar genellikle üç temel türde tanımlanır: Stateful widget'lar, Stateless widget'lar ve Inherited widget'lar. Flutter çerçevesindeki merkezi sınıf hiyerarşisi olan üç temel widget türü, her Flutter uygulamasının yapımında kullanılır. Bir widget'ın tüm örnekleri değişmez olsa da, Stateful widget kullanıcı ve uygulama arasındaki etkileşime izin verir. SetState yöntemine erişim sağlayarak, durum ayrı durum nesnelerinde tutulabilir. Alternatif olarak, Stateless widget bir sabit gibi davranır ve görüntülenen herhangi bir şeyin değiştirilebilmesi için önce widget'ın yeniden oluşturulması gerekir. Devralınan widget, başka bir widget'ın Devralınan widget'ın durumuna abone olmasına izin vererek çalışır ve durumun çocuklarına aktarılmasını sağlar.

Merhaba Dünya Örneği

Flutter kullanılarak yazılmış bir "merhaba dünya" örneği:

import 'package:flutter/material.dart'; <span title="Kaynak: Türkçe Vikipedi, Bölüm &quot;Merhaba Dünya Örneği&quot;" class="plainlinks">[https://tr.wikipedia.org/wiki/Flutter#Merhaba_Dünya_Örneği <span style="color:#dddddd">ⓘ</span>]</span>

void main() => runApp(HelloWorldApp()); <span title="Kaynak: Türkçe Vikipedi, Bölüm &quot;Merhaba Dünya Örneği&quot;" class="plainlinks">[https://tr.wikipedia.org/wiki/Flutter#Merhaba_Dünya_Örneği <span style="color:#dddddd">ⓘ</span>]</span>

class HelloWorldApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    //Uygulama arayüzünde gösterilecek olan alan.
    // MaterialApp veya Scaffold açılabilir, yahut metot ile farklı bir yerden inşa edilebilir. <span title="Kaynak: Türkçe Vikipedi, Bölüm &quot;Merhaba Dünya Örneği&quot;" class="plainlinks">[https://tr.wikipedia.org/wiki/Flutter#Merhaba_Dünya_Örneği <span style="color:#dddddd">ⓘ</span>]</span>

    return MaterialApp(
      title: 'Merhaba Dünya Uygulaması',
      //title ile uygulamamızın ismi belirlenir (telefon ana ekranında görünecek olan isim). <span title="Kaynak: Türkçe Vikipedi, Bölüm &quot;Merhaba Dünya Örneği&quot;" class="plainlinks">[https://tr.wikipedia.org/wiki/Flutter#Merhaba_Dünya_Örneği <span style="color:#dddddd">ⓘ</span>]</span>

      home: Scaffold(
          //AppBar() isimli widget otomatik olarak uygulamanın en üstüne bir bar oluşturur.
        appBar: AppBar(
          title: Text('Merhaba'),
          // Uygulama barına "Merhaba" yazdırır
        ), <span title="Kaynak: Türkçe Vikipedi, Bölüm &quot;Merhaba Dünya Örneği&quot;" class="plainlinks">[https://tr.wikipedia.org/wiki/Flutter#Merhaba_Dünya_Örneği <span style="color:#dddddd">ⓘ</span>]</span>

        //Center isimli widget ile yazıyı sayfa ortasına yerleştiriyoruz.
        body: Center(
          child: Text('Merhaba Dünya'),
          // ekrana "Merhaba Dünya" yazdırır.
        ),
      ),
    );
  }
}

Yararlı Bağlantılar