Flutter教程——为什么使用Flutter和Flutter的语言Dart

前几个月因为公司业务需求，需要使用跨平台框架Flutter，现在有时间了，记录下这几个月的学习笔记：

一，为什么使用Flutter

1，Flutter上手简单

是面向对象语言，和我以前使用的Java有共同性，使用响应式框架，内置Material Design风格，具有大量的widget库和API，轻松构建用户界面，上手简单。

2，可以快速开发

具有热重载功能，可以快速的进行测试、构建UI、添加功能并更快的修复错误，几毫秒内就能重载，并且不会丢失状态,提高开发效率。

3，性能好

Skia在Android源码 external/skia 目录里，Skia提供的绘图接口都是统一的,本质是一个底层的图形、图像、动画、文本等多方面的图形库，是2D图形系统的引擎。

完成绘图时：原生APP调用Android框架，然后调用skia绘图引擎代码；flutter是调用Flutter框架的dart代码，然后再调用skia代码，层级相同，所以性能可以媲美原生APP。但其他的跨平台如RN，是调用js代码，然后再调用Android框架的。

Dart代码编译模式为预先编译（Ahead-Of-Time,AOT），直接生成汇编源文件代码，由各个平台自行汇编。

二，Dart

Fllutter框架采用dart语言，直接在AndroidStudio上编辑就好。

1，Dart关键字：

async、await、sync、hide、on、show、abstract、as、covariant、defered、dynamic、export、external、factory、Function、get、set、implements、import、interface、library、mixin、operator、part、static、typedef、assert（断言）、break、case、catch、class、const、continue、default、do、else、enum、extends、false、final、finally、for、if、in、is、new、null、rethrow、return、super、switch、this、th、row、true、try、var、void、while、with。

2，变量的声明

（1）var：无论字符串还是数字，初始化的变量均为null。

var name = 'gl';

（2）Object，dynamic：变量没有明确的类型时使用，即对象不限于单一类型。

Object name = 'gl';
dynamic phoneNum = '1234';

（3）也可以显示声明类型，如String，int等。

（4）final：常量，只能被设置一次；const：编译时常量；被这两种关键字修饰，变量类型可以省略，且无法再去修改其值，并且不能和var同时使用。

final name = 'gl';
const phoneNum = '1234';//常量如果是类级别的需要用static const phoneNum = '1234';

//const关键字还可以用来创建常量值
var varList = const ['1','2'];
final finalList = const [];
const constList = [];
varList = const['1'];//可以改变值
//finalList = const['2'];//会报错

3，数据类型

numbers：int、double；string；booleans；lists：list；maps：map；runes

    /* ------------num-------------*/
    num num1 = 10;
    int num2 = 10;
    print(num2.toDouble());
    double num3 = 10.0;
    print(num3.toInt());
    /* ------------string-------------*/
    //string里有引号需要反斜杠
    String str1 = 'it\'s a dog!';//输出it's a dog!
    //使用$符引用变量
    String str2 = '引用num1:$num1';
    str2 = '引用num:${num1 + num2}';
    /* ------------boolean-------------*/
    //assert是断言函数，仅在debug模式有效，条件为true则继续执行，否则抛异常并终止程序
    assert(str1.isEmpty);
    //bool都是编译时常量
    bool glIsBeautiful = true;
    /* ------------list-------------*/
    List list = [1,2,3];
    list.length;
    list.add(4);
    list.insert(0, 0);
    list.removeAt(1);//移除position为1的元素
    list.remove(2);//移除元素2
    list.indexOf(3);
    list.asMap();//转为map
    /* ------------map-------------*/
    Map map = {'name':'gl','age':18};//打印是{name:gl,age:18}
    map['height'] = 160;
    bool test = map.containsKey('name');//true
    map.containsValue('gl');//true
    //编译时常量
    final map2 = const {'name':'gl','age':18};
    map2['height'] = 160;
    /* ------------runes-------------*/
    //表示Unicode字符
    Runes input = new Runes('\u2665');

4，函数

  //1，普普通通的
  void fun(String name){}

  //2，方法中的参数类型和返回值类型是可以省略的
  fun1(name,age) => name + ': $age';//fun3函数返回值的简单写法

  //3，可选位置参数： fun2('gl',null,18); fun2('gl',18);
  //gender是个默认参数值
  void fun2(String name,[int age,gender = '美女']){
    print("name: $name,age: $age,gender: $gender");
  }

  //4，可选参数,没有传的参数为null
  // 调用时 fun3('gl',age: 18);
  fun3(name,{age,gender}){
    print("name: $name,age: $age,sex: $gender");
  }

5,流程控制语句

和Java差不多，不做过多描述：if和else；switch和case；for循环；while循环；do-while循环；break跳出循环；continue跳出本次循环；

新增：assert断言

6，异常

使用方式和Java差不多，捕获语句除了catch也可以使用on，还可以同时使用，on用来指定异常的类型，catch用来捕获对象。

try {
      //...
    } on IntegerDivisionByZeroException {
      //...
    } on Exception catch (e) {
      print('Unknown exception: $e');
      //rethrow; 这个关键字允许继续传递
    } catch (e) {
      print('exception: $e');
    }finally{
      //肯定会执行的代码
    }
}

还可以直接throw，还可以自己自定义：

    throw FormatException();
    throw '格式错误';

7，类可以使用with关键字多继承，子类可以拥有所有父类的方法

class Child extends Parent1 with Parent2{
}

8，dart import

//加载第三方库
import 'package:flutter/material.dart';
//加载dart内置库
import 'dart:async';
//加载本地文件
import 'test.dart';
//as可以设置别名
import 'package:image/image.dart' as image;
//延迟加载，调用io.loadLibrary()使用
import 'dart:io' deferred as io;

9，异步

People getPeople(){
  //延迟几秒，可以让其他语句执行完
  print('正在获取数据...');
}

//async标明这是一个异步函数，返回值类型时Future类型
//await等待耗时操作的返回结果
Future<People> fun() async {
  print('要开始获取了！');
  People people = await getPeople();
  print('获取成功！');
  return people;
}

test(){
  print('要开始测试了！');
  fun().then((people){
    print('获取到了people：$people');
  }).whenComplete((){
    print('异步处理完成');
  }).catchError((){
    print('异常');
  });
  print('还在获取，但我可以执行！');
}

以上代码执行结果：

要开始测试了！

要开始获取了！

还在获取，但我可以执行！

正在获取数据...

获取成功！

获取到了people：people

异步处理完成！