为什么Flutter的List的有状态对象无法正常工作

时间:2019-11-10 23:13:42

标签: list flutter dart widget stateful

我想简单地制作一个简单的Schulte Table游戏。我创建了OneNumber状态状态小部件,以通过GestureDetector的onPanStart更改其背景。它有效,但是当我创建列表编号= []时;并添加了元素并显示了数字[0]而不是直接放置OneNumber,它没有更改其背景,我认为onPanStart函数不起作用。为什么? 。你有什么建议?我想创建列表以改组数字。有我的代码

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class SchulteTable extends StatefulWidget {
  @override
  _SchulteTableState createState() => _SchulteTableState();
}

int current = 1;
Color textColor = Colors.white;
Color acceptedNumber = Colors.green;
Color rejectedNumber = Colors.red;
Color borderColor = Colors.white;
List<Color> buttonDefault = [];
List<OneNumber>numbers=[];

class _SchulteTableState extends State<SchulteTable> {
  @override
  Widget build(BuildContext context) {
    for(int i=0; i<25; i++) {
      buttonDefault.add(Colors.transparent);
    }
//    for(int i=0; i<25; i++){
//      numbers.add(
//        OneNumber(
//          number: i+1,
//          checkFunction: (DragStartDetails details) {
//            setState(() {
//              if (i+1 == current) {
//                buttonDefault[i] = acceptedNumber;
//                current++;
//              } else {
//                buttonDefault[i] = rejectedNumber;
//              }
//            });
//          },
//          backFunction: (DragEndDetails details) {
//            setState(() {
//              buttonDefault[i] = Colors.transparent;
//            });
//          },
//          buttonColor: buttonDefault[i],
//        ),
//      );
//    }
    return Scaffold(
      backgroundColor: Colors.lightBlue,
      appBar: AppBar(
        centerTitle: true,
        title: Text(
          'Schulte Table',
        ),
      ),
      body: Center(
        child: Column(
          children: <Widget>[
            Row(
              children: <Widget>[
                OneNumber(
                  number: 1,
                  checkFunction: (DragStartDetails details) {
                    setState(() {
                      if (1 == current) {
                        buttonDefault[0] = acceptedNumber;
                        current++;
                      } else {
                        buttonDefault[0] = rejectedNumber;
                      }
                    });
                  },
                  backFunction: (DragEndDetails details) {
                    setState(() {
                      buttonDefault[0] = Colors.transparent;
                    });
                  },
                  buttonColor: buttonDefault[0],
                ),
                OneNumber(
                  number: 2,
                  checkFunction: (DragStartDetails details) {
                    setState(() {
                      if (2 == current) {
                        buttonDefault[1] = acceptedNumber;
                        current++;
                      } else {
                        buttonDefault[1] = rejectedNumber;
                      }
                    });
                  },
                  backFunction: (DragEndDetails details) {
                    setState(() {
                      buttonDefault[1] = Colors.transparent;
                    });
                  },
                  buttonColor: buttonDefault[1],
                ),
                OneNumber(
                  number: 3,
                  checkFunction: (DragStartDetails details) {
                    setState(() {
                      if (3 == current) {
                        buttonDefault[2] = acceptedNumber;
                        current++;
                      } else {
                        buttonDefault[2] = rejectedNumber;
                      }
                    });
                  },
                  backFunction: (DragEndDetails details) {
                    setState(() {
                      buttonDefault[2] = Colors.transparent;
                    });
                  },
                  buttonColor: buttonDefault[2],
                ),

//                numbers[0],
//                numbers[1],
//                numbers[2],
              ],
            ),

          ],
        ),
      ),
    );
  }
}

class OneNumber extends StatefulWidget {
  final int number;
  final Function checkFunction;
  final Function backFunction;
  final Color buttonColor;

  OneNumber(
      {Key key,
      this.number,
      this.backFunction,
      this.buttonColor,
      this.checkFunction})
      : super(key: key);

  @override
  _OneNumberState createState() => _OneNumberState();
}

class _OneNumberState extends State<OneNumber> {
  @override
  Widget build(BuildContext context) {
    return Expanded(
      child: GestureDetector(
        onPanStart: widget.checkFunction,
        onPanEnd: widget.backFunction,
        child: Container(
          height: 70.0,
          decoration: BoxDecoration(
            color: widget.buttonColor,
            border: Border.all(
              color: borderColor,
              width: 0.4,
              style: BorderStyle.solid,
            ),
          ),
          child: Center(
            child: Text(
              (widget.number).toString(),
              style: TextStyle(
                fontSize: 20.0,
                color: textColor,
              ),
            ),
          ),
        ),
      ),
    );
  }
}

我注释了创建List并使用其元素的行。您可以不加注释地运行它,希望您能理解我的问题所在。您会提出什么解决方案?请帮我

0 个答案:

没有答案