3-14 【文档讲解】路由与导航
声明：Flutter专栏文档均来自慕课网
https://coding.imooc.com/class/321.html
路由与导航
- Flutter中Intent等价于什么？(Android)
- 在Flutter中如何实现不同页面跳转（导航）？
- 如何获取路由跳转返回的结果？
- 如何在Flutter中处理来自外部应用程序传入的Intents？(Android)
- 怎么跳转到其他 App？
Flutter中Intent等价于什么？(Android)
在Android中，Intents主要有两种使用场景：在Activity之间切换，以及调用外部组件。 Flutter不具有Intents的概念，但如果需要的话，Flutter可以通过Native整合来触发Intents。
Intent还有一个作用是调用外部组件如：相机、文件选择器等，在Flutter中为了实现类似的功能我们需要借助第三方插件，推荐参考：Flutter现有插件，也可以学习如何构建Flutter插件；
在Flutter中如何实现不同页面跳转（导航）？
Android：
要在Flutter中切换屏幕，我们可以访问路由以绘制新的Widget。 管理多个屏幕有两个核心概念和类：Route 和 Navigator。Route是应用程序的“屏幕”或“页面”的抽象（可以认为是Activity）， Navigator是管理Route的Widget。Navigator可以通过push和pop route以实现页面切换。
和Android相似，我们可以在AndroidManifest.xml中声明Activities，在Flutter中，我们可以将具有指定Route的Map传递到顶层MaterialApp实例，但这不是必须的。
iOS：
在 iOS 中，可以使用管理了 view controller 栈的 UINavigationController 来在不同的 view controller 之间跳转。
React Native：
在React Native中，可以使用react-navigation来实现页面之间的导航。
Flutter 也有类似的实现，使用了 Navigator 和 Routes。一个路由是 App 中“屏幕”或“页面”的抽象，而一个 Navigator 是管理多个路由的 widget 。你可以粗略地把一个路由对应到一个 UIViewController。Navigator 的工作原理和 iOS 中 UINavigationController 非常相似，当你想跳转到新页面或者从新页面返回时，它可以 push() 和 pop() 路由。
在Flutter中，有两个主要的widget用于在页面之间导航：
以上两种widget对应Flutter中实现页面导航的有两种选择：
- 具体指定一个由路由名构成的 Map。（MaterialApp）
- 直接跳转到一个路由。（WidgetApp）
下面是构建一个 Map 的例子：
void main() {
runApp(MaterialApp(
home: MyAppHome(), // becomes the route named '/'
routes: <String, WidgetBuilder> {
'/a': (BuildContext context) => MyPage(title: 'page A'),
'/b': (BuildContext context) => MyPage(title: 'page B'),
'/c': (BuildContext context) => MyPage(title: 'page C'),
},
));
}
通过把路由的名字push 给一个 Navigator 来跳转：
Navigator.of(context).pushNamed('/b');
您还可以使用Navigator的push方法，该方法将给定route添加到导航器的历史记录中。 在以下示例中，MaterialPageRoute widget是一种模版路由，它根据平台自适应替换整个页面。 在以下示例中，widget是一种模版路由，它使用平台自适应替换整个页面。它需要一个WidgetBuilder作为必需参数。
Navigator.push(context, MaterialPageRoute(builder: (BuildContext context)
=> UsualNavscreen()));
如何获取路由跳转返回的结果？
在Android中有startActivityForResult来获取跳转页面后返回的结果，那么在Flutter中Navigator 类不仅用来处理 Flutter 中的路由，还被用来获取你刚 push 到栈中的路由返回的结果。通过 await等待路由返回的结果来达到这点。
举个例子，要跳转到“位置”路由来让用户选择一个地点，你可能要这么做：
Map coordinates = await Navigator.of(context).pushNamed('/location');
之后，在 location 路由中，一旦用户选择了地点，携带结果一起 pop() 出栈：
Navigator.of(context).pop({"lat":43.821757,"long":-79.226392});
如何在Flutter中处理来自外部应用程序传入的Intents？(Android)
Flutter可以通过直接与Android层通信并请求共享的数据来处理来自Android的Intents
在这个例子中，我们注册文本共享Intent，所以其他应用程序可以共享文本到我们的Flutter应用程序
这个应用程序的基本流程是我们首先处理Android端的共享文本数据，然后等待Flutter请求数据，然后通过MethodChannel发送。
首先在在AndroidManifest.xml中注册我们想要处理的Intent：
<activity
android:name=".MainActivity"
android:launchMode="singleTop"
android:theme="@style/LaunchTheme"
android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|layoutDirection"
android:hardwareAccelerated="true"
android:windowSoftInputMode="adjustResize">
<!-- ... -->
<intent-filter>
<action android:name="android.intent.action.SEND" />
<category android:name="android.intent.category.DEFAULT" />
<data android:mimeType="text/plain" />
</intent-filter>
</activity>
然后，在MainActivity中，您可以处理intent，一旦我们从intent中获得共享文本数据，我们就会持有它，直到Flutter在完成准备就绪时请求它。
package com.example.shared;
import android.content.Intent;
import android.os.Bundle;
import java.nio.ByteBuffer;
import io.flutter.app.FlutterActivity;
import io.flutter.plugin.common.ActivityLifecycleListener;
import io.flutter.plugin.common.MethodCall;
import io.flutter.plugin.common.MethodChannel;
import io.flutter.plugins.GeneratedPluginRegistrant;
public class MainActivity extends FlutterActivity {
private String sharedText;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
GeneratedPluginRegistrant.registerWith(this);
Intent intent = getIntent();
String action = intent.getAction();
String type = intent.getType();
if (Intent.ACTION_SEND.equals(action) && type != null) {
if ("text/plain".equals(type)) {
handleSendText(intent); // Handle text being sent
}
}
new MethodChannel(getFlutterView(), "app.channel.shared.data").setMethodCallHandler(
new MethodCallHandler() {
@Override
public void onMethodCall(MethodCall call, MethodChannel.Result result) {
if (call.method.contentEquals("getSharedText")) {
result.success(sharedText);
sharedText = null;
}
}
});
}
void handleSendText(Intent intent) {
sharedText = intent.getStringExtra(Intent.EXTRA_TEXT);
}
}
最后，在Flutter中，您可以在渲染Flutter视图时请求数据。
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
void main() {
runApp(SampleApp());
}
class SampleApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Sample Shared App Handler',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: SampleAppPage(),
);
}
}
class SampleAppPage extends StatefulWidget {
SampleAppPage({Key key}) : super(key: key);
@override
_SampleAppPageState createState() => _SampleAppPageState();
}
class _SampleAppPageState extends State<SampleAppPage> {
static const platform = const MethodChannel('app.channel.shared.data');
String dataShared = "No data";
@override
void initState() {
super.initState();
getSharedText();
}
@override
Widget build(BuildContext context) {
return Scaffold(body: Center(child: Text(dataShared)));
}
getSharedText() async {
var sharedData = await platform.invokeMethod("getSharedText");
if (sharedData != null) {
setState(() {
dataShared = sharedData;
});
}
}
}
怎么跳转到其他** App**？
在 iOS 中，要跳转到其他 App，你需要一个特定的 URL Scheme。对系统级别的 App 来说，这个 scheme 取决于 App。为了在 Flutter 中实现这个功能，你可以创建一个原生平台的整合层，或者使用现有的 plugin，例如 url_launcher。
大家可以通过《路由、Navigator与页面导航开发指南》来学习Flutter页面导航与路由的更多技巧和实战经验。
