Flutter – Erdoğan Bavaş

Flutter’da CustomPaint Widget ve Curve

Javascript üzerinde canvas kullanarak pek çok yaratıcı işler yapılıyor. Flutter’da da benzer karmaşık animasyonları ve çizimleri yapabileceğimiz sınıf ve metotlarımız var. Aynı isimli Canvas sınıfı Flutter’da da var fakat bunu direkt olarak kullanmayacağız bunun yerine CustomWidget widget’ını kullanacağız. CustomPaint’in 5 parametresi var, aşağıda açıklamaya çalıştım.

const CustomPaint({
  Key key,
  this.painter, // CustomPainter nesnesi
  this.foregroundPainter, // CustomPainter nesnesi, child widgetından sonra çizmeye başlar
  this.size = Size.zero, // child widget'ı yoksa boyut girebiliriz
  this.isComplex = false, // true ise sürekli çizim yapmaz, önbellek kullanır
  this.willChange = false, // tekrar çizim olması için true olmalı
  Widget child, // child widget
}) : assert(size != null),
     assert(isComplex != null),
     assert(willChange != null),
     super(key: key, child: child);

const CustomPaint({

Key key,

this.painter, // CustomPainter nesnesi

this.foregroundPainter, // CustomPainter nesnesi, child widgetından sonra çizmeye başlar

this.size = Size.zero, // child widget'ı yoksa boyut girebiliriz

this.isComplex = false, // true ise sürekli çizim yapmaz, önbellek kullanır

this.willChange = false, // tekrar çizim olması için true olmalı

Widget child, // child widget

}) : assert(size != null),

assert(isComplex != null),

assert(willChange != null),

super(key: key, child: child);

Buradaki painter parametresi için kullanacağımız CustomPainter’a genişletilmiş bir sınıfımız olmalı. … Okumaya devam et Flutter’da CustomPaint Widget ve Curve

Flutter’da Fizik Bazlı Animasyonlar (Physics-based animation)

Bir önceki yazıda Tween ile bir değeri değiştirerek bunu widget içinde kullanıp bir animasyon oluşturmaya çalışmıştık. Şimdi diğer bir animasyon türü olan fizik bazlı animasyonları tanıyalım. Gerçek dünya hareketlerini taklit etmeye yaran animasyon sınıfları bu gruba dahil ediliyor. Yer çekimi ya da bir yayın salınımı algısını vermeye çalıştığınızda bunların uğraştırıcı matematik hesaplarını kodumuza ekleyip karıştırmadan … Okumaya devam et Flutter’da Fizik Bazlı Animasyonlar (Physics-based animation)

Flutter’da Tween Animasyonları

Başarılı bir mobil uygulama için animasyon kullanmanın kaçınılmaz olduğunu düşünüyorum. Çok basit bir renk değişimi ya da button hareketi tüm UX ve UI algısını yukarı çekebiliyor. Flutter’ın en büyük sözlerinden biri 60 FPS animasyonlar oluşturabileceğimizdi. 60 fps sözünü başka bir yazıda test edeceğim şimdi basit birkaç animasyon örneği yapalım. Flutter temel olarak animasyonları ikiye ayırıyor. … Okumaya devam et Flutter’da Tween Animasyonları