5.FlutterWidgets.pdf

Flutter ile Uygulama Geliştirme Kursu | Android & IOS Flutter Widgets Kasım ADALAN Elektronik ve Haberleşme Mühendisi Android - IOS Developer and Trainer Eğitim İçeriği Text WebVi...

Flutter ile Uygulama Geliştirme Kursu | Android & IOS Flutter Widgets Kasım ADALAN Elektronik ve Haberleşme Mühendisi Android - IOS Developer and Trainer Eğitim İçeriği Text WebView Image Button ScrollView TimePicker TextField DatePicker Dropdown Button FloatinActionButton GestureDetector Switch Toggle Buttons CheckBox RadioButton ProgressBar Slider Kasım ADALAN 2  Text Metinsel ifadeleri kullanıcıya gösterdiğimiz görsel nesnedir. Button üzerindeki yazıda dahil. NOT : RaiseButton deprecated yerine ElevatedButton kullanılabilir. Kasım ADALAN 3 Text Özelleştirme Kasım ADALAN 4 Elevated Button Elevated Button Özelleştirme Text Button Text Button Özelleştirme Final Kod : Kasım ADALAN 11 ButtonÖzelleştirme Kasım ADALAN 12  TextField TextField ile uygulamaya kullanıcı veri girebilmektedir. TextField üzerine girilen veriyi TextEditingController sınıfından oluşturduğumuz nesne ile kontrol etmekteyiz. Bu nesne sayesinde girilen veriyi okuyabiliriz ve girilen veriyi değiştirebiliriz. Nesneyi Nesne oluşturma textfielda bağlama textfield içindeki veriyi okuma Kasım ADALAN 13 TextField Özelleştirme Kasım ADALAN 14  FloatingActionButton Normal bir button gibi kullanılabilir ama genelde scaffold içinde kullanılır ve ekrana duyarlı çalışır. Klavye açıldığında klavye ile yukarı çıkar. Altında liste varsa listeyi yukarı aşağı kaydırsakta sayfada sabit kalır. Kasım ADALAN 15  FloatingActionButton extended özelliği ile yazıda ekleyebiliriz. Kasım ADALAN 16  Switch Çift konumlu bir butondur. Kasım ADALAN 17  Toggle Buttons Button grubu oluşturabiliriz ve seçilince görsel durumu değişebilir. Buttonların seçilme durumlarını state özelliği olan liste ile kontrol ederiz. Kasım ADALAN 18  CheckBox Çoklu seçim yaparken kullanılan widgettır. Kasım ADALAN 19  RadioButton Kullanıcıyı tek bir seçime zorlamak istediğimizde kullanırız. Kasım ADALAN 20  ProgressBar Yükleme işlemi yaparken temsili olarak gösterdiğimiz widgettır. Kasım ADALAN 21  Slider Belirli değerler arasında kaydırma işlemi ile seçim yapmamızı sağlar. Kasım ADALAN 22 Webview Kasım ADALAN 23  Webview Uygulama içinde internet sitelerini göstermek için kullandığımız yapıdır. Kasım ADALAN 24  Kurulum webview_flutter: ^4.0.6 Kasım ADALAN 25  IOS Kurulum IOS için izni almalıyız. Bu işlem için ios projesi içindeki info.plist dosyasına izin eklemeliyiz. io.flutter.embedded_views_preview Kasım ADALAN 26 Android Kurulum Kasım ADALAN 27 28  Image Belirli bir kaynaktan alınan resimleri gösteren widgettır. Resimler lokalde veya internet üzerinde yer alabilir. Kasım ADALAN 29  Image.asset() : Lokalde yer alan resim Lokaldeki resime dosya yolu ve resim adıyla ulaşabiliriz. Kasım ADALAN 30 Projeye Resim Ekleme Kasım ADALAN 31  Resim Ekleme Resimler için dosya oluşturulur. Kasım ADALAN 32 Resim Ekleme Dosya içine resim eklenir. Eklenen resim pubspec.yaml dosyasına eklenir. Dart dosyası açılınca Sarı uyarı alanından Get dependencies seçilir. Kasım ADALAN 33  Resim Ekleme Eğer eklenecek çok resim varsa her resmin adını tek tek girmeye gerek yoktur. dosya isminden sonra / işareti koymak yeterlidir. Kasım ADALAN 34 Resim kullanımı Kasım ADALAN 35  Image.network() : İnternette yer alan resim İnternette yer alan resime http/https uzantısı ile erişebiliriz. Kasım ADALAN 36  FadeInImage.assetNetwork() Resim yüklenme sırasında placeholder koyabildiğimiz bir yapıdır. Placeholder için lokalde resim kullanmalıyız. Kasım ADALAN 37  ScrollView ScrollView, Sayfa içerisindeki içerik ekran boyutundan daha fazla yer kaplıyorsa aşağı ve yukarı sayfayı hareket ettirmemize yardım eder. Kasım ADALAN 38 Time Picker Kasım ADALAN 39 Date Picker Kasım ADALAN 40  DropDown Button Android üzerinde spinner olarak bilinen tıkladığımızda liste görebildiğimiz bir yapıdır. Kasım ADALAN 41 Kasım ADALAN 42 Kasım ADALAN 43  GestureDetector İstenilen widgeta tıklanılma , çift tıklama , uzun basma gibi özellikler verbiliriz. Kasım ADALAN 44 Sayı Tahmin Uygulaması Kasım ADALAN 45 Kasım ADALAN 46 Kasım ADALAN 47 Kasım ADALAN 48 Kasım ADALAN 49 Kasım ADALAN 50  Teşekkürler... kasım-adalan [email protected] kasimadalan