ITPub博客

首页 > 移动开发 > ANDROID > Flutter学习必知必会!怎样才能不踩坑地使用Flutter ?

Flutter学习必知必会!怎样才能不踩坑地使用Flutter ?

原创 ANDROID 作者:yilian 时间:2020-01-21 16:35:24 0 删除 编辑

序言

Flutter出来已经有些日子了,越来越多的开发者也开始尝试使用  Flutter 进行开发, Flutter 是谷歌的移动 UI框架,基于  Dart 语言,支持多端开发( Android、 iOS、 Web),听到这里是不是想要跃跃欲试了,由于小编也正在踩坑的路上,所以有写的不对的地方还请多多指教。

官网

任何一门语言,官网都是最好的学习渠道,虽然说大多数都是英文的,但现在谷歌已经有很多都支持中文版本了:

Flutter中文官网: https://flutterchina.club/

安装

安装直接按照官网的来就行了,最主要的就是配置一下环境变量,下载下来的  flutter 包你可以理解为  java 中的  jar 包,开发的时候需要导入的。

特性

1、widget(相当于Android中的View)

我们都知道,在  Android 中页面是由很多个 View来构成的,在  Flutter 中, Widget 用来构成页面上的内容,但是和  View 不同的是, Widget 是不可变的,有些人可能就有疑问了,不可变那岂不是静态页面,非也非也,那肯定有其他办法的咯,接着往下看:

1.1、不可变状态的小部件StatelessWidget

你可以将  StatelessWidget 理解成  Android 中的  ViewGroup,这是一个无状态的小部件,什么意思呢,就是当你的页面部分不依赖于对象配置信息外的其他任何内容时,简而言之就是你的页面是静态页面时,就可以使用它。

1.2、可变状态的小部件StatefulWidget

和  StatelessWidget 一样可以理解为  ViewGroup,但是它是有状态的,这个状态类似于  Activity 的生命周期,当你的页面需要动态的改变时,你就需要使用它。

注意

如果一个  Widget 发生了变化(用户与之交互),那么它就是有状态的;如果一个子  Widget是有状态的,那么包裹它的父  Widget 可以是有状态的也可以是无状态的,简而言之, StatelessWidget 中可以包含  StatefulWidget,而  StatefulWidget 中也可以包含  StatelessWidget。

2、Android中的四大组件还有与之对应的吗

除了页面之外,其他的肯定都没有,因为毕竟是跨端开发的框架,不是专门为  Android 而设计的,可能有些人要问了,那如果想实现  Android 中的一些特殊的功能岂不是做不了了,非也非也,这个就属于另外一个知识了,卖个关子先,接着往下看; Activity 和  Fragment 在  Flutter 中都变成了  Widget。

3、资源文件

3.1、资源图片

在 Android中资源图片有很多种分辨率, Flutter 遵循像 iOS这样简单的 3种分辨率格式:  1x,  2x,  3x,在根目录下创建一个  images 的文件夹,然后再在  images 文件夹中创建三个文件夹用来存放不同分辨率的图片:

../icon.png

../2.0x/icon.png

../3.0x/icon.png

然后,你需要在  pubspec.yaml 中配置这些图片,这个文件相当于 Android中的  gradle文件。

3.2、字符串

在  Flutter 中,目前最好的做法就是新建一个类,用来声明你所需要的字符串

  声明:  class Strings{    static String welcomeMessage = "Welcome To Flutter";
  }
  使用:  new Text(Strings.welcomeMessage);

4、生命周期

在  Flutter中, StatelessWidget是没有生命周期的,只有  StatefulWidget 才有,我们一般通过挂接到 WidgetsBinding观察并监听 didChangeAppLifecycleState更改事件来监听生命周期事件,有以下这些生命周期:

resumed - 应用程序可见并响应用户输入。这是来自 Android的 onResume

inactive - 应用程序处于非活动状态,并且未接收用户输入。此事件在 Android上未使用,仅适用于 iOS

paused - 应用程序当前对用户不可见,不响应用户输入,并在后台运行。这是来自 Android的 onPause

suspending - 该应用程序将暂时中止。这在 iOS上未使用

5、异步UI

Dart是单线程执行模型,支持 Isolates(在另一个线程上运行 Dart代码的方式)、事件循环和异步编程。 除非您启动一个 Isolate,否则您的 Dart代码将在主 UI线程中运行,并由事件循环驱动。

当你进行网络请求时,可以在 UI线程直接运行网络请求代码:

  loadData() async {    String dataURL = "https://jsonplaceholder.typicode.com/posts";
    http.Response response = await http.get(dataURL);
    setState(() {
      widgets = JSON.decode(response.body);
    });
  }

这里使用了  async/await 语法来调用 API,你可以理解为,使用  async 之后这个方法就变成了异步的方法,然后需要等待 (await)网络请求完成之后再执行下面更新语句;在  StatefulWidget 中,我们使用  setState 方法来更新 UI操作,这会重新执行  build 方法。

6、组件

在  Flutter 中,有很多组件,他们可以构建成页面,因为组件繁多,所以这里我就不一一介绍了,我会在接下来的博客中为大家一一介绍  Flutter中各种组件的使用方法,也欢迎大家持续关注后续博客。

当然还有一些已经上传到了GitHub: https://github.com/Meng997998/Flutter-study,以后也会慢慢更新


来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/69952849/viewspace-2674208/ ,如需转载,请注明出处,否则将追究法律责任。

请登录后发表评论 登录
全部评论
人生的长跑中,跑得最远的人,可能不是跑得最快的人,而是规划了最佳行程的人 Android学习也是如此,分享Android学习内容、面试精选等,关注我,需要学习计划大纲和学习内容:xx13414521

注册时间:2019-11-05

  • 博文量
    175
  • 访问量
    178557