CircularProgressIndicator 只显示一次

Posted 2023-02-23

【中文标题】CircularProgressIndicator 只显示一次

【英文标题】：CircularProgressIndicator only shows one time

【发布时间】：2021-12-23 00:46:01

【问题描述】：

我希望每次用户单击登录按钮以显示 CircularProgressIndicator 而不是按钮，同时从 API 获取数据并在获取完成后，再次显示登录按钮或转到基于主页在获取的数据上。但它只显示第一次，下次点击它不显示，它只显示按钮！

这是我的代码：

import 'package:flutter/material.dart';
import 'package:news/src/blocs/latest_news_provider.dart';

import 'home_screen.dart';

class Chart extends StatefulWidget 
  @override
  _State createState() => _State();


class _State extends State<Chart> 
  TextEditingController nameController = TextEditingController();
  TextEditingController passwordController = TextEditingController();
  bool hasErr = false;
  late String errTxt;
  bool isButtonPressed = false;

  @override
  Widget build(BuildContext context) 
    final bloc = LatestNewsProvider.of(context);
    return Scaffold(
      appBar: AppBar(
        title: Text('Crypto'),
        backgroundColor: Colors.purple[700],
      ),
      body: StreamBuilder(
          stream: bloc.loginStream,
          builder: (BuildContext context, AsyncSnapshot snapshot) 
            if (snapshot.hasData) 
              isButtonPressed = false;
              WidgetsBinding.instance!.addPostFrameCallback((_) 
                Navigator.pushReplacement(
                    context, MaterialPageRoute(builder: (_) => HomeScreen()));
              );
             else if (snapshot.hasError) 
              isButtonPressed = false;
              hasErr = true;
              errTxt = snapshot.error.toString();
            
            return Padding(
                padding: EdgeInsets.all(10),
                child: ListView(
                  children: <Widget>[
                    Container(
                        alignment: Alignment.center,
                        padding: EdgeInsets.all(10),
                        child: Text(
                          'Nobitex',
                          style: TextStyle(
                              color: Colors.purple[700],
                              fontWeight: FontWeight.w500,
                              fontSize: 30),
                        )),
                    Container(
                      padding: EdgeInsets.all(10),
                      child: TextField(
                        controller: nameController,
                        decoration: InputDecoration(
                          border: OutlineInputBorder(),
                          labelText: 'Username',
                        ),
                      ),
                    ),
                    Container(
                      padding: EdgeInsets.fromLTRB(10, 10, 10, 0),
                      child: TextField(
                        obscureText: true,
                        controller: passwordController,
                        decoration: InputDecoration(
                          border: OutlineInputBorder(),
                          labelText: 'Password',
                        ),
                      ),
                    ),
                    SizedBox(
                      height: 10,
                    ),
                    isButtonPressed
                        ? Center(
                            child: CircularProgressIndicator(
                            color: Colors.purple[700],
                          ))
                        : Container(
                            height: 50,
                            padding: EdgeInsets.fromLTRB(10, 0, 10, 0),
                            child: ElevatedButton(
                              style: ElevatedButton.styleFrom(
                                  primary: Colors.purple[700]),
                              child: Text('Login'),
                              onPressed: () 
                                setState(() 
                                  isButtonPressed = true;
                                  hasErr = false;
                                );
                                bloc.login(nameController.text,
                                    passwordController.text);
                              ,
                            )),
                    hasErr == true
                        ? Container(
                            margin: EdgeInsets.only(top: 10),
                            child: Center(
                                child: Text(
                              errTxt.toString(),
                              style: TextStyle(
                                color: Colors.red,
                                fontWeight: FontWeight.bold,
                              ),
                            )))
                        : Container()
                  ],
                ));
          ),
    );
  

【参考方案1】：

如果您使用 bloc，那么您还应该有一个类来保存状态。当您单击按钮创建登录事件时，根据您的 api 响应更新 bloc 的状态。