Введение в структуру маршрутизации Flutter Fluro

Flutter

В процессе разработки приложений Flutter, помимо использования маршрутов, официально предоставляемых Flutter, для реализации управления страницами и навигации также могут использоваться некоторые сторонние фреймворки маршрутизации, такие как Fluro, Frouter и т. д. Fluro — отличная инфраструктура маршрутизации уровня предприятия Flutter.Использование Fluro более сложное, чем официально предоставленная инфраструктура маршрутизации, но она очень подходит для средних и крупных проектов. Потому что он имеет преимущества четкой иерархии, организации, легкого расширения и общего управления маршрутизацией. Перед использованием Fluro необходимо добавить зависимость Fluro в файл pubspec.yaml, как показано ниже.

dependencies:
 fluro: "^1.5.1"

Если вы не можете использовать описанный выше метод для добавления зависимостей Fluro, вы также можете использовать git для добавления зависимостей Fluro, как показано ниже.

dependencies:
 fluro:
   git: git://github.com/theyakka/fluro.git

После успешного добавления зависимости библиотеки Fluro вы можете использовать Fluro для управления маршрутизацией приложений и разработки навигации. Чтобы упростить унифицированное управление маршрутами, сначала необходимо создать файл сопоставления маршрутов для управления каждым маршрутом. Как показано ниже, это пример кода файла конфигурации маршрутизации route_handles.dart.

import 'package:fluro/fluro.dart';
import 'package:flutter/material.dart';
import 'package:flutter_demo/page_a.dart';
import 'package:flutter_demo/page_b.dart';
import 'package:flutter_demo/page_empty.dart';

//空页面
var emptyHandler = new Handler(
    handlerFunc: (BuildContext context, Map<String, List<String>> params) {
      return PageEmpty();
    });

//A页面
var aHandler = new Handler(
    handlerFunc: (BuildContext context, Map<String, List<Object>> params) {
      return PageA();
    });

//B页面
var bHandler = new Handler(
    handlerFunc: (BuildContext context, Map<String, List<Object>> params) {
      return PageB();
    });

После завершения базовой настройки маршрутизации вам также понадобится общий файл конфигурации статической маршрутизации, который нам удобно использовать на странице маршрутизации. Как показано ниже, это пример кода файла общей конфигурации маршрутизации route.dart.

import 'package:fluro/fluro.dart';
import 'package:flutter_demo/route_handles.dart';

class Routes {
  static String page_a = "/";                   //需要注意
  static String page_b = "/b";

  static void configureRoutes(Router router) {
    router.define(page_a, handler: aHandler);
    router.define(page_b, handler: bHandler);
    router.notFoundHandler =emptyHandler;     //空页面
  }
}

В общей конфигурации маршрутизации также необходимо иметь дело с ситуацией несуществующего пути, то есть вместо этого использовать пустую страницу или страницу по умолчанию. При этом следует отметить, что домашняя страница приложения должна быть настроена с помощью «/». Для удобства использования также необходимо сделать Router статическим, чтобы его можно было вызывать прямо на любой странице. Ниже показан пример кода для файла application.dart.

import 'package:fluro/fluro.dart';

class Application{
  static Router router;
}

После выполнения вышеуказанных операций вы можете импортировать файлы конфигурации маршрутизации и статические файлы в файл main.dart, как показано ниже.

import 'package:fluro/fluro.dart';
import 'package:flutter_demo/routes.dart';

import 'application.dart';

void main() {
  Router router = Router();
  Routes.configureRoutes(router);
  Application.router = router;

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Demo App',
      onGenerateRoute: Application.router.generator,
    );
  }
}

Если вы хотите перейти на страницу, просто используйте метод Application.router.navigateTo(), как показано ниже.

Application.router.navigateTo(context,"/b");   //b为配置路由

Запустите приведенный выше пример кода, эффект показан на следующем рисунке.

在这里插入图片描述
Можно обнаружить, что хотя Fluro более громоздкий в использовании, чем Flutter Navigator, он очень подходит для средних и крупных проектов.Его многоуровневая архитектура также очень удобна для последующих обновлений и обслуживания проекта.Вы можете сделать разумный выбор в соответствии с к реальной ситуации.