Webcam只在我锁定和解锁智能手机时才能正常工作。

huangapple go评论127阅读模式
英文:

Webcam only works when I lock and unlock smartphone

问题

  1. 我正在使用Flutter在[flutter_webrtc](https://pub.dev/packages/flutter_webrtc)插件上做一个简单的演示应用,遵循[这个](https://www.100ms.live/blog/flutter-webrtc#resources)教程。当我在Chrome上测试时,一切正常,在模拟器上相机图像从未显示,当我在我的Android智能手机上测试时,只有在我锁定(电源按钮)并解锁(再次按电源按钮)设备时相机图像才会出现。
  2. 我使用的是Windows 11Android Studio 2022.1.1 Patch 1Flutter 3.7.5Dart 2.19.1 OpenJDK 19.0.2flutter_webrtc 0.9.23
  3. 现在我的代码如下:
  4. ```dart
  5. import 'package:flutter/material.dart';
  6. import 'package:flutter_webrtc/flutter_webrtc.dart';
  7. void main() {
  8. runApp(const MyApp());
  9. }
  10. class MyApp extends StatelessWidget {
  11. const MyApp({super.key});
  12. @override
  13. Widget build(BuildContext context) {
  14. return MaterialApp(
  15. title: 'Flutter Demo',
  16. theme: ThemeData(
  17. primarySwatch: Colors.blue,
  18. ),
  19. home: MyHomePage(title: 'Flutter Demo Home Page'),
  20. );
  21. }
  22. }
  23. class MyHomePage extends StatefulWidget {
  24. MyHomePage({super.key, required this.title});
  25. final String title;
  26. @override
  27. State<MyHomePage> createState() => _MyHomePageState();
  28. }
  29. class _MyHomePageState extends State<MyHomePage> {
  30. final _localVideoRenderer = RTCVideoRenderer();
  31. void initRenderers() async {
  32. await _localVideoRenderer.initialize();
  33. }
  34. _getUserMedia() async {
  35. final Map<String, dynamic> mediaConstraints = {
  36. 'audio': true,
  37. 'video': true,
  38. };
  39. MediaStream stream =
  40. await navigator.mediaDevices.getUserMedia(mediaConstraints);
  41. _localVideoRenderer.srcObject = stream;
  42. _localVideoRenderer.srcObject = stream;
  43. return stream;
  44. }
  45. @override
  46. void initState() {
  47. initRenderers();
  48. _getUserMedia();
  49. super.initState();
  50. }
  51. @override
  52. void dispose() async {
  53. await _localVideoRenderer.dispose();
  54. super.dispose();
  55. }
  56. @override
  57. Widget build(BuildContext context) {
  58. final ButtonStyle style =
  59. ElevatedButton.styleFrom(textStyle: const TextStyle(fontSize: 20));
  60. return Scaffold(
  61. appBar: AppBar(
  62. title: Text(widget.title),
  63. ),
  64. body: Stack(
  65. children: [
  66. Positioned(
  67. top: 0.0,
  68. right: 0.0,
  69. left: 0.0,
  70. bottom: 0.0,
  71. child: RTCVideoView(_localVideoRenderer))
  72. ],
  73. ),
  74. );
  75. }
  76. }
英文:

I'm doing a simple demo app in Flutter using the flutter_webrtc plugin following this tutorial. When I test using Chrome its works just fine, in emulator the camera image never shows, and when I test on my Android smartphone the camera image only appears when I lock (power button) and unlock (power button again) the device.

I am using Windows 11, Android Studio 2022.1.1 Patch 1, Flutter 3.7.5, Dart 2.19.1 OpenJDK 19.0.2 and flutter_webrtc 0.9.23.

Right now my code is the following:

  1. import &#39;package:flutter/material.dart&#39;;
  2. import &#39;package:flutter_webrtc/flutter_webrtc.dart&#39;;
  3. void main() {
  4. runApp(const MyApp());
  5. }
  6. class MyApp extends StatelessWidget {
  7. const MyApp({super.key});
  8. // This widget is the root of your application.
  9. @override
  10. Widget build(BuildContext context) {
  11. return MaterialApp(
  12. title: &#39;Flutter Demo&#39;,
  13. theme: ThemeData(
  14. primarySwatch: Colors.blue,
  15. ),
  16. home: MyHomePage(title: &#39;Flutter Demo Home Page&#39;),
  17. );
  18. }
  19. }
  20. class MyHomePage extends StatefulWidget {
  21. MyHomePage({super.key, required this.title});
  22. final String title;
  23. @override
  24. State&lt;MyHomePage&gt; createState() =&gt; _MyHomePageState();
  25. }
  26. class _MyHomePageState extends State&lt;MyHomePage&gt; {
  27. final _localVideoRenderer = RTCVideoRenderer();
  28. void initRenderers() async {
  29. await _localVideoRenderer.initialize();
  30. }
  31. _getUserMedia() async {
  32. final Map&lt;String, dynamic&gt; mediaConstraints = {
  33. &#39;audio&#39;: true,
  34. &#39;video&#39;: true,
  35. };
  36. MediaStream stream =
  37. await navigator.mediaDevices.getUserMedia(mediaConstraints);
  38. _localVideoRenderer.srcObject = stream;
  39. _localVideoRenderer.srcObject = stream;
  40. return stream;
  41. }
  42. @override
  43. void initState() {
  44. initRenderers();
  45. _getUserMedia();
  46. super.initState();
  47. }
  48. @override
  49. void dispose() async {
  50. await _localVideoRenderer.dispose();
  51. super.dispose();
  52. }
  53. @override
  54. Widget build(BuildContext context) {
  55. final ButtonStyle style =
  56. ElevatedButton.styleFrom(textStyle: const TextStyle(fontSize: 20));
  57. return Scaffold(
  58. appBar: AppBar(
  59. title: Text(widget.title),
  60. ),
  61. body: Stack(
  62. children: [
  63. Positioned(
  64. top: 0.0,
  65. right: 0.0,
  66. left: 0.0,
  67. bottom: 0.0,
  68. child: RTCVideoView(_localVideoRenderer))
  69. ],
  70. ),
  71. );
  72. }
  73. }

I already tried to test on multiple platforms, already tried to invoke the method to show the camera image on a button and aready tried to use another tutorials.

答案1

得分: 0

这似乎与Flutter状态管理有关,我添加了:

  1. setState(() {
  2. });

srcObject = stream 之后,它就起作用了!

英文:

This seems to be related to flutter state management, I added:

  1. setState(() {
  2. });

After srcObject = stream and it works!

huangapple
  • 本文由 发表于 2023年2月24日 05:31:44
  • 转载请务必保留本文链接:https://go.coder-hub.com/75550521.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定