美文网首页
Flutter UI布局方式

Flutter UI布局方式

作者: cheng1314 | 来源:发表于2020-09-02 09:30 被阅读0次

    Flutter采用声明式UI布局方式

    1. 为什么是声明式UI

    从win32到web再到Android和iOS的框架通常使用命名式UI编辑风格,手动构建UI实体,在需要变更时通过实体方法对其进行改变。为减轻开发人员在各种UI状态直接变更的编程负担,flutter让开发人员描述当前的UI状态,并且不需要关心它是如何过渡到框架的。

    1. 如何在声明性框架中更改布局

    在声明式UI,视图配置(如Flutter中的widget)是不可变的,并且只是轻量级的'蓝图',类似于iOS的UIView,Widget会在自身上触发重建(类似iOS中的drawreact),最常见的是通过Flutter中StatefulWidgets上调用setState(),并构建一个新的Widget树

    return View {
        color: red,
        child: ViewChild(...)
    }
    

    在这里,Flutter构建新的Widget实例,而不是改变旧实例。该框架使用RenderObjects管理传统对象的许多职责(例如维护布局状态)。RenderObjects在帧之间保持不变,Flutter的轻量级Widget告诉框架在状态之间改变RenderObjects,接下来Flutter框架会处理其他部分。

    相关文章

      网友评论

          本文标题:Flutter UI布局方式

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