flutter 将微件添加到列表不会在屏幕上更新

hujrc8aj  于 2023-03-03  发布在  Flutter
关注(0)|答案(3)|浏览(155)

你好,有人能给我解释一下吗,为什么当我按下按钮添加/删除一个新任务时(在第一个代码末尾的抬高按钮)屏幕没有更新?我需要点击热加载才能看到新任务,当我打印任务列表时,我看到了新任务
你好,有人能给我解释一下吗,为什么当我按下按钮添加/删除一个新任务时(在第一个代码末尾的抬高按钮)屏幕没有更新?我需要点击热加载才能看到新任务,当我打印任务列表时,我看到了新任务

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  List<Task> taskList = [
    Task(
        nome: "Aprender Flutter",
        imageSrc: "assets/images/fluttericon.png",
        diff: 5),
    Task(nome: "Meditar", imageSrc: "assets/images/ying.jpg", diff: 4),
    Task(nome: "Task 3", diff: 3),
  ];
  bool opacidade = true;

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text("Flutter App")),
        body: AnimatedOpacity(
          opacity: opacidade ? 1 : 0,
          duration: const Duration(milliseconds: 500),
          child: ListView(
            children: taskList,
          ),
        ),
        persistentFooterButtons: [
          ElevatedButton(
              onPressed: () {
                setState(() {
                  opacidade = !opacidade;
                });
              },
              child: opacidade
                  ? const Icon(Icons.remove_red_eye_outlined)
                  : const Icon(Icons.remove_red_eye)),
          ElevatedButton(
              onPressed: () {
                setState(() {
                  taskList.add(Task(nome: 'New Task', diff: 1));
                });
              },
              child: const Icon(Icons.add_task)),
          ElevatedButton(
              onPressed: () {
                setState(() {
                  int i = taskList.length - 1;
                  taskList.removeAt(i);
                  print(taskList);
                });
              },
              child: const Icon(Icons.delete_sharp))
        ],
      ),
    );
  }
}
class Task extends StatefulWidget {
  final String nome;
  final String? imageSrc;
  final int diff;

  const Task({Key? key, required this.nome, required this.diff, this.imageSrc})
      : super(key: key);

  @override
  State<Task> createState() => _TaskState();
}

class _TaskState extends State<Task> {
  int nivel = 0;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(6.0),
      child: Stack(
        children: [
          Container(
            height: 140,
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(5), color: Colors.blue),
          ),
          Column(
            children: [
              Container(
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(5),
                    color: Colors.grey.shade200),
                height: 100,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Container(
                      decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(5),
                          color: Colors.black),
                      width: 85,
                      height: 100,
                      child: ClipRRect(
                        borderRadius: BorderRadius.circular(5),
                        child: Image.asset(
                          widget.imageSrc ??
                              "assets/images/no.png",
                          fit: BoxFit.fill,
                        ),
                      ),
                    ),
                    Container(
                      width: 200,
                      alignment: Alignment.centerLeft,
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(widget.nome,
                              style: const TextStyle(
                                  fontSize: 25,
                                  overflow: TextOverflow.ellipsis)),
                          Difficulty(difficulty: widget.diff)
                        ],
                      ),
                    ),
                    Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: SizedBox(
                        height: 50,
                        width: 58,
                        child: ElevatedButton(
                            onPressed: () {
                              setState(() {
                                nivel++;

                                if (nivel >= (widget.diff * 10)) {
                                  nivel = (widget.diff * 10);
                                }
                              });
                            },
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.center,
                              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                              children: const [
                                Icon(Icons.keyboard_double_arrow_up),
                                Text(
                                  "Up",
                                  style: TextStyle(
                                      color: Colors.white, fontSize: 10),
                                )
                              ],
                            )),
                      ),
                    )
                  ],
                ),
              ),
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    SizedBox(
                        width: 200,
                        child: LinearProgressIndicator(
                          color: Colors.white,
                          value: (nivel / widget.diff) / 10,
                        )),
                    Text("Nível: $nivel",
                        style:
                            const TextStyle(color: Colors.white, fontSize: 15)),
                  ],
                ),
              )
            ],
          )
        ],
      ),
    );
  }
}
jdgnovmf

jdgnovmf1#

不使用:

ListView(children: taskList,)

尝试使用:

...taskList.map((task) {
              return task;
            }).toList()
klh5stk1

klh5stk12#

列表视图生成器应该可以解决您的问题。请将列表视图更改为该列表视图

ListView.builder(
  itemCount: taskList.length,
  itemBuilder: (context, index) {
    return taskList[index];
  }
)
nzkunb0c

nzkunb0c3#

使用列表视图生成器使它保持你的列表更新.使用索引删除特定项目.

ListView.builder(
  itemCount: yourList.length,
  itemBuilder: (context, index) {
    return yourList[index];
  }
)

并删除如下项目:

taskList.removeAt(index);

相关问题