Merhaba, uzun bir ara verdim sanırım. Bu arada pandemik olaylar, açılmalar kapanmalar. Bu zamanı doğru değerlendirmek için önce okumalar sonra ise bir eksik tarafımı tamamlama yönüne gittim. Mobil programlana tarafım hep eksikti. Biraz da web tarafım eksiktir. Web tarafında istediğimi yapabilsem de, mobil tarafta kalem oynatamazdım. Bir duvar vardı sanki aramızda. Yakın zamanda Flutter ile tanıştım. Flutter bir framework. Dart programlama dilini kullanarak IOS-Android-Masaüstü-WEB için program geliştirebiliyorsunuz. Aynı kod ile, evet yanlış okumadınız, aynı kod ile.
Ben çalışmalarımı yaparken Android Studio kullanıyorum. Gerekli eklentileri kurduktan sonra, yapılması gereken flutter sdk nın da kurulmasıdır.
Kısa bir çalışma sonunda birçok widget kullanabildiğimi farkettim, çabuk öğreniliyor. İç içe geçmiş, hiyerarşik bir düzende widget lar birbiri üzerinde/içinde duruyor.
Aşağıda bir diagram mevcut. Basit bir flutter uygulaması. Uygulamada layout için kullanılan Container var. Bu widget a Child olarak atanmış Row, Row a Children olarak atanmış olan 3 adet Column var. Sonuçta ekranda 3 adet Icon ve Text oluşuyor. Bunları kod yazarak yapmak durumundayız. Drag Drop bir yapı şu an yok. Keşke nodeRed benzeri, tut-bağla-özellikleri ayarla tarzı bir çalışma olsa. Belki ileride olur.
Yukarıdaki çizimin kodları yaklaşık aşağıdaki gibi oluyor.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 |
import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, visualDensity: VisualDensity.adaptivePlatformDensity, ), home: SafeArea( child: Container( child: Row( children: [ Column( children: [ Icon( Icons.phone_in_talk_sharp, color: Colors.green, size: 30.0, ), Container( child: Text( "Text1", style: TextStyle(fontSize: 6), )), ], ), Column( children: [ Icon( Icons.audiotrack, color: Colors.red, size: 30.0, ), Container( child: Text( "Text2", style: TextStyle(fontSize: 10), )), ], ), Column( children: [ Icon( Icons.fireplace, color: Colors.yellow[300], size: 30.0, ), Container( child: Text("Yakarsa Dünyayı Garipler Yakar", style: TextStyle(fontSize: 15, color: Colors.lime))), ], ), ], ), ), ), ); } } |
Çalışmanın “hızlandırılmış” videosu aşağıda. Neden hızlandırılmış, çünkü ben yavaşım şu anda.
