如何在flutter app中创建视频通话功能

Question

我想在我的 app.Can 中创建视频通话功能，您对 flutter 应用中的视频通话功能有什么建议吗？

Answer 1

import 'package:flutter/material.dart';
import 'package:agora_rtc_engine/rtc_engine.dart';
import 'package:permission_handler/permission_handler.dart';

import './video_call.dart';

class HomePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => IndexState();
}

class IndexState extends State<HomePage> {
  final _channelController = TextEditingController();
  bool _validateError = false;

  ClientRole _role = ClientRole.Broadcaster;

  @override
  void dispose() {
    _channelController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        automaticallyImplyLeading: false,
        title: Text('Flutter Video Call Demo'),
        centerTitle: true,
      ),
      body: Center(
        child: Container(
          padding: const EdgeInsets.symmetric(horizontal: 20),
          height: 400,
          child: Column(
            children: <Widget>[
              Row(
                children: <Widget>[
                  Expanded(
                      child: TextField(
                    controller: _channelController,
                    decoration: InputDecoration(
                      errorText:
                          _validateError ? 'Channel name is mandatory' : null,
                      border: UnderlineInputBorder(
                        borderSide: BorderSide(width: 1),
                      ),
                      hintText: 'Channel name',
                    ),
                  ))
                ],
              ),
              Column(
                children: [
                  ListTile(
                    title: Text(ClientRole.Broadcaster.toString()),
                    leading: Radio(
                      value: ClientRole.Broadcaster,
                      groupValue: _role,
                      onChanged: (ClientRole value) {
                        setState(() {
                          _role = value;
                        });
                      },
                    ),
                  ),
                  ListTile(
                    title: Text(ClientRole.Audience.toString()),
                    leading: Radio(
                      value: ClientRole.Audience,
                      groupValue: _role,
                      onChanged: (ClientRole value) {
                        setState(() {
                          _role = value;
                        });
                      },
                    ),
                  )
                ],
              ),
              Padding(
                padding: const EdgeInsets.symmetric(vertical: 20),
                child: Row(
                  children: <Widget>[
                    Expanded(
                      child: RaisedButton(
                        onPressed: onJoin,
                        child: Text('Join'),
                        color: Colors.blueAccent,
                        textColor: Colors.white,
                      ),
                    )
                  ],
                ),
              )
            ],
          ),
        ),
      ),
    );
  }

  Future<void> onJoin() async {
    // update input validation
    setState(() {
      _channelController.text.isEmpty
          ? _validateError = true
          : _validateError = false;
    });
    if (_channelController.text.isNotEmpty) {
      await _handleCameraAndMic(Permission.camera);
      await _handleCameraAndMic(Permission.microphone);
      await Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) => VideoCall(
            channelName: _channelController.text,
            role: _role,
          ),
        ),
      );
    }
  }

  Future<void> _handleCameraAndMic(Permission permission) async {
    final status = await permission.request();
    print(status);
  }
}

Answer 2

使用这个插件

Jitsi_meet

加入会议使用

_joinMeeting() async {
try {
  FeatureFlag featureFlag = FeatureFlag();
  featureFlag.welcomePageEnabled = false;
  featureFlag.resolution = FeatureFlagVideoResolution.MD_RESOLUTION; // Limit video resolution to 360p
  
  var options = JitsiMeetingOptions()
    ..room = "myroom" // Required, spaces will be trimmed
    ..serverURL = "https://someHost.com"
    ..subject = "Meeting with Gunschu"
    ..userDisplayName = "My Name"
    ..userEmail = "myemail@email.com"
    ..userAvatarURL = "https://someimageurl.com/image.jpg" // or .png
    ..audioOnly = true
    ..audioMuted = true
    ..videoMuted = true
    ..featureFlag = featureFlag;

  await JitsiMeet.joinMeeting(options);
} catch (error) {
  debugPrint("error: $error");
}
}

plug-in 是开源的，在 ios 和 Android 上运行良好。

Answer 3

使用 Meet hour 插件。根据插件描述，它提供了一个免费的视频会议解决方案，具有端到端加密和许多其他功能，例如大厅模式、捐助箱和用于筹款的 Click&Pledge 连接、视频通话录音、Youtube 直播等。

如何在flutter app中创建视频通话功能

How to create Video call function in flutter app

firebase

flutter

videocall