flutter例子,flutter笔记
Flutter之国际化多语言
在说flutter国际化前,不得不提到,在uni-app中支持的Vue-i18n,两者有相似之处,也有差异的地方。
创新互联公司是一家专注网站建设、网络营销策划、小程序设计、电子商务建设、网络推广、移动互联开发、研究、服务为一体的技术型公司。公司成立十年以来,已经为上1000家公路钻孔机各业的企业公司提供互联网服务。现在,服务的上1000家客户与我们一路同行,见证我们的成长;未来,我们一起分享成功的喜悦。
本篇借鉴了三篇热门帖子
Flutter中的国际化:如何写一个多语言的App
Flutter国际化完整例子
Internationalization - Make an Flutter application multi-lingual
只记录根据手机系统语言自动转换app语言
引入后,保存会自动加入安装此依赖
我们新建一个和"/lib"同级别的文件夹"/locale",然后在这个文件夹中新建两个文件,分别为"i18n_en.json" 和" i18n_zh.json"。再在"/lib"文件夹下创建和"main.dart"同级的"translation.dart"和"application.dart"。
文件夹树现在是这个样子的:
MyApplication
|
+- android
+- build
+- images
+- ios
+- lib
|
+-main.dart
+-translation.dart
+-application.dart
+- locale
|
+- i18n_en.json
+- i18n_zh.json
+- test
在pubspec.yaml继续加入json,引入静态资源
补充:如果需要强制转换的话(我自己没有用到)
Flutter局部刷新方法
Flutter中Widget分为StatefulWidget和StatelessWidget,分别为动态视图和静态视图,视图的更新需要调用StatefulWidget的setState方法,这会遍历调用子Widget的build方法。当一个主页面比较复杂时,会包含多个widget,如果直接调用setState,会遍历所有子Widget的build,这是非常不必要的性能开销,有没有单独刷新指定Widget的方式呢?这个时候就要用到GlobalKey了。
一个StatefulWidget包含一个Button,一个Text,通过点击Button调用主Widget的setState方法,刷新Text,示例如下:
同样一个StatefulWidget包含一个多个Text和Button,点击Button我们只需要刷新指定的Text,通过GlobalKey的方式,实现如下:
主Widget,包含一个需要更新的TextWidget和一个不需要更新的Text
需要单独更新的Widget
传递事件的Button
这样点击Button就只会更新指定的TextWidget了,效果如下:
这只是一个简单的例子,在实际开发中为了页面刷新的高效率,模块化封装非常重要。很多情况下都只需要局部刷新,而不是重构整个视图。所以Globalkey的运用在项目中需要熟练掌握
flutter 页面的生命周期(转)
转自
在 Flutter 中,有两类常用的 Widget:
在开发过程中,我们经常需要继承它们两来实现自己的 Widget。
一个 StatelessWidget 是不能被改变的,比如: Icon 、 Text 等。
如果你的控件一旦显示,就不需要再做任何的变更,那么你应该使用 StatelessWidget 。
实现一个自己的 StatelessWidget 很简单。
当你看到下面这个例子?时,你就知道它有多简单了。
看,只要在 build() 中返回你的视图就可以了。
一个 StatefulWidget 是有状态的,可变的。
它可以改变自己的外观,以响应用户的操作或者数据的变化。
比如: CheckBox 、 Switch ..
我们之所以能够改变一个 StatefulWidget ,是因为它有一个设置状态的函数:
调用这个函数后,就会触发 StatefulWidget 的视图树重建。
因此,当我们需要一个可交互的,即能根据用户操作或数据变化而改变视图的 Widget 时,那就得用上 StatelessWidget 了。
现在,来创建一个自定义的 StatefulWidget:
从上面的例子中可以看到, StatefulWidget 会要求提供一个含有视图树的 State 。
既然 State 能够控制一个视图的状态,那它肯定会有一系列的生命周期。
上图就是 State 的生命周期图。
离不开DART的Flutter(dart篇)
hello world例子
在终端打印字符串‘Hello World!’
计算斐波那契数列
一个简单的类
计算两点距离
异步并发示例
使用了Isolate
1.面向对象
对于面向对象这个概念,相信了解Java的同学对这个概念一定不会陌生。
例如:我们有个Person Object他有很多特征和行为。
这些都是这个Person Object的属性。
也就是因为有了这些特征,行为等等才决定了这个人是谁。
那么回到Dart当中,所有的都是对象,那么在就可以可以跟进对象的属性的特征,方法等等来进行编程。
之所以我们在这里又特别强调了一下面向对象的概念,是因为这个概念在Dart语言当中,至关重要!
2.最重要的几个概念
3.Dart的部分特性
4.Dart的内置库
包名
描述
dart:asynv
异步编程,提供Future,Stream类
dart:collection
集合
dart:convert
不同类型的字符编码解码
dart:core
Dart语言核心功能,内置类型
dart:html
网页开发用到的库
dart:io
文件读写,IO相关
dart:math
数字常量以及函数,随机算法等
dart:svg
事件和动画矢量图支持
综上述所说要想学Flutter,先学Dart!关于Flutter下篇我会讲到。为什么离不开dart!
有关更多面经、核心技术笔记;自己也是从事Android开发5年有余了;整理了一些Android开发技术核心笔记和面经题纲, 如有需要的同学请私信我回复“核心笔记”或“面试”领取!
flutter 表单Form使用示例
flutter提供一套表单校验框架Form,可以通过Form框架一步校验所有表单,非常方便,比较常用的用法是Form+TextFormField。
Form继承StatefulWidget,有一个widget 类型的child参数,证明Form是一个容器。
Form里还有一个validate方法,如下
一般通过GlobalKey来访问Form中validate方法,Form的validate方法用来校验所有Form里的FormField表单,validate方法返回值是bool类型,返回true表示所有表单校验成功;返回false表示有校验失败的表单;
TextFormField继承FormField,FormField后面源码分析会讲,所有Form可统一校验的表单都必须继承FormField,可以通过FormField自定义各种各样可校验表单,TextFormField只是FormField自定义表单中的一种。
表单校验必须实现的方法为validator,定义如下:
每个表单的校验规则都在validator里实现,通过返回值来判断是否校验成功。
1、用Form包在所有需要校验的表单最外层,如下:
2、将GlobalKey传给Form,用于调用Form里方法,如下:
3、将TextFormField传给Form容器,如下:
4、实现对应TextFormField的校验规则 ,如下:
5、最后调用Form校验所有表单方法validate,如下:
当前文章:flutter例子,flutter笔记
链接地址:http://hbruida.cn/article/dsejjds.html