Flutter入门学习(四)— Flutter基础

Flutter是一款移动应用程序SDK,一份代码可以同时生成iOS和Android两个高性能、高保真的应用程序。
Flutter目标是使开发人员能够交付在不同平台上都感觉自然流畅的高性能应用程序。我们兼容滚动行为、排版、图标等方面的差异。
无需移动开发经验即可开始使用。应用程序是用Dart语言编写的,如果您使用过Java或JavaScript之类的语言,则该应用程序看起来很熟悉。

Flutter默认demo

在这里插入图片描述

Flutter视图树

  • 创建widget树。调用runApp(rootWidget),将rootWidget传给rootElement,做为rootElement的子节点,生成Element树,由Element树生成Render树,Render树的根是一个RenderView。
  • Widget:存放渲染内容、视图布局信息,widget的属性最好都是immutable(如何更新数据呢?后续会讲到)。
  • Element:存放上下文,通过Element遍历视图树,Element同时持有Widget和RenderObject。
  • RenderObject:根据Widget的布局属性进行layout,对widget传入的内容进行渲染绘制。
    在这里插入图片描述
  • 树更新
    1. 全局更新:调用runApp(rootWidget),一般flutter启动时调用后不会再调用
    2. 局部子树更新:将子树作StatefulWidget的一个子Widget,并创建对应的State类实例,通过调用State.setState()触发子树的刷新

State

  • 可以手动调用其setState()方法通知Flutter framework状态发生改变,Flutter framework在收到消息后,会重新调用其build方法重新构建widget树,从而达到更新UI的目的。
  • Widget与State的关联不是永久的。UI树上的某一个节点的widget实例在重新构建时可能会变化,但State实例只会在第一次插入到树中时被创建,当在重新构建时,如果widget被修改了,Flutter framework会动态设置State.widget为新的widget实例。
  • BuildContext表示构建widget的上下文,它是操作widget在树中位置的一个句柄,它包含了一些查找、遍历当前Widget树的一些方法。每一个widget都有一个自己的context对象。

两个重要属性:

  • widget:表示与该State实例关联的widget实例
  • context:BuildContext的一个实例

StatelessWidget

flutter推荐尽量使用StatelessWidget。

  • StatelessWidget:无中间状态变化的widget,初始状态设置以后就不可再变化
  • StatelessWidget用于不需要维护组件状态的场景
  • createElement()创建StatelessElement对象
  • 一个StatelessWidget对应一个StatelessElement

StatefulWidget

当一个StatefulWidget同时插入到widget树的多个位置时,Flutter framework就会调用createState方法为每一个位置生成一个独立的State实例。

  • StatefulWidget:存在中间状态变化的widget
  • createElement()创建StatelfulElement对象
  • createState()创建State对象(可能调用多次)
  • 一个StatefulElement对应一个State实例

State生命周期

  • initState:当Widget第一次插入到Widget树时会被调用,对于每一个State对象,Flutter framework只会调用一次该回调,所以,通常在该回调中做一些一次性的操作,如状态初始化、订阅子树的事件通知等。
  • didChangeDependencies:initState后立刻调用,state依赖的对象发生变化时调用。
  • build:构建Widget时调用,调用后控件会显示。
  • Reassemble:此回调是专门为了开发调试而提供的,在热重载时会被调用,此回调在Release模式下永远不会被调用。
  • didUpdateWidget:组件状态改变时候调用,可能会调用多次。
  • deactive:当State对象从树中被移除时,会调用此回调。
  • dispose:当State对象从树中被永久移除时调用,通常在此回调中释放资源。
    在这里插入图片描述
发布了37 篇原创文章 · 获赞 35 · 访问量 9万+

猜你喜欢

转载自blog.csdn.net/jaynm/article/details/105286481