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

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

Webcam only works when I lock and unlock smartphone

问题

我正在使用Flutter在[flutter_webrtc](https://pub.dev/packages/flutter_webrtc)插件上做一个简单的演示应用,遵循[这个](https://www.100ms.live/blog/flutter-webrtc#resources)教程。当我在Chrome上测试时,一切正常,在模拟器上相机图像从未显示,当我在我的Android智能手机上测试时,只有在我锁定(电源按钮)并解锁(再次按电源按钮)设备时相机图像才会出现。

我使用的是Windows 11Android Studio 2022.1.1 Patch 1Flutter 3.7.5Dart 2.19.1 OpenJDK 19.0.2flutter_webrtc 0.9.23

现在我的代码如下:

```dart
import 'package:flutter/material.dart';
import 'package:flutter_webrtc/flutter_webrtc.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final _localVideoRenderer = RTCVideoRenderer();

  void initRenderers() async {
    await _localVideoRenderer.initialize();
  }

  _getUserMedia() async {
    final Map<String, dynamic> mediaConstraints = {
      'audio': true,
      'video': true,
    };

    MediaStream stream =
    await navigator.mediaDevices.getUserMedia(mediaConstraints);
    _localVideoRenderer.srcObject = stream;

    _localVideoRenderer.srcObject = stream;
    return stream;
  }

  @override
  void initState() {
    initRenderers();
    _getUserMedia();
    super.initState();
  }

  @override
  void dispose() async {
    await _localVideoRenderer.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final ButtonStyle style =
    ElevatedButton.styleFrom(textStyle: const TextStyle(fontSize: 20));

    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Stack(
        children: [
          Positioned(
              top: 0.0,
              right: 0.0,
              left: 0.0,
              bottom: 0.0,
              child: RTCVideoView(_localVideoRenderer))
        ],
      ),
    );
  }
}
英文:

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:

import &#39;package:flutter/material.dart&#39;;
import &#39;package:flutter_webrtc/flutter_webrtc.dart&#39;;
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: &#39;Flutter Demo&#39;,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: &#39;Flutter Demo Home Page&#39;),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({super.key, required this.title});
final String title;
@override
State&lt;MyHomePage&gt; createState() =&gt; _MyHomePageState();
}
class _MyHomePageState extends State&lt;MyHomePage&gt; {
final _localVideoRenderer = RTCVideoRenderer();
void initRenderers() async {
await _localVideoRenderer.initialize();
}
_getUserMedia() async {
final Map&lt;String, dynamic&gt; mediaConstraints = {
&#39;audio&#39;: true,
&#39;video&#39;: true,
};
MediaStream stream =
await navigator.mediaDevices.getUserMedia(mediaConstraints);
_localVideoRenderer.srcObject = stream;
_localVideoRenderer.srcObject = stream;
return stream;
}
@override
void initState() {
initRenderers();
_getUserMedia();
super.initState();
}
@override
void dispose() async {
await _localVideoRenderer.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
final ButtonStyle style =
ElevatedButton.styleFrom(textStyle: const TextStyle(fontSize: 20));
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Stack(
children: [
Positioned(
top: 0.0,
right: 0.0,
left: 0.0,
bottom: 0.0,
child: RTCVideoView(_localVideoRenderer))
],
),
);
}
}

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状态管理有关,我添加了:

setState(() {
});

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

英文:

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

setState(() {
});

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:

确定