Flutter 경로 프레임 Fluro 사용 안내

Flutter 응용 개발 과정 에서 Flutter 가 공식 적 으로 제공 하 는 경로 외 에 일부 제3자 경로 프레임 워 크 를 사용 하여 페이지 관리 와 네 비게 이 션 을 실현 할 수 있다.예 를 들 어 Fluro,Frouter 등 이다.
Fluro 는 우수한 Flutter 기업 급 경로 구조 로 서 Fluro 의 사용 은 공식 적 으로 제공 하 는 경로 구조 보다 복잡 하지만 중대 형 프로젝트 에 매우 적합 하 다.차원 이 뚜렷 하고 조리 화 되 며 확장 이 편리 하고 전체적인 관리 경로 에 편리 하 다 는 장점 이 있 기 때문이다.
Fluro 를 사용 하기 전에 pubspec.yaml 파일 에 Fluro 의존 도 를 추가 해 야 합 니 다.다음 과 같 습 니 다.

dependencies:
 fluro: "^1.5.1"

위의 방식 으로 Fluro 의존 도 를 추가 할 수 없다 면 git 방식 으로 Fluro 의존 도 를 추가 할 수 있 습 니 다.다음 과 같 습 니 다.

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

Fluro 라 이브 러 리 의존 도 를 성공 적 으로 추가 하면 Fluro 를 사용 하여 응용 할 수 있 는 경로 관리 와 네 비게 이 션 개발 이 가능 합 니 다.경로 에 대한 통 일 된 관 리 를 편리 하 게 하기 위해 서 는 먼저 모든 경로 에 대한 매 핑 파일 을 새로 만들어 야 합 니 다.다음 과 같이 설정 파일 routehandles.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();
  });

기본 적 인 경로 설정 을 완성 한 후에 정적 인 경로 전체 설정 파일 이 필요 합 니 다.우리 가 경로 페이지 에서 사용 할 수 있 도록 해 야 합 니 다.다음 과 같이 전체 설정 파일 routes.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 보다 사용 이 번 거 롭 지만 중대 형 프로젝트 에 적합 하고 레이 어 링 구조 도 프로젝트 후기 업그레이드 와 유지 에 편리 하 며 사용 시 실제 상황 에 따라 합 리 적 으로 선택 할 수 있 음 을 알 수 있다.
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.