flutter 分类

打包

Flutter 客户端打包

配置`app`图标

在项目的/android/app/src/main/res/,文件夹里有很多mipmap-为前缀命名的文件夹，后面是像素密度，可以看出图标的分辨率

mdpi:160dpi
hdpi:240dpi
xhdpi:320dpi
xxhdpi:480dpi
xxxhdpi:640dpi

配置`App`名称、图标名称和系统权限

Emilia Zhen大约 2 分钟

混合开发

flutter 与 Android 混合开发

在原生项目的上一级，创建flutter模块

flutter create -t module flutter_module

Emilia Zhen大约 1 分钟

存储

Dio

Dio是一个强大的Dart Http请求库，支持Restful API、FormData、拦截器、请求取消、Cookie管理、文件上传/下载、超时和定义适配器等

import 'package:flutter/material.dart';
import 'package:dio/dio.dart';

class PageHome extends StatelessWidget {
  void getHttp() async{
     try {
       Response res;
       res = await Dio().get('https://www.xxx?name=002');
      // res = await Dio().post('https://xx',queryParameters:{'name':002});
       print(res);
     } catch (e) {
     }
  }
  @override
  Widget build(BuildContext context) {
     getHttp();
     return Scaffold(
        body: Center(
           child: Text('首页'),
        ),
     );
  }
}

Emilia Zhen大约 3 分钟

路由

页面跳转

Navigator.push跳转到下一个页面，接收2个参数，一个是上下文，另一个是跳转的函数
Navigator.pop返回到上一个页面，使用时传递一个上下文，必须上级页面使用了.push才能使用

导航参数传递使用Navigator控件，然后使用路由MaterialPageRoute传递参数，并在子页面接收参数

itemBuilder: (context,index){
  return ListTile(
    title: Text(items[index].title),
    onTap: () async{
       final res = await Navigator.push(
         context,
         MaterialPageRoute(
            builder: (context) => new GoodsDetail(item:items[index])
         )
       );
       Scaffold.of(context).showSnackBar(SnackBar(content:Text('$res')));
    },
  );
},
....
children: <Widget>[
  Text('${item.description}'),
  RaisedButton(
    child: Text('选择该商品'),
    onPressed: (){
      Navigator.pop(context,'已选择${item.title}');
    },
  )
],
....

Emilia Zhen大约 4 分钟

组件

底部导航栏

在main.dart中MyApp返回的MaterialApp中引入一个即将编写的底部导航控件

import 'bottom_navigation_widget.dart';
...
    return MaterialApp(
     ...
      home: BottomNavigationWidget()
    );

Emilia Zhen大约 6 分钟

小部件

StatefulWidget 和 StatelessWidget

StatefulWidget具有可变状态的窗口部件，也就是你在使用应用的时候就可以随时变化，比如我们常见的进度条
StatelessWidget不可变状态窗口部件，也就是你在使用时不可以改变，比如固定的文字

init 先初始父类再初始子类
dispose 先销毁子类再销毁父类

主题自定义配置

theme: ThemeData(
   primaryIconTheme: IconThemeData(
     color: Colors.white
   ),
   brightness: Brightness.light,
   primaryColor: Color.fromARGB(255, 30, 46, 69),
   accentColor: Colors.blue
),

Emilia Zhen大约 11 分钟

dart

所有东西都是对象，每一个对象是类的实例，无论是数字、字符串、类还是函数
强类型语言，但也只是var声明，因为Dart会推断变量类型
支持通用类型，比如List<Map<String,String>>也可以写成List<Map<String,dynamic>>
运行从main函数开始，支持绑定到类或者对象函数
没有空开，私有关键字，但是可以通过对象里下划线开头去定义一个变量，为私有变量

Emilia Zhen大约 9 分钟

环境

特点

跨平台：至少跨Linux、Android、IOS、Fuchsia，甚至支持嵌入式开发
原生用户界面：原生的，有更好的体验更好的性能
开源免费
120fps 超高性能，采用 GPU 渲染技术
生态：插件丰富

安装

在环境变量用户变量里加入变量
安装Git，安装JAVA