Flutter学习笔记(14)--StatefulWidget简单使用
如需转载,请注明出处:Flutter学习笔记(14)--StatefulWidget简单使用
今天上班没那么忙,突然想起来我好像没StatefulWidget(有状态组件)的demo,闲来无事,写一个简单的学习学习,前面我们有说过,Flutter不同于Android。Flutter是只绘制一帧,这一帧会绘制整个widget树,也就是说一次绘制整个界面,那么想一下,如果想要页面内容发生变化,是不是要重新绘制界面呢?如果需要重新绘制的,又怎么样来触发重新绘制的机制呢?先看下demo的代码吧,很简单的!
import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatefulWidget{
@override
State<StatefulWidget> createState() {
// TODO: implement createState
return new MyAppState();
} } class MyAppState extends State<MyApp> {
var _textContent = 'welcome to flutter word';
void _changeTextContent(){
setState(() {
_textContent = 'what is up man???';
});
}
@override
Widget build(BuildContext context) {
// TODO: implement build
return new MaterialApp(
theme: new ThemeData(
primaryColor: Colors.white,
),
debugShowCheckedModeBanner: false,
title: 'demo',
home: new Scaffold(
appBar: new AppBar(
title: new Text('Demo'),
leading: Icon(Icons.menu,size: ,),
actions: <Widget>[
Icon(Icons.search,size: ,)
],
),
body: new Center(
child: new Text(_textContent),
),
floatingActionButton: new FloatingActionButton(onPressed: _changeTextContent,child: new Icon(Icons.adjust),),
),
);
}
}
StatefulWidget是有状态的组件,意思不是说StatefulWidget类本身是可变的,实际上StatefulWidget类本身也是不变的,而StatefulWidget持有的state状态是在widget整个生命周期内一直存在的,也是因为有了这个state状态,我们就可以通知Flutter框架某一个状态发生了变化,Flutter会重新运行build方法来重新绘制界面。
上面的demo就是一个text和一个button,点击按钮,调用_changeTextContent这个私有的方法,在_changeTextContent这个方法里面我们将文本的内容进行了更改,这个操作是放在了setState方法内的,setState这个方法的作用就是通知Flutter框架,有组件的状态发生变化了,你需要重新执行build绘制界面了,这样我们重新赋值的文本内容就会展示到前台了。
下一章节:Flutter学习笔记(15)--MaterialApp应用组件及routes路由详解
Flutter学习笔记(14)--StatefulWidget简单使用的更多相关文章
- Flutter学习笔记(13)--表单组件
如需转载,请注明出处:Flutter学习笔记(13)--表单组件 表单组件是个包含表单元素的区域,表单元素允许用户输入内容,比如:文本区域,下拉表单,单选框.复选框等,常见的应用场景有:登陆.注册.输 ...
- Flutter学习笔记(25)--ListView实现上拉刷新下拉加载
如需转载,请注明出处:Flutter学习笔记(25)--ListView实现上拉刷新下拉加载 前面我们有写过ListView的使用:Flutter学习笔记(12)--列表组件,当列表的数据非常多时,需 ...
- Flutter学习笔记(9)--组件Widget
如需转载,请注明出处:Flutter学习笔记(9)--组件Widget 在Flutter中,所有的显示都是Widget,Widget是一切的基础,我们可以通过修改数据,再用setState设置数据(调 ...
- Flutter学习笔记(16)--Scaffold脚手架、AppBar组件、BottomNavigationBar组件
如需转载,请注明出处:Flutter学习笔记(15)--MaterialApp应用组件及routes路由详解 今天的内容是Scaffold脚手架.AppBar组件.BottomNavigationBa ...
- Flutter学习笔记(29)--Flutter如何与native进行通信
如需转载,请注明出处:Flutter学习笔记(29)--Flutter如何与native进行通信 前言:在我们开发Flutter项目的时候,难免会遇到需要调用native api或者是其他的情况,这时 ...
- Flutter学习笔记(22)--单个子元素的布局Widget(Container、Padding、Center、Align、FittedBox、Offstage、LimitedBox、OverflowBox、SizedBox)
如需转载,请注明出处:Flutter学习笔记(22)--单个子元素的布局Widget(Container.Padding.Center.Align.FittedBox.Offstage.Limited ...
- Flutter学习笔记(32)--PointerEvent事件处理
如需转载,请注明出处:Flutter学习笔记(32)--PointerEvent事件处理 在Android原生的开发中,对于事件的处理,我们都知道事件分为down.move.up事件,对于ViewGr ...
- Flutter学习笔记(33)--GestureDetector手势识别
如需转载,请注明出处:Flutter学习笔记(33)--GestureDetector手势识别 这篇随笔主要记录的学习内容是GestureDetector手势识别,内容包括识别单击.双击.长按.组件拖 ...
- Flutter学习笔记(35)--通知Notification
如需转载,请注明出处:Flutter学习笔记(35)--通知Notification 通知的NotificationListener和我们之前写的事件的Listener一样,都是功能性的组件,而且也都 ...
随机推荐
- CSS3过渡与动画
一.CSS3 过渡 transition-property 规定过渡效果的 CSS 属性名 -webkit-transition-property: none / all / property; -m ...
- 第一个SpringBoot
Spring Boot是由Pivotal团队提供的全新框架,其设计目的是用来简化新Spring应用的初始搭建以及开发过程.该框架使用了特定的方式来进行配置,从而使开发人员不再需要定义样板化的配置.用我 ...
- 50道SQL练习题及答案与详细分析!!!
以前在学校还没有很认真地意识到,现在到了企业才发现sql是那么的重要,看到网上有很多的sql 练习题,特地拿来练练手! 数据表介绍 --1.学生表 Student(SId,Sname,Sage,Sse ...
- Ural 2064:Caterpillars(思维暴力)
http://acm.timus.ru/problem.aspx?space=1&num=2064 题意:有n只虫子在爬树,每个虫子往上爬ti距离后会往下掉落ti距离,每爬一个单位距离耗费一个 ...
- .Net 通过设置Access-Control-Allow-Origin来实现跨域访问
目录 # 前言 # 为每个API接口单独添加响应头 1.针对 ASP.NET MVC 项目的Controllers 2.针对 ASP.NET Web API项目的Controllers 3.针对ASP ...
- MySQL login-path 本地快捷登陆
目录 1.什么是 login-path 2. 配置 login-path 2.2.配置: 2.3.显示配置: 2.3.1.显示执行的login-path配置 2.3.2.显示所有的login-path ...
- 按行读取String类型
BufferedReader br = new BufferedReader(new InputStreamReader(new ByteArrayInputStream(content.getByt ...
- Node.js热部署代码,实现修改代码后自动重启服务方便实时调试
写PHP等脚本语言的时候,已经习惯了修改完代码直接打开浏览器去查看最新的效果.而Node.js 只有在第一次引用时才会去解析脚本文件,以后都会直接访问内存,避免重复载入,这种设计虽然有利于提高性能,却 ...
- python小技巧 将二元列表转为一元列表
list=[num for row in nums for num in row]
- 机器学习-EM算法
最大期望算法 EM算法的正式提出来自美国数学家Arthur Dempster.Nan Laird和Donald Rubin,其在1977年发表的研究对先前出现的作为特例的EM算法进行了总结并给出了标准 ...