Future Builder 沒有建造

Question

我正在嘗試包含FutureBuilder但它進入CircularProgressIndicator()並且在通過從 SharedPreferences 調用填充“時間”的值並且ConnectionState done后不加載實際屏幕代碼。 它只是卡在 CircularProgressIndicator() 中。

我在這里缺少什么？

Future<int> getTime() async {
  await MySharedPreferences.instance.getIntValue("time_key").then((value) =>
    setState(() {
     time= value;
}));
     return time;
        

      @override
 void initState() {
super.initState();

MySharedPreferences.instance
    .getStringValue("title_key")
    .then((value) => setState(() {
  title = value;
}));



controller =
    AnimationController(vsync: this,
        duration: Duration(
            seconds: time));
controller2 =
    AnimationController(vsync: this,
        duration: Duration(
            seconds: time));
controller3 =
    AnimationController(vsync: this,
        duration: Duration(
            seconds: 1));
    ....}
      
@override
Widget build(BuildContext context){

            return WillPopScope(

              onWillPop: () async => false,
              child: Scaffold(

                backgroundColor: Colors.black,
                body: FutureBuilder<int>
                  (
                  future: getTime(),
                builder: ( BuildContext context, AsyncSnapshot<int> snapshot) {
                  print(snapshot);
                  print(time);
                  if (snapshot.connectionState == ConnectionState.done) {
                    print(time);
                    return SafeArea(

                      minimum: const EdgeInsets.all(20.0),
                      child: Stack(
                        children: <Widget>[
                          Container(
                            child:
                            Align(
                              alignment: FractionalOffset.topCenter,
                              child: AspectRatio(
                                aspectRatio: 1.0,
                                child: Container(
                                  height: MediaQuery
                                      .of(context)
                                      .size
                                      .height / 2,
                                  width: MediaQuery
                                      .of(context)
                                      .size
                                      .height / 2,
                                  decoration: BoxDecoration(
                                    //shape: BoxShape.rectangle,
                                      color: Colors.black,
                                      image: DecorationImage(

                                        image: AssetImage(
                                            "assets/images/moon.png"),
                                        fit: BoxFit.fill,
                                      )
                                  ),
                                ),
                              ),
                            ),
                          ),
                          build_animation(),
                          

                        ],
                      ),
                    );
                  }


                  else {
                    return CircularProgressIndicator();
                  }
                }


                  ),
  ),
            );
        }


build_animation() {
  return AnimatedBuilder(
      animation: controller,
      builder: (context, child) {
        return Stack(
          children: <Widget>[
            Padding(
              padding: EdgeInsets.all(0.0),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  Expanded(
                    child: Align(
                      alignment: FractionalOffset.bottomCenter,
                      child: AspectRatio(
                        aspectRatio: 1.0,
                        child: Stack(
                          children: <Widget>[
                            Padding(
                              padding: EdgeInsets.only(top:MediaQuery.of(context).size.height / 6),
                              child: Column(
                                children: <Widget>[

                                  Text(
                                    title.toString(),
                                    style: TextStyle(
                                      fontSize: 20.0,
                                      color: Colors.black,fontWeight: FontWeight.bold,),
                                  ),
                                  new Container(
                                    child: new Center(
                                      child: new Countdown(
                                        animation: new StepTween(
                                          begin: time,
                                          end: 0,
                                        ).animate(controller),
         .....

Answer 1

對於初學者來說，你並不需要setState你用FutureBuilder使用未來的結果。 FutureBuilder 類的全部意義在於為您處理這個問題。 此外，最好不要混合使用.then()並await直到您有更多經驗。 它們可以很好地協同工作，但在您仍在學習時一次專注於一個概念。

這是您修剪后的方法（您的選擇是否仍然值得一個方法，或者如果您想將該代碼直接放入iniState ）：

 Future<int> getTime() async {
    final value = await MySharedPreferences.instance.getIntValue("time_key");
    return value;
 }

你不應該放棄這種方法你FutureBuilder，否則你將開始重新它每次build被稱為以任何理由。

所以你的initState應該是這樣的：

Future<int> futureIntFromPreferences;

@override
void initState() {
  super.initState();

  futureIntFromPreferences = getTime();
}

然后你可以在你的FutureBuilder使用它：

body: FutureBuilder<int>(
        future: futureIntFromPreferences,
        builder: (BuildContext context, AsyncSnapshot<int> snapshot) {

有關詳細說明，請閱讀什么是 Future 以及如何使用它？