Flutter深度链接管理插件flutter_deep

Flutter深度链接管理插件flutter_deep_links的使用

介绍

flutter_deep_links 是一个用于在Flutter应用中处理深度链接的插件。通过这个插件，您可以轻松地在应用中实现深度链接的功能，包括处理从外部应用或浏览器打开应用时传递的URL。

开始使用

flutter_deep_links 插件是一个Flutter插件项目，它包含了平台特定的实现代码（如Android和iOS）。为了开始使用这个插件，您需要确保已经安装了Flutter环境，并且熟悉Flutter开发的基本概念。

添加平台支持

默认情况下，flutter_deep_links 插件项目生成时不包含任何平台支持。要添加平台支持，您可以在项目目录中运行以下命令：

flutter create -t plugin --platforms <platforms> .

其中 <platforms> 可以是 android、ios、web 等。例如，如果您想同时支持Android和iOS平台，可以运行：

flutter create -t plugin --platforms android,ios .

示例代码

下面是一个完整的示例代码，展示了如何在Flutter应用中使用 flutter_deep_links 插件来处理深度链接。

main.dart

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

void main() {
  // 初始化FlutterDeepLinks并监听深度链接
  FlutterDeepLinks.init().listen((Uri? uri) {
    if (uri != null) {
      print('Received deep link: $uri');
      // 处理接收到的深度链接
    }
  });

  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _deepLink = 'No deep link received';

  [@override](/user/override)
  void initState() {
    super.initState();

    // 监听应用启动时的深度链接
    FlutterDeepLinks.getInitialLink().then((Uri? uri) {
      if (uri != null) {
        setState(() {
          _deepLink = 'Initial deep link: $uri';
        });
      }
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Flutter Deep Links Example'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(_deepLink),
              ElevatedButton(
                onPressed: () async {
                  // 模拟接收一个深度链接
                  Uri testUri = Uri.parse('https://example.com/path?param=value');
                  setState(() {
                    _deepLink = 'Received deep link: $testUri';
                  });
                },
                child: const Text('Simulate Deep Link'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

sinazl 1楼•3 个月前

更多关于Flutter深度链接管理插件flutter_deep_links的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

当然，下面是一个关于如何使用Flutter深度链接管理插件flutter_deep_links的示例代码。这个插件允许你处理应用中的深度链接（Deep Links），即用户可以通过点击一个链接直接跳转到应用内的特定页面。

首先，确保你已经在pubspec.yaml文件中添加了flutter_deep_links依赖：

dependencies:
  flutter:
    sdk: flutter
  flutter_deep_links: ^x.y.z  # 替换为最新版本号

然后运行flutter pub get来安装依赖。

1. 配置AndroidManifest.xml（Android）

在Android项目中，你需要配置AndroidManifest.xml来声明你希望捕获的intent-filters。例如：

<activity
    android:name=".MainActivity"
    android:launchMode="singleTop"
    android:theme="@style/LaunchTheme"
    android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
    android:hardwareAccelerated="true"
    android:windowSoftInputMode="adjustResize">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
    <intent-filter android:autoVerify="true">
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <data android:scheme="https" android:host="example.com" android:pathPrefix="/deep-link" />
    </intent-filter>
</activity>

2. 配置Info.plist（iOS）

在iOS项目中，你需要配置Info.plist来声明你希望捕获的URL scheme。例如：

<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleTypeRole</key>
        <string>Editor</string>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>yourappscheme</string>
        </array>
        <key>CFBundleURLName</key>
        <string>com.example.yourapp</string>
    </dict>
</array>

3. 在Flutter代码中使用flutter_deep_links

首先，导入flutter_deep_links包：

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

然后，初始化深度链接监听器，并在应用启动时检查是否有深度链接被触发：

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Deep Link Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: DeepLinkHandler(),
    );
  }
}

class DeepLinkHandler extends StatefulWidget {
  @override
  _DeepLinkHandlerState createState() => _DeepLinkHandlerState();
}

class _DeepLinkHandlerState extends State<DeepLinkHandler> {
  @override
  void initState() {
    super.initState();
    FlutterDeepLinking.initialize().then((_) {
      FlutterDeepLinking.retrieveDeepLink().then((deepLink) {
        if (deepLink != null) {
          // 处理深度链接
          print('Retrieved deep link: $deepLink');
          // 根据deepLink的值导航到特定页面
          // Navigator.pushNamed(context, '/someRoute', arguments: deepLink);
        }
      });

      // 监听未来的深度链接
      FlutterDeepLinking.listenDeepLink((deepLink) {
        print('Received deep link: $deepLink');
        // 根据deepLink的值导航到特定页面
        // Navigator.pushNamed(context, '/someRoute', arguments: deepLink);
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Deep Link Example'),
      ),
      body: Center(
        child: Text('Check console for deep links'),
      ),
    );
  }
}

在这个示例中，我们首先初始化了FlutterDeepLinking，然后检索应用启动时是否有深度链接被触发。如果有，我们打印出深度链接并进行相应处理（例如，导航到特定页面）。同时，我们还设置了一个监听器来监听未来的深度链接。

请注意，这个示例代码是基于假设你已经熟悉Flutter的基本结构和导航。根据你的具体需求，你可能需要调整代码来处理不同的深度链接路径或参数。