/
main.dart
85 lines (80 loc) · 2.65 KB
/
main.dart
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
import 'package:flutter/material.dart';
import 'dart:ui' as ui;
// ignore: avoid_web_libraries_in_flutter
import 'dart:html';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
// platformViewRegistryはAndroid Studioで赤くなるがビルドはできる
ui.platformViewRegistry.registerViewFactory('videoView', (int viewId) {
// ここはWebのJavaScriptの世界
// videoタグとエラー表示のためのspanタグを重ねて表示するためのdiv要素
final div = DivElement();
div.style.position = 'relative';
// エラーメッセージ表示spanタグ
final span = SpanElement();
span.style.position = 'absolute';
span.style.color = '#ff1744';
span.style.fontSize = '20px';
span.style.left = '16px';
span.style.top = '16px';
// HTMLのvideoタグ
final video = VideoElement();
video.width = 1920;
video.height = 1080;
video.style.backgroundColor = '#000';
video.style.width = '100%';
video.style.height = '100%';
// ソースが設定されたら自動再生
video.autoplay = true;
// Webカメラを要求する
window.navigator.getUserMedia(video: true).then((stream) {
// Webカメラへの接続が成功
video.srcObject = stream;
}).catchError((error) {
// Webカメラに接続出来ないケース
if(error is DomException) {
if(error.name == 'NotFoundError')
span.innerText = 'カメラがありません';
else if(error.name == 'NotAllowedError')
span.innerText = 'カメラが許可されていません';
else
span.innerText = '未知のエラーです';
}
});
div.append(video);
div.append(span);
return div;
});
return MaterialApp(
title: 'Web Camera Test',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Web Camera Test'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
// ui.platformViewRegistry.registerViewFactoryメソッド呼び出しの
// viewType引数と合わせる
body: HtmlElementView(viewType: 'videoView'),
);
}
}