Loading...
MaterialApp
MaterialApp
MaterialApp виджети материалдык дизайн стилинде графикалык интерфейсти түзүү үчүн иштелип чыккан. Материалдык дизайн интерфейсинен тышкары, бул виджет башка көптөгөн функцияларды берет, мисалы, навигацияны, тиркеменин ар кандай бөлүктөрүн ж.б. аныктоого мүмкүндүк берет. Ошондуктан, алгач MaterialApp колдонуунун кээ бир негизги пункттарын карап чыгабыз.
MaterialApp конструкторунда көптөгөн параметрлер бар, алардын ичинен үй параметрин бөлүп көрсөтүү керек .
Бул жөндөө жүктөлгөндө MaterialApp'та көрсөтүлө турган негизги виджетти аныктайт. Мисалы:
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
home: Container(
color: Colors.white,
padding: EdgeInsets.only(top:25),
child: Text("Flutter, MaterialApp",
style: TextStyle(fontSize: 22, color: Colors.black87),
textAlign: TextAlign.center,
textDirection: TextDirection.ltr),
), ), ); }
Scaffold
Home параметр үчүн каалаган виджет колдонулса да, чындыгында, эреже катары, Scaffold виджети бул мүмкүнчүлүктө колдонулат . Бул материалдык дизайн стилинде интерфейс түзүү үчүн колдонулган дагы бир виджет.
Scaffold классынын конструктору дагы бир нече параметрлерге ээ, алардын ичинен биринчи кезекте body параметрин айырмалоо керек ал Scaffold дун негизги мазмунун башка виджет түрүндө орнотот.
Мисалы:
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
home: Scaffold(
body: Container(
color: Colors.white,
padding: EdgeInsets.only(top:25),
child: Text("Flutter Scaffold ",
style: TextStyle(fontSize: 22, color: Colors.black87),
textDirection: TextDirection.ltr),
), ), ), ); }
Scaffold конструкторунун башка параметрлеринин ичинен appBar параметрин белгилей кетүү керек , ал жогорку тилкени аталышы жана мүмкүн болгон иконалар менен орнотот. Бул параметр AppBar объектисин маани катары алат .
AppBar колдонмого Материалдык Дизайн стилин берүү үчүн колдонулган дагы бир классты билдирет.
AppBar виджети ошондой эле бай функцияларды камсыз кылат. Ал эми азыр болсо, AppBar конструкторунун аталыш параметрин колдонуу менен орнотулган аталышка гана токтололу . Бул параметр өзүнүн мааниси катары Текст виджетін алат :
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
home: Scaffold(
body: Text("MaterialApp in Flutter",
style: TextStyle(fontSize: 22, color: Colors.black87),
textDirection: TextDirection.ltr),
appBar: AppBar(
title: const Text("METANIT.COM"),
), ), ),); }
Скриншоттон көрүнүп тургандай, бул учурда биз үстүнө эч кандай толтурууну орнотуунун кереги жок, Scaffold автоматтык түрдө негизги мазмунду AppBarдын астына жайгаштырат. Мындан тышкары, виджеттер кээ бир демейки түстөрдү камсыз кылат.
Ошол эле учурда, AppBarдагы аталыш жөн гана сап эмес, Текст виджети болгондуктан, биз ошого жараша стилдештирүүнү колдоно алабыз, мисалы, тексттин түсү ж.б.