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

TextEditingController

TextEditingController klassi TextField vidjetiga matn kiritishni boshqarish uchun mo‘ljallangan.
TextEditingController TextField va TextFormField sinflari uchun konstruktorning kontroller parametri yordamida o'rnatiladi.
Bu sinfda ikkita konstruktor mavjud:

1 2	TextEditingController({String text}) TextEditingController.fromValue(TextEditingValue value)

Birinchi konstruktor parametr sifatida boshlang'ich qiymatni oladi, keyin u tegishli matn maydonida ko'rsatiladi. Ikkinchi konstruktor dastlabki qiymatni ham qabul qiladi, lekin TextEditingValue obyekti sifatida
TextEditingController sizga kiritilgan va tanlangan matnni kiritish maydoniga boshqarish imkonini beradi, ular uchun uchta xususiyat aniqlangan:
tanlash: TextSelection obyekti sifatida tanlangan matn
matn: String obyekti sifatida joriy kiritilgan matn
qiymat: TextEditingValue obyekti sifatidagi joriy qiymat

Matn maydonidagi kiritish o'zgarganda, bog'langan TextEditingController ob'ekti tinglovchilarni o'zgarish haqida xabardor qiladi. Tinglovchilarni qo'shish uchun - qo'ng'iroqlarni boshqarish funktsiyalari sinfda addListener () usuli aniqlanadi. Barcha qo'shilgan tinglovchilar kiritilgan matnni, shuningdek tanlangan matnni o'qishlari va shu bilan sodir bo'lgan o'zgarishlar haqida bilib olishlari mumkin.

TextEditingController ob'ekti endi kerak bo'lmaganda, dispose () usulini chaqirish kerak. Bu ob'ekt tomonidan ishlatiladigan barcha resurslarni bo'shatadi.
Birinchidan, matn maydoni uchun boshlang'ich qiymatni o'rnatadigan TextEditingController yordamida asosiy dasturni aniqlaymiz:

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

import 'package:flutter/material.dart';   void main() {   runApp(MaterialApp(       home:  Scaffold(         body: Person(),         appBar: AppBar(title: Text("METANIT.COM")))   )); }   class Person extends StatefulWidget {     Person({ Key key}) : super(key: key);     @override   _PersonState createState() => _PersonState(); } class _PersonState extends State {     String _name = "Tom";   final _controller = TextEditingController();     @override   void initState() {     super.initState();     _controller.text = _name;   }   @override   void dispose() {     _controller.dispose();     super.dispose();   }   @override   Widget build(BuildContext context) {       return Column(children:[       Text("Имя пользователя: $_name", style: TextStyle(fontSize: 22)),       TextField(           style: TextStyle(fontSize: 22),           controller: _controller)     ],     crossAxisAlignment: CrossAxisAlignment.start);   } }

Shaxs vidjeti uchun bu holda holat _PersonState klassi shaklida aniqlanadi. _PersonState klassi holatni _name o'zgaruvchisi ko'rinishida saqlaydi - foydalanuvchining shartli nomi. Bundan tashqari, _PersonState TextEditingController obyektini ifodalovchi _controller konstantasini ham belgilaydi, uning yordamida biz _name o'zgaruvchisiga o'zgarishlarni kuzatamiz.
Odatiy bo'lib, _name o'zgaruvchisi allaqachon "Tom" ning boshlang'ich qiymatiga ega. Va bu qiymatni kontrollerga o'tkazish uchun biz State sinfining initState usulini bekor qilamiz. Ushbu usul Davlat ob'ektining holatini ishga tushirish uchun mo'ljallangan. Va bu holda, biz _name o'zgaruvchisining qiymatini TextEditingController obyektining matn xususiyatiga o'tkazamiz. Bu matn maydoniga dastlabki qiymatni beradi.

TextEditingController ob'ekti u bilan bog'liq barcha resurslarni chiqarishi uchun davlat sinfida biz dispose () usulini bekor qilamiz, bunda biz kontrollerning dispose () usulini chaqiramiz.

Keyin, TextField vidjetini yaratishda boshqaruvchini uning konstruktorida foydalanishga sozlang:

1	controller: _controller

Natijada, dastur ishga tushganda, matn maydoni dastlabki qiymatni oladi:

Endi matnni o'zgartirish jarayonini qo'shamiz:

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

import 'package:flutter/material.dart';   void main() {   runApp(MaterialApp(       home:  Scaffold(         body: Person(),         appBar: AppBar(title: Text("METANIT.COM")))   )); }   class Person extends StatefulWidget {     Person({ Key key}) : super(key: key);     @override   _PersonState createState() => _PersonState(); } class _PersonState extends State {     String _name = "Tom";   final _controller = TextEditingController();     _changeName(){     setState(() =>_name = _controller.text);   }     @override   void initState() {     super.initState();     _controller.text = _name;     _controller.addListener(_changeName);   }   @override   void dispose() {     _controller.dispose();     super.dispose();   }   @override   Widget build(BuildContext context) {       return Column(children:[       Text("Имя пользователя: $_name", style: TextStyle(fontSize: 22)),       TextField(           style: TextStyle(fontSize: 22),           controller: _controller)     ],     crossAxisAlignment: CrossAxisAlignment.start);   } }

Siz kiritganingizda, siz kiritgan barcha matn TextEditingController obyektining matn xususiyatida saqlanadi. Uni olish va _name o'zgaruvchisini o'zgartirish uchun _changeName usuli bu yerda aniqlanadi:

1 2 3

_changeName(){     setState(() =>_name = _controller.text); }

Ammo bu usulni qachon chaqirish kerak? Holatni ishga tushirish paytida o'zgarishlarni kuzatish uchun initState () usulida TextEditingControllerning addListener () usulini chaqiring va TextEditingController-dagi matn o'zgarganda bajariladigan funksiyani unga o'tkazing.

1	_controller.addListener(_changeName);

addListener () usuli hech qanday parametrlarni qabul qilmaydigan va hech narsani qaytarmaydigan funksiyani oladi - ya'ni bu holda u _changeName () usulining ta'rifiga mos keladi. Biroq, biz _changeName usulini aniq chaqirishimiz mumkin:

1 2 3

_controller.addListener((){       _changeName(); });

Natijada, matn maydonidagi matn o'zgarganda, Shaxs vidjetining holati ham o'zgaradi: