Flutter ramka uchun qo'llanma 1-bob. Flutterga kirish Flutter nima. O'rnatish

Padding

Padding vidjeti ichki oʻrnatilgan element uchun toʻldirishni oʻrnatish imkonini beradi.
U quyidagi konstruktordan foydalanadi:

1	Padding({Key key, @required EdgeInsetsGeometry padding, Widget child})

Konstruktorda to'ldirishni o'rnatish uchun kerakli parametr bo'lgan to'ldirish parametri ishlatiladi. U EdgeInsetsGeometry sinfini ifodalaydi. Chekishni o'rnatish uchun biz ushbu sinf konstruktorlaridan birini ishlatishimiz mumkin:
EdgeInsets.all (ikki marta qiymat): to'rtta to'ldirish uchun bitta qo'sh qiymatni o'rnatadi (chap, yuqori, o'ng va pastki)
EdgeInsets.fromLTRB (ikkita chap, ikki qavatli yuqori, ikki o'ng, ikkita pastki): to'rt tomonning har biri uchun chekinish qiymatini o'rnatadi
EdgeInsets.fromWindowPadding (WindowPadding padding, double devicePixelRatio): to'ldirish parametriga mos keladigan bo'sh joyni belgilaydi
EdgeInsets.only ({ikki marta chap: 0,0, ikkita yuqori: 0,0, ikki tomonlama o'ng: 0,0, ikkita pastki: 0,0}): to'rt tomonning har biri uchun nolga teng bo'lmagan to'ldirish qiymatlarini o'rnatadi
EdgeInsets.symmetric ({ikki marta vertikal: 0,0, ikkita gorizontal: 0,0}): vertikal yuqori va pastki to'ldirishni, gorizontal esa chap va o'ngni o'rnatadi.

Keling, avval chiziq qo'yilmagan misolni ko'rib chiqaylik:

1 2 3 4 5 6 7 8 9 10 11 12

import 'package:flutter/material.dart';   void main() {   runApp(Align(       alignment: Alignment.topCenter,       child: Text(         'Hello Flutter from metanit.com',           textDirection: TextDirection.ltr       )     )   ); }

Ko'rib turganingizdek, ilova butun ekranni, jumladan, smartfonning yuqori panelini egallaydi, bu erda turli ko'rsatkichlar va joriy vaqt joylashgan.

Smartfonning yuqori panelidan ilovadagi testni olib tashlash uchun biz chekinishni qo'llaymiz:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

import 'package:flutter/material.dart';   void main() {   runApp(Padding(      padding: EdgeInsets.all(40),       child: Align(       alignment: Alignment.topCenter,       child: Text(         'Hello Flutter from metanit.com',           textDirection: TextDirection.ltr         )       )     )   ); }

Bunday holda, Align konteyneri matn bilan boshqa konteynerga - Paddingga joylashtiriladi. To'ldirish to'rtta to'ldirish uchun bir xil qiymatni o'rnatadi - 40 birlik. Natijada, ilovadagi matn yuqori holat satridan 40 birlik pastga siljiydi:

Boshqa EdgeInsets konstruktorlaridan foydalanib, turli tomonlar uchun to'ldirishni o'rnatish mumkin. Masalan:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

import 'package:flutter/material.dart';   void main() {   runApp(Padding(      padding: EdgeInsets.only(top: 40, bottom:10, left:10, right:10),       child: Align(       alignment: Alignment.topCenter,       child: Text(         'Hello Flutter from metanit.com',           textDirection: TextDirection.ltr         )       )     )   ); }