Павел Грибов, Автор в ЖЗГ - Страница 39 из 292

Flutter: показ прелоадера при загрузке данных в виджете showDialog

13.02.2023 Павел Грибов Flutter

Задача: при отображении данных при помощи виджета showDialog, необходимо показывать «прелоадер» во время загрузки данных со стороннего ресурса.

Решение: для отображения прелоадера, используем пакет card_loader. Однако! дело осложняется тем, что виджет showDialog не имеет метода setState, соответственно у нас нет возможности изменить уже отображенные данные, после окончания загрузки.

Для обхода этого ограничения, оформим showDialog как полноценный StatefulWidget с получением в связи с этим стандартных плюшек в виде setState, а так-же возможность вызова своих процедур после окончания отображения виджета:

import 'package:flutter/material.dart';
import 'package:card_loading/card_loading.dart';
import 'dart:convert';

class MyMeDialogInfo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _MyMeDialogInfoState();
  }
}
class _MyMeDialogInfoState extends State<MyMeDialogInfo> {
  bool info_is_load=false;

  void RefreshMeDialogData(context){
    TRequests req=new TRequests();
    req.request("adfserfserf", {}), (List result){
      setState(() {
        //info_is_load=true;
      });
    }, (String error){
    });

  }

  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) => RefreshMeDialogData(context));  // эвент после того как страница отобразилась - обновим данные по пользователю
  }

  @override
  Widget build(BuildContext context) {
    return Align (
        alignment: Alignment.bottomCenter,
        child:
        Container(
            width: double.infinity,
            decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(32.0),
                    topRight: Radius.circular(32.0))),
            child:Column(
                mainAxisSize: MainAxisSize.min,
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  // заголовок окна
                  Padding(
                    padding: const EdgeInsets.all(16.0),
                    child: Material(
                        child: Text("Заголовок окна", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 14.0, color: Colors.black))),
                  ),
                  Container(
                    width: MediaQuery.of(context).size.width,
                    height: MediaQuery.of(context).size.height - 220,
                    decoration: BoxDecoration(),
                    child:
                    SingleChildScrollView(
                      child: Stack(
                        children: <Widget>[
                          Visibility(
                              visible: info_is_load,
                              child:
                              Padding(
                                padding: const EdgeInsets.all(16.0),
                                child: Material(
                                    child: Text("Тут перечисляем какую инфу загружаемую асинхронно", style: TextStyle(fontSize: 14.0, color: Colors.black))),
                              )
                          ),
                          Visibility(
                              visible: !info_is_load,
                              child:
                              Padding(
                                padding: const EdgeInsets.only(bottom: 20,left: 20,right: 20),
                                child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: const [
                                    CardLoading(
                                      height: 30,
                                      borderRadius: BorderRadius.all(Radius.circular(15)),
                                      width: 100,
                                      margin: EdgeInsets.only(bottom: 10),
                                    ),
                                    CardLoading(
                                      height: 100,
                                      borderRadius: BorderRadius.all(Radius.circular(15)),
                                      margin: EdgeInsets.only(bottom: 10),
                                    ),
                                    CardLoading(
                                      height: 30,
                                      width: 200,
                                      borderRadius: BorderRadius.all(Radius.circular(15)),
                                      margin: EdgeInsets.only(bottom: 10),
                                    ),
                                  ],
                                ),
                              )
                          )
                        ],
                      ),
                    ),
                  )
                ]
            )
        )
    );
  }
}

class TMeDialog {
  void MeDialogInfoDialog(BuildContext context,Map ezs){
    showDialog(
      context: context,
      builder: (BuildContext context) {
        return MyMeDialogInfo(ezs);
      },
    );
  }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

import 'package:flutter/material.dart';

import 'package:card_loading/card_loading.dart';

import 'dart:convert';

class MyMeDialogInfo extends StatefulWidget {

@override

State<StatefulWidget> createState() {

return _MyMeDialogInfoState();

}

class _MyMeDialogInfoState extends State<MyMeDialogInfo> {

bool info_is_load=false;

void RefreshMeDialogData(context){

TRequests req=new TRequests();

req.request("adfserfserf", {}), (List result){

setState(() {

//info_is_load=true;

});

}, (String error){

});

}

@override

void initState() {

super.initState();

WidgetsBinding.instance.addPostFrameCallback((_) => RefreshMeDialogData(context)); // эвент после того как страница отобразилась - обновим данные по пользователю

}

@override

Widget build(BuildContext context) {

return Align (

alignment: Alignment.bottomCenter,

child:

Container(

width: double.infinity,

decoration: BoxDecoration(

color: Colors.white,

borderRadius: BorderRadius.only(

topLeft: Radius.circular(32.0),

topRight: Radius.circular(32.0))),

child:Column(

mainAxisSize: MainAxisSize.min,

mainAxisAlignment: MainAxisAlignment.center,

children: <Widget>[

// заголовок окна

Padding(

padding: const EdgeInsets.all(16.0),

child: Material(

child: Text("Заголовок окна", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 14.0, color: Colors.black))),

Container(

width: MediaQuery.of(context).size.width,

height: MediaQuery.of(context).size.height - 220,

decoration: BoxDecoration(),

child:

SingleChildScrollView(

child: Stack(

children: <Widget>[

Visibility(

visible: info_is_load,

child:

Padding(

padding: const EdgeInsets.all(16.0),

child: Material(

child: Text("Тут перечисляем какую инфу загружаемую асинхронно", style: TextStyle(fontSize: 14.0, color: Colors.black))),

)

Visibility(

visible: !info_is_load,

child:

Padding(

padding: const EdgeInsets.only(bottom: 20,left: 20,right: 20),

child: Column(

crossAxisAlignment: CrossAxisAlignment.start,

children: const [

CardLoading(

height: 30,

borderRadius: BorderRadius.all(Radius.circular(15)),

width: 100,

margin: EdgeInsets.only(bottom: 10),

CardLoading(

height: 100,

borderRadius: BorderRadius.all(Radius.circular(15)),

margin: EdgeInsets.only(bottom: 10),

CardLoading(

height: 30,

width: 200,

borderRadius: BorderRadius.all(Radius.circular(15)),

margin: EdgeInsets.only(bottom: 10),

)

]

)

);

}

class TMeDialog {

void MeDialogInfoDialog(BuildContext context,Map ezs){

showDialog(

context: context,

builder: (BuildContext context) {

return MyMeDialogInfo(ezs);

);

}

Оставить комментарий flutter, preloader

nmp — ошибка проверки самоподписанного сертификата

13.02.2023 Павел Грибов WEB, Windows

При установке модуля через nmp, иногда возникает ошибка вида:

reason: self-signed certificate in certificate chain

1	reason: self-signed certificate in certificate chain

Причин возникновения её может быть множество. У меня например — из-за антивируса Касперского, который имеет свойство подпехивать свои сертификаты в промежуток трафика SSL. Что делать? Одним из решений может быть отключение у npm проверки подлинности SSL. Это конечно плохое решение, но в моём случае оказалось единственным вариантом

npm set strict-ssl false

1	npm set strict-ssl false

Оставить комментарий javascript, nmp, nodejs, self-signed certificate

Flutter: ошибка присвоения переменных Safe nulled

09.02.2023 Павел Грибов Flutter

С 3 версии Flatter, если вам нужна переменная которая может быть null, то это нужно объявить явно при помощи оператора ?:

double?latitude;

1	double?latitude;

Возникает смесь, переменными, которые объявлены традиционно вида:

double aaa=10.0;

1	double aaa=10.0;

И если далее в программе мы захотим присвоить значение одной переменной другой:

aaa=latitude;

1	aaa=latitude;

Мы получим ошибку вида:

dart A value of type 'double?' can't be assigned to a variable of type 'double' because 'double?' is nullable and 'double' isn't

1	dart A value of type 'double?' can't be assigned to a variable of type 'double' because 'double?' is nullable and 'double' isn't

Как избежать? Достаточно при присвоении использовать оператор ??, при помощи которого можно назначить значение «по умолчанию» для null:

aa=latitude??0;

1	aa=latitude??0;

Оставить комментарий nullable, ошибка преобразования типов

Flutter: обновление виджета одного класса из другого класса

09.02.2023 Павел Грибов Flutter

Задача: в одном из фоново работающих классов (WebSocket клиент) изменилось значение отображаемое в другом классе. Необходимо вызвать setState для изменившегося виджета

Решение: воспользуемся классом StreamController. По сути это «конвеер», в который можно что-то ложить и объявлять «слушателя», который будет что-то делать если в «конвеер» попадет какое-либо значение.

Объявим в глобальных переменных контроллер, «конвеера»:

library me_flutter.globals;
var sup_controller = new StreamController<String>.broadcast();

1 2	library me_flutter.globals; var sup_controller = new StreamController<String>.broadcast();

Далее в классе ИЗ которого нужно сообщить что что-то изменилось, ложим в «конвеер» данные:

globals.sup_controller.add("new_message");

1	globals.sup_controller.add("new_message");

А в классе, который должен отображать изменения, объявим «слушателя» в initState:

class Support extends StatefulWidget {
  @override
  _SupportState createState() => _SupportState();
}
class _SupportState extends State<Support> {
  StreamSubscription?subscription;
  @override
  void initState() {
    super.initState();
    print("-оформляем подписку..");
      subscription = globals.sup_controller.stream.listen((index) {
        print("чтото пришло!");
        setState(() {
          _scrollDown();
        });
      });
....

class Support extends StatefulWidget {

@override

_SupportState createState() => _SupportState();

}

class _SupportState extends State<Support> {

StreamSubscription?subscription;

@override

void initState() {

super.initState();

print("-оформляем подписку..");

subscription = globals.sup_controller.stream.listen((index) {

print("чтото пришло!");

setState(() {

_scrollDown();

});

....

Не забудем при выходе из класса, убить подписку:

  @override
  void dispose() {
    print("--отменил подписку..");
    subscription?.cancel();
    super.dispose();
  }

@override

void dispose() {

print("--отменил подписку..");

subscription?.cancel();

super.dispose();

}

Оставить комментарий flutter, StreamController, изменение состояния, подписка

Flutter: периодический таймер

03.02.2023 Павел Грибов Flutter

Во Flutter за таймеры отвечает класс Timer, а за периодический в частности Timer.periodic

Для примера использования, реализуем отчет переменной от 30 до 0:

import 'dart:async';
Timer?_timer; // ? говорит о том, что переменная в начале пути может быть null
int timercount=30;
bool timout_passed=false; //вышел таймаут разблокировки кнопки
...
_timer = Timer.periodic(Duration(seconds: 1), (Timer _) {
 if (timercount>0) {
    timercount = timercount - 1;
 };
 if (timercount==0) {
   timout_passed=true;
   _timer?.cancel();  // закончили отчёт
 }
});

import 'dart:async';

Timer?_timer; // ? говорит о том, что переменная в начале пути может быть null

int timercount=30;

bool timout_passed=false; //вышел таймаут разблокировки кнопки

...

_timer = Timer.periodic(Duration(seconds: 1), (Timer _) {

if (timercount>0) {

timercount = timercount - 1;

};

if (timercount==0) {

timout_passed=true;

_timer?.cancel(); // закончили отчёт

}

});

Оставить комментарий flutter, периодичесйкий таймер, таймер

« 1 … 37 38 39 40 41 … 292 »

Декабрь 2024
Пн	Вт	Ср	Чт	Пт	Сб	Вс
						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