117、Flutter中的状态控制

最新推荐文章于 2024-04-06 08:30:52 发布

香港胖仔

最新推荐文章于 2024-04-06 08:30:52 发布

阅读量199

点赞数

分类专栏： Flutter

本文链接：https://blog.csdn.net/u012416045/article/details/103572812

版权

Flutter 专栏收录该内容

18 篇文章 6 订阅

订阅专栏

1、今天来讲一下Flutter中的状态控制

首先创建一个Stateful Widget这个节点是有状态的

import 'package:flutter/material.dart';
import 'package:todoey_flutter/widgets/tasks_list.dart';

class TaskTile extends StatefulWidget {
  @override
  _TaskTileState createState() => _TaskTileState();
}

2、创建一个调用和组装各种状态的节点 State<TaskTile>

class _TaskTileState extends State<TaskTile> {
  bool isChecked = false;

  void checkboxCallback(bool checkboxState) {
    setState(() {
      isChecked = checkboxState;
    });
  }

  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text(
        'This is a task.',
        style: TextStyle(
            decoration: isChecked ? TextDecoration.lineThrough : null),
      ),
      trailing: TaskCheckbox(
          checkboxState: isChecked, toggleCheckboxState: checkboxCallback),
    );
  }
}

3、最后创建一个只执行状态，的节点StatelessWidget

class TaskCheckbox extends StatelessWidget {
  final bool checkboxState;
  final Function toggleCheckboxState;

  TaskCheckbox({this.checkboxState, this.toggleCheckboxState});

  @override
  Widget build(BuildContext context) {
    return Checkbox(
      activeColor: Colors.lightBlueAccent,
      value: checkboxState,
      onChanged: toggleCheckboxState,
    );
  }
}

状态会由第二个节点传输到第三个节点里面去执行。