StatefulWidget和StatelessWidget

  • StatefulWidget : 具有可变状态的窗口部件,也就是你在使用应用的时候就可以随时变化,比如我们常见的进度条,随着进度不断变化。
  • StatelessWidget:不可变状态窗口部件,也就是你在使用时不可以改变,比如固定的文字(写上后就在那里了,死也不会变了)。

lutter中一切皆widget,这和RN中一切皆组件的思想很类似,因此在学习Flutter中,我们必须首先来了解Flutter的widget.下面先从最基本的MaterialApp和Scaffold开始了解

1 MaterialApp
一个封装了很多Android MD设计所必须要的组件的小部件,一般作为顶层widget使用。

继承关系
Inheritance
Object->Diagnosticable ->DiagnosticableTree ->Widget ->StatefulWidget ->MaterialApp

一般与以下widget一起使用
Scaffold: Material Design布局结构的基本实现。此类提供了用于显示drawer、snackbar和底部sheet的API。
Navigator,用于管理应用程序的页面堆栈。
MaterialPageRoute,它定义以特定于材料的方式转换的应用页面。
WidgetsApp,它定义基本的app元素但不依赖于材质库。

一般来说,在Flutter中,我们如果遵循MD设计时,顶层的Widget一般是MaterialApp,这里面我们可以指定主题样式,以便应用与APP整个页面中

2 Scaffold
Material Design布局结构的基本实现。此类提供了用于显示drawer、snackbar和底部sheet的API。
简单来说,Scanold就是一个提供MD设计中基本布局的widget,包括最上面的appBar,body,以及下部的drawer,snackbar等

继承关系
Object –>Diagnosticable ->DiagnosticableTree ->Widget ->StatefulWidget ->Scaffold

常用元素
appBar 标题栏
backgroundColor 背景色
body 内容区

Flutter学习简记的更多相关文章

  1. Flutter 学习资料

    Flutter 学习资料: 学习资料 网址 Flutter 中文网 https://flutterchina.club/ <Flutter实战>电子书 https://book.flutt ...

  2. Flutter学习笔记与整合

    1.Dart 面向对象语言,与java类比学习 非常适合移动和Web应用程序 1.dart官网 2.Dark2 中文文档 3.Dart语法学习 4.极客学院Dart学习 5.Flutter与Dart ...

  3. Flutter学习指南:UI布局和控件

    Flutter学习指南:UI布局和控件 - IT程序猿  https://www.itcodemonkey.com/article/11041.html

  4. Flutter学习笔记(3)--Dart变量与基本数据类型

    一.变量 在Dart里面,变量的声明使用var.Object或Dynamic关键字,如下所示: var name = ‘张三’: 在Dart语言里一切皆为对象,所以如果没有将变量初始化,那么它的默认值 ...

  5. Flutter学习笔记(4)--Dart函数

    如需转载,请注明出处:Flutter学习笔记(4)--Dart函数 Dart是一个面向对象的语言,所以函数也是对象,函数属于Function对象,函数可以像参数一样传递给其他函数,这样便于做回调处理: ...

  6. Flutter学习笔记(5)--Dart运算符

    如需转载,请注明出处:Flutter学习笔记(5)--Dart运算符 先给出一个Dart运算符表,接下来在逐个解释和使用.如下:                            描述       ...

  7. Flutter学习笔记(6)--Dart异常处理

    如需转载,请注明出处:Flutter学习笔记(6)--Dart异常处理 异常是表示发生了意外的错误,如果没有捕获异常,引发异常的隔离程序将被挂起,并且程序将被终止: Dart代码可以抛出并捕获异常,但 ...

  8. Flutter学习笔记(8)--Dart面向对象

    如需转载,请注明出处:Flutter学习笔记(7)--Dart异常处理 Dart作为高级语言,支持面向对象的很多特性,并且支持基于mixin的继承方式,基于mixin的继承方式是指:一个类可以继承自多 ...

  9. Flutter学习笔记(9)--组件Widget

    如需转载,请注明出处:Flutter学习笔记(9)--组件Widget 在Flutter中,所有的显示都是Widget,Widget是一切的基础,我们可以通过修改数据,再用setState设置数据(调 ...

随机推荐

  1. ::-webkit-scrollbar & hidden scrollbar

    ::-webkit-scrollbar & hidden scrollbar how to hidden ::-webkit-scrollbar *::-webkit-scrollbar { ...

  2. 知乎 bug

    知乎 bug shit zhihu https://zhuanlan.zhihu.com/p/111809590 无法展开评论 https://unpkg.zhimg.com/@cfe/sentry- ...

  3. website i18n and L10n all in one

    website i18n and L10n all in one Localization & Internationalization 本地化 & 国际化 https://www.w ...

  4. classnames & React & taro

    classnames & React & taro classnames https://www.npmjs.com/package/classnames demo https://g ...

  5. image to cur (cursor icons)

    image to cur (cursor icons) mouse-cursor-pointer https://onlineconvertfree.com/convert-format/jpg-to ...

  6. Nestjs 验证对象数组

    route @Patch(':id') patch(@Param('id') id: string, @Body() removeEssayDto: RemoveEssayDto) { return ...

  7. js字典

    传送门https://www.2cto.com/kf/201709/680989.html 点击

  8. 没想到即将上线的NGK生态应用这么厉害?!

    话说这即将上线的NGK公链可不是闹着玩的,这条公链的蛰伏时间长达两年,恐怕这个准备时间,连最初的区块链1.0时代的项目都无法比拟,现在的话那都差太远了. 编程一段代码并不难,难的是耐得住赚快钱的心.人 ...

  9. 「NGK每日快讯」11.24日NGK公链第22期官方快讯!

  10. 开发Microsoft Teams选项卡应用安全注意事项

    我们都知道,为了方便广大的开发人员快速开发Microsoft Teams选项卡应用,微软提供了一个JS SDK,你可以通过这里 https://docs.microsoft.com/en-us/jav ...