美文网首页flutteralready收藏
Flutter 优化:布局时尽量用 const

Flutter 优化:布局时尽量用 const

作者: 禄子_c79b | 来源:发表于2022-04-06 09:41 被阅读0次

    一、说明

    看到很多 Flutter 构建 UI 时会比较多用到 const,为什么不直接创建实例,而要在前端加一个 const 呢 ?

    child: const Text('加 const');
     
    VS
     
    child: Text('不加 const');
    

    二、尽量用 const 的理由

    当我们调用 setState() 后,Flutter 会调用 build 方法,并且 rebuild 其中的每一个组件,避免全部重新构建的方法就是用 const。
    如果一个组件更新频繁(比如动画),用 const 后可以减少垃圾回收。

    三、示例

    class _MyWidgetState extends State<MyWidget> {
      String title = "Title";
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text(title),
          ),
          body: Column(
            children: <Widget>[
              const Text("Text 1"),
              const Padding(
                padding: const EdgeInsets.all(8.0),
                child: const Text("Another Text widget"),
              ),
              const Text("Text 3"),
            ],
          ),
          floatingActionButton: FloatingActionButton(
            child: const Icon(Icons.add),
            onPressed: () {
              setState(() => title = 'New Title');
            },
          ),
        );
      }
    }
    

    当你点击 FloatingActionButton 调用 setState 后,所有 const 定义的组件都不会重新构建

    相关文章

      网友评论

        本文标题:Flutter 优化:布局时尽量用 const

        本文链接:https://www.haomeiwen.com/subject/hvztsrtx.html