Merhabalar artık bir proje dosyası ile ilgilenmenin vakti geldi. 20 ders boyunca bu ana en iyi şekilde gelebilmek için uğraştık.

Şimdi öncelikle bu dersler boyunca yazılacak olan kodlarımızın Github adresini sizlerle paylaşacağım.

https://github.com/MuratBilginerSoft/Flutter_Mobil_Tutorial

Buradan ulaşabilirsiniz.

Şimdi Android Studio’yu açıp bir flutter projesi oluşturalım. Bunun nasıl yapılacağını daha önceki derslerimizde ele almıştık.

Oluşan proje dosyası içinde lib klasörü içinde her ders her yazı için bir klasör oluşturacağım.

Dart eğitimlerimizden hatırlayacağınız üzere bir program çalışabilmesi için main fonksiyonunu bulması gerekiyordu. Flutter geliştirme yaparken de aynı durum geçerli.

O yüzden her dosyamızı test edebilmek için bir main.dart dosyası oluşturacağım.

Lib içinde bir klasör oluşturmak için aşağıdaki yolu izleriz.

Oluşturduğumuz klasör içinde bir main.dart dosyası oluşturuyoruz.

Şimdi bir flutter projesi oluşturuyorsak ilk işimiz main ana metodunu oluşturmaktır.


void main(){
  
}

Material App Nedir?

MaterialApp({ title, color, theme, initialRoute, routes, locale, localizationsDelegates, supportedLocales, onGenerateTitle, home,..}) 

Materialapp widget’ı uygulama ana kapsayıcı widgetıdır. MarialApp uygulamanın taban teması, sayfalama parametreleri, localizasyon parametreleri, sayfa içeriğini belirleyen adlandırılmış opsiyonel parametreler içerir.

O yüzden bir flutter projesi bunları yapmak istiyorsa mutlaka MaterialApp’i kullanmalıdır.

RunApp() Metodu

Bir flutter projesi main metodu çağırıldığında ilgili widgetların çalışıp ekrana görüntü gelebilmesi için RunApp() metodu kullanılır.

Bu metod olmadan ekrana bir görüntü aktaramayız.

Ana metodlarımızdan biridir.

İlgili tüm widgetlar RunApp( Buraya Yazılır ).

Import Yöntemi

Flutter geliştiricilerinin bize sunduğu widget paketlerini kullanmak için mutlaka onları ilgili kod dosyasında import etmemiz gerekir.

Import işlemi kod dosyasının en üstüne yapılır. Main metodunun üstüne.

Şimdi MaterialApp widget’ını kullanmak için bunu import edeceğiz.

import 'package:flutter/material.dart';

void main(){
  
}

Şimdi RunApp’i yazalım.

import 'package:flutter/material.dart';

void main(){
  runApp();
}

Şimdi Material App’i runApp’in içine yazıp birkaç özelliğine değer atayalım.

Ve sonrasında artık bu programı çalıştıralım.

import 'package:flutter/material.dart';

void main(){
  runApp(MaterialApp(
       title: "Brainy Tech",
       theme: ThemeData(accentColor: Colors.amber),
  ));
}

Artık bu projeyi çalıştırabiliriz.

Ben gerçek telefonumu bilgisayarıma bağladım. Vysor yardımıyla görüntülüyorum. Telefonumu debug işlemi için kullanacağım.

Debug işlemini yapmak için hangi dosyanın run edileceğini göstermemiz gerekir. O yüzden aşağıdaki işlemi yapmalıyız.

Böylece boş bir sayfayı ekranımıza getirebilmiş olduk.

Hemen küçük bir kod güncellemesi görelim.

Sayfanın sağ üst köşesinde Debug diye bir şerit var onu kaldıralım.

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    debugShowCheckedModeBanner: false,
    title: "Brainy Tech",
    theme: ThemeData(accentColor: Colors.amber),
    home: Scaffold(),
  ));
}
debugShowCheckedModeBanner: false,

Bu kod sayesinde false yaptığımızda banner kalkacaktır.

Programımızda kod değişimleri yaptığımzıda her defasında yeniden debug yapmak zorunda değiliz. Hot Restart yapabiliriz. Böylece sadece değişiklikler algılanacak ve yansıtılacaktır.

Banner gitti.

İşte bu kadardı boş bir uygulama yarattık. Yapıyı anlamaya çalıştık.

Bir sonraki yazımda görüşmek üzere.


What's Your Reaction?

hate hate
0
hate
fail fail
0
fail
fun fun
0
fun
geeky geeky
0
geeky
love love
0
love
lol lol
0
lol
omg omg
0
omg
win win
0
win
Murat Bilginer
21 Şubat 1992 Doğumlu. Endüstri Mühendisi olarak Lisansını 2016 yılında tamamlamıştır. Industryolog Akademi - NGenius oluşumlarının kurucusudur. Şu anda kendi şirketi Brainy Tech ile hem Yazılım Hizmetleri Sunmakta Hem de Online Eğitimler Vermektedir.