DEV Community

Cover image for Flutter Temel Bilgiler 💫 🌌 ✨
Gülsen Keskin
Gülsen Keskin

Posted on • Updated on

Flutter Temel Bilgiler 💫 🌌 ✨

Flutter'da her şey bir widget'tır ve widget'lar yalnızca görünümlerini nasıl tanımlayacağını bilen Dart sınıflarıdır.

Her widget öğesi bir build methodu içermelidir ve bu method bir widget öğesi döndürmelidir.

Widget'lar Flutter'da immutable(değişmez) olmalıdır, ancak state nesneleri immutable olmamalıdır.

Widget'ların çoğu durumda const constructor'ları vardır. Flutter'da widget'lar oluştururken new ve const anahtar sözcüklerini atlayabilirsiniz.

Bir StatefulWidget, ilişkili bir state nesnesi aracılığıyla kendi internal state'ini (dahili durumunu) izler. Bir StatelessWidget "aptaldır" ve Flutter onu widget ağacından kaldırdığında tamamen yok edilir.

setState, Flutter'a bazı stateleri güncellemesini ve ardından yeniden boyamasını (repaint) söylemek için kullanılır. Herhangi bir asenkron çalışma yapılmamalıdır.

State nesnesinin, widget öğesi ağaca monte edilir edilmez çağrılan initState adlı bir methodu vardır. State.initState methodu, Flutter ekranı boyamaya çalışmadan önce gereken tüm verileri başlattığınız methoddur. Flutter bir stateful widget ve onun state objesini oluşturduğunda, yapacağı ilk şey initState methodunu çağırmaktır.

initState, her state objesi oluşturulduğunda bir kez çağrılır. setState, Flutter'ın yeniden oluşturmasını(render) istediğiniz zaman, geliştirici olarak sizin tarafınızdan çağrılır.

BuildContext, bir widget öğesinin widget öğesi ağacındaki konumuna bir referanstır. Bu, widget'ınızın ağaçtaki yeri hakkında bilgi toplayabileceği anlamına gelir.

Flutter'da widget'lar, ilişkili RenderBox nesneleri tarafından oluşturulur. RenderBox'lar, widget'a gerçek, fiziksel boyutunu bildirmekten sorumludur. Bu nesneler, parent öğelerinden kısıtlamalar alır ve ardından bunları gerçek boyutlarını belirlemek için kullanır.

Flutter Row ve Column widget'ları, CSS'deki FlexBox'a çok benzeyen flex layout kavramını kullanır.

State nesneleri Widget'lardan farklı olarak widget'lar yeniden oluşturulduğunda yok edilmez ve yeniden oluşturulmazlar (re-render).

State nesneleri widget'lar tarafından değil, elementler tarafından yönetilir.

Tüm Dart uygulamaları, uygulama için bazı yapılandırmaları açıklayan bir pubspec.yaml dosyası gerektirir. Dart, uygulamanızı oluşturan bir derleme sistemine sahiptir ve uygulamanızı çalıştırdığınızda yaptığı ilk şey bir pubspec.yaml dosyası aramaktır.

Uygulamayı yatay veya dikey moda çevirmek gibi cihaz özelliklerini değiştirmek için SystemChrome sınıfını kullanın.

Ekran boyutu hakkında bilgi almak için MediaQuery'yi kullanın. Bu, widget'ları ekran boyutuna göre ölçeklendirerek boyutlandırmak istiyorsanız kullanışlıdır.(örn %80 gibi)

Uygulamanızdaki hemen hemen her widget'ı etkileyecek stil özelliklerini ayarlamak için Theme'yı kullanın.

Widgetları üst üste konumlandırmak için stack widget'ını kullanın.

ListView ve builder constructor, sonsuz öğeler içeren listeler oluşturmanın hızlı ve performanslı bir yolunu sunar.

Flutter'da kullanıcı etkileşimi iki tür widget aracılığıyla gerçekleştirilir: input ve gesture detector.

Flutter, GestureDetectorwidget'ı aracılığıyla hareketleri ve kullanıcı etkileşimi olaylarını yönetir.

Herhangi bir text field'a (metin alanına) programlı olarak odaklanmak istiyorsanız, bir FocusNodewidget kullanmanız ve bunun için focus talep etmeniz gerekir.

Bir gesture detector, çeşitli callback'ler aracılığıyla birçok hareketi dinleyebilir. Bunlar yaklaşık 30'dan sadece 5'idir:
onTap
onLongPress
onDoubleTap
onVerticalDragDown
onPanDown

Yerleşik widget'lar şu hareketleri de dinler: Dismissible, Button, FormFieldve daha fazlası.

Flutter formları, karmaşık formları yönetmeyi kolaylaştıran çeşitli input widget'larının etrafındaki kullanışlı sarmalayıcılardır.

Bir formun state'i, bir FormState nesnesine referans olan GlobalKey<FormState> ile yönetilebilir.

Form alanları birkaç yöntem sağlar: onChange, onSave, ve validator'dır. Bu yöntemler, kullanıcı eylemlerine yanıt vermek ve FormState'e bağlanmak için kullanılır.

Resource: Flutter in Action chapter: 3-4-5

Discussion (0)