flutter小计

一、常用的第三方插件

名称	描述
dio	网络请求
fluttertoast	提示 toast
sqflite	数据持久化
flutter_swiper	轮播图
flutter_screenutil	屏幕适配
cached_network_image	缓存网络图片
shared_preferences	本地存储
event_bus	事件通知
provider	状态管理
flutter_screenutil	屏幕适配
city_pickers	城市选择器
flutter_easyrefresh	刷新控件
transparent_image	图片动画
device_info	获取设备信息

二、路由

2.1 基本跳转

• initialRoute：设置应用程序从哪一个路由开始启动，设置了该属性，就不需要再设置home属性了
• routes：定义名称和路由之间的映射关系，类型为Map<String, WidgetBuilder>

2.2 跳转传值

arguments传递数据。

_onPushTap(BuildContext context) {
  Navigator.of(context).pushNamed(HYDetailPage.routeName, arguments: "a home message of naned route");
}

HYDetailPage接受数据：
在build方法中ModalRoute.of(context)可以获取到传递的参数。

 Widget build(BuildContext context) {
    // 1.获取数据
    final message = ModalRoute.of(context).settings.arguments;
  }

2.3 路由钩子

onGenerateRoute，使用场景，假如我们有一个HYAboutPage，也希望在跳转时，传入对应的参数message，并且已经有一个对应的构造方法。这个时候我们可以使用onGenerateRoute的钩子函数：

• 当我们通过pushNamed进行跳转，但是对应的name没有在routes中有映射关系，那么就会执行onGenerateRoute钩子函数；
• 我们可以在该函数中，手动创建对应的Route进行返回；
• 该函数有一个参数RouteSettings，该类有两个常用的属性：
  name: 跳转的路径名称
  arguments：跳转时携带的参数

onGenerateRoute: (settings) {
  if (settings.name == "/about") {
    return MaterialPageRoute(
      builder: (ctx) {
        return HYAboutPage(settings.arguments);
      }
    );
  }
  returnnull;
}

2.4 onUnknownRoute

在路由不存在的时候，这个时候我们希望跳转到一个统一的错误页面。以防止flutter出现错误的情况。

• 未知页面/abc

  ListTile(
     onTap: () {
         print("我的收藏");
         Navigator.pushNamed(context, '/GHOrderListPage231231');//弹出错误页面
          },
         leading: Icon(Icons.collections_bookmark, color: Colors.red),
         title: Text("我的收藏"),
         ),)

• 创建错误提示页面

class UnknownPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("错误页面~"),
      ),
      body: Container(
        child: Center(
          child: Text("页面跳转错误~"),
        ),
      ),
    );
  }
}

• 设置onUnknownRoute路由

onUnknownRoute: (settings) {
  return MaterialPageRoute(
    builder: (ctx) {
      return UnknownPage();
    }
  );
},

结果如下图所示：

错误路由界面