AI写作智能体 自主规划任务,支持联网查询和网页读取,多模态高效创作各类分析报告、商业计划、营销方案、教学内容等。 广告
[TOC] ## 概述 RepaintBoundary 将其子树包裹起来,使其与父组件的绘制(paint)过程隔离,从而避免不必要的重绘,提高性能 **原理** - Flutter 在 UI 发生变更时,会从树的顶部开始重新 **build → layout → paint**。 如果你一个组件更新了,但它触发了整个页面重绘,那就很浪费。 - 而加上 `RepaintBoundary` 后,它相当于在 UI 树中打了个“边界”, 让这部分内容 **只在自己变化时才重绘,父组件变化不会影响它**,也不会它影响父级 **举例** 假设页面左边是一个不断变化的动画计时器,右边是一个图表: * 如果不加 `RepaintBoundary`,左边动画一动,整个页面都 `paint`。 * 如果右边图表加了 `RepaintBoundary`,它就不会跟着重绘,节省 CPU。 示例 Flutter 自身内部使用得非常多,比如: * `ListView` 中每个 item 都有 `RepaintBoundary` * `Image`、`TextField` 组件默认也带