Flutter页面跳转管理插件flutter_pagecall的使用

本文档将介绍如何使用flutter_pagecall插件进行页面跳转管理。flutter_pagecall是由Pagecall Inc.开发并维护的官方SDK。

安装

在你的pubspec.yaml文件的dependencies:部分添加以下行：

dependencies:
  flutter_pagecall: <latest_version>

对于Android构建，你需要在Github上生成一个具有read:packages范围的访问令牌，然后设置环境变量GITHUB_USERNAME和GITHUB_TOKEN，或者在运行应用时将其作为属性添加到Android根项目中：

GITHUB_USERNAME=<username> GITHUB_TOKEN=<token> flutter run  # 当以命令方式运行时

对于iOS构建，在你的iOS工作区的Info.plist文件中，确保设置了NSMicrophoneUsageDescription。此外，还需要启用以下UIBackgroundModes：audio、fetch、voip。

使用

你可以通过检查以下Dart代码或查看此存储库中的example目录来了解如何使用flutter_pagecall。

PagecallViewController? _pagecallViewController;

// 在你的Flutter页面中使用PagecallView
Expanded(
  child: PagecallView(
    mode: "meet",
    roomId: "<room id>",
    accessToken: "<access token>",
    onViewCreated: (controller) {
      _pagecallViewController = controller;
    },
    onLoaded: () {
      debugPrint('onLoaded');
    },
    onMessage: (message) {
      debugPrint('Received message=$message');
    },
    onTerminated: (reason) {
      debugPrint('onTerminated');
    },
    onError: (error) {
      debugPrint('onError');
    },
    debuggable: true,
  ),
),

// 发送消息
_pagecallViewController?.sendMessage(message);

Android键事件处理

为了处理Android上的键事件，你需要在MainActivity.kt中覆盖onKeyDown函数：

override fun onKeyDown(keyCode: Int, event: KeyEvent?): Boolean {
    for (instance in FlutterPagecallView.instances) {
        instance.handleKeyDownEvent(keyCode, event)
    }
    return super.onKeyDown(keyCode, event)
}

你可以参考示例应用中的MainActivity.kt获取更多详细信息。

兼容性

以下是Pagecall Flutter SDK版本的最低支持矩阵：

需要帮助？

访问Pagecall 获取更多帮助。

示例代码

以下是完整的示例代码，展示了如何使用flutter_pagecall插件。

import 'package:flutter/material.dart';
import 'package:flutter_pagecall/flutter_pagecall.dart';
import 'package:fluttertoast/fluttertoast.dart';

void main() => runApp(const MyApp());

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Text Transfer',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const FirstScreen(),
    );
  }
}

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

  [@override](/user/override)
  State<FirstScreen> createState() => _FirstScreenState();
}

class _FirstScreenState extends State<FirstScreen> {
  TextEditingController roomIdFieldController = TextEditingController();
  TextEditingController accessTokenFieldController = TextEditingController();
  TextEditingController queryParamsFieldController = TextEditingController();

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Room Setting'),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Column(
            children: [
              TextField(
                controller: roomIdFieldController,
                decoration: const InputDecoration(
                  contentPadding: EdgeInsets.all(8.0),
                  hintText: 'Enter Room Id',
                ),
              ),
              TextField(
                controller: accessTokenFieldController,
                decoration: const InputDecoration(
                  contentPadding: EdgeInsets.all(8.0),
                  hintText: 'Enter Access Token',
                ),
              ),
              TextField(
                controller: queryParamsFieldController,
                decoration: const InputDecoration(
                  contentPadding: EdgeInsets.all(8.0),
                  hintText: 'Enter Query Params (Optional, a=1&b=2&c=3)',
                ),
              ),
            ],
          ),
          ElevatedButton(
            child: const Text('Enter Room'),
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => SecondScreen(
                    roomId: '67283611bbfb315ccfd97668',
                    accessToken: '_nzFIakILgEhF57XMN5rwkBYBA-kmfxo',
                    queryParams: 'chime=0'
                  ),
                ),
              );
            },
          ),
        ],
      ),
    );
  }
}

class SecondScreen extends StatefulWidget {
  final String roomId;
  final String accessToken;
  final String queryParams;

  const SecondScreen(
      {super.key,
      required this.roomId,
      this.accessToken = '',
      this.queryParams = ''});

  [@override](/user/override)
  State<SecondScreen> createState() => _SecondScreenState();
}

class _SecondScreenState extends State<SecondScreen> {
  final TextEditingController messageFieldController = TextEditingController();

  PagecallViewController? pagecallViewController;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Pagecall Room'),
      ),
      body: Column(
        children: [
          TextField(
            controller: messageFieldController,
            decoration: const InputDecoration(
              contentPadding: EdgeInsets.all(8.0),
              hintText: "Submit to invoke sendMessage",
            ),
            keyboardType: TextInputType.text,
            onSubmitted: _invokeSendMessage,
          ),
          Expanded(
            child: PagecallView(
              mode: "meet",
              roomId: widget.roomId,
              accessToken: widget.accessToken,
              queryParams: widget.queryParams,
              onViewCreated: (controller) {
                pagecallViewController = controller;
              },
              onMessage: (message) {
                debugPrint('Received message=$message');
                Fluttertoast.showToast(msg: 'Message from Native: $message');
              },
              onLoaded: () {
                debugPrint('Pagecall loaded');
                Fluttertoast.showToast(msg: 'Pagecall loaded');
              },
              onTerminated: (reason) {
                debugPrint('Pagecall terminated: $reason');
                Fluttertoast.showToast(msg: 'Pagecall terminated: $reason');
              },
              onError: (error) {
                debugPrint('Pagecall error: $error');
                Fluttertoast.showToast(msg: 'Pagecall error: $error');
              },
              debuggable: true,
            ),
          ),
        ],
      ),
    );
  }

  void _invokeSendMessage(String message) {
    debugPrint('invoking with message=$message');

    pagecallViewController?.sendMessage(message);
    messageFieldController.clear();
  }
}