美文网首页
Flutter-Widget-State-Context-Inh

Flutter-Widget-State-Context-Inh

作者: NANAISNANA | 来源:发表于2019-04-12 18:31 被阅读0次

    读前须知:此篇文章基本上是Widget - State - Context - InheritedWidget的翻译并且删减了部分我个人觉得没有意义的文字,保留下来的部分也不会逐字逐句精确翻译,所以其实强烈推荐阅读英文原文。

    正文开始:

    Widget, State 和Context是每一个flutter开发者必须要完全理解的概念,但是具体来说要理解哪些知识呢?这篇文章会就以下几个知识点进行讲解:

    1: Stateful和Stateless widget的差别

    2:什么是Context

    3: 什么是State以及怎么使用

    4:一个context和他的state之间的关系

    5:InheritedWidget以及在在Widget树里面怎么传递信息

    6:rebuild的概念

    接下来文章会按照以下结构去展开:

    image

    flutter基础概念架构图(属本人做)

    一:基本概念

    1:什么是Widget

    Widget即组件。在flutter里面几乎万物都是Widget,跟我们常说的component是同一个概念。

    2: 什么是Widget tree

    Widget按照树形结构组合的产物就是Widget tree。这个Widget tree的每个节点上又是一个Widget。包含其他组件的组件叫做父组件,被其他组件包含的组件叫做子组件。比如下面一段代码:
    "
    @override
    Widget build(BuildContext){
    return new Scaffold(
    appBar: new AppBar(
    title: new Text(widget.title),
    ),
    body: new Center(
    child: new Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
    new Text(
    'You have pushed the button this many times:',
    ),
    new Text(
    '$_counter',
    style: Theme.of(context).textTheme.display1,
    ),
    ],
    ),
    ),
    floatingActionButton: new FloatingActionButton(
    onPressed: _incrementCounter,
    tooltip: 'Increment',
    child: new Icon(Icons.add),
    ),
    );
    }
    "

    3:什么是Context

    4:Widget的分类

    Stateless Widget

    Stateful Widget

    5: 什么是State

    6:State和Context之间的关系

    7:StatefulWidget的生命周期(lifecycle)

    initState()

    didChangeDependencies()

    build()

    dispose()

    8: StatelessWidget和StatefulWidget之间的抉择

    9:StatefulWidget的2个组成部分

    10:Widget的唯一标识-key

    二:如何获取State

    1:获取组件本身的State

    2:获取之间子组件的State

    3:获取祖先组件的State

    祖先组件需要暴露自己的State

    祖先组件的Widget State需要暴露一些getters/setters

    子组件本身要获取祖先组件的State的reference

    4:InheritedWidget

    什么是InheritedWidget

    子组件如果获取InheritedWidget的数据

    组件之间如何交互

    1:示例代码

    **2:代码执行逻辑讲解 **

    注册一个组件等候通知

    时间流

    3:如何在保证部分组件能获取InheritedWidget数据的情况下不重新build

    相关文章

      网友评论

          本文标题:Flutter-Widget-State-Context-Inh

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