flutter 调用摄像头,前后镜头切换
flutter 调用 切换 前后 摄像头 镜头
2023-09-14 09:04:28 时间
参考
直播开播前的镜头调试,单纯的显示摄像头的内容
添加插件
camera: ^0.9.7+1
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:camera/camera.dart';
List<CameraDescription> cameras;
Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
cameras = await availableCameras();
runApp(CameraApp());
}
class CameraApp extends StatefulWidget {
@override
_CameraAppState createState() => _CameraAppState();
}
class _CameraAppState extends State<CameraApp> {
CameraController controller;
@override
void initState() {
super.initState();
controller = CameraController(cameras[0], ResolutionPreset.medium);
controller.initialize().then((_) {
if (!mounted) {
return;
}
setState(() {});
});
}
@override
void dispose() {
controller?.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
if (!controller.value.isInitialized) {
return Container();
}
return AspectRatio(
aspectRatio:
controller.value.aspectRatio,
child: CameraPreview(controller));
}
}
我自己的代码,直播开播前的镜头调试,单纯的显示摄像头的内容
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:camera/camera.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:permission_handler/permission_handler.dart';
import '../../common/Global.dart';
import '../../common/backgroundWall.dart';
import '../../router.dart';
//开播页
class StartCameraSeeding extends StatefulWidget {
@override
StartCameraSeedingState createState() => StartCameraSeedingState();
}
class StartCameraSeedingState extends State<StartCameraSeeding> {
CameraController? controller;
late List<CameraDescription> cameras;
//前后摄像头设置
int frontCamera = 1;
@override
initState() {
//请求权限
if (Platform.isAndroid || Platform.isIOS) {
Permission.camera.request().then((value) async {
print('权限的值是多少${value}');
await Permission.microphone.request().then((value) {} );
});
}
super.initState();
//初始化镜头
initData().then((value) {});
}
initData() async {
cameras = await availableCameras();
controller = CameraController(cameras[frontCamera], ResolutionPreset.medium);
if (controller != null) {
controller!.initialize().then((_) {
if (!mounted) {
return;
}
mySetState(() {});
});
}
}
@override
void dispose() {
if (controller != null) {
controller!.dispose();
}
super.dispose();
}
mySetState(callBack) {
if (mounted) {
setState(() {
callBack();
});
}
}
@override
Widget build(BuildContext context) {
if (controller == null) {
return Container();
} else if (controller != null) {
if (!controller!.value.isInitialized) {
return Container();
}
}
return Material(
child: Stack(
alignment: Alignment.center,
children: [
// AspectRatio(
// aspectRatio: Global.screenWidth/Global.screenHeight,
// child: CameraPreview(controller!)),
//除以反转,就是正常的比例了,用Transform.scale放大填充满屏
Center(
child: Transform.scale(
scale: (1/controller!.value.aspectRatio)/deviceRatio,
child: AspectRatio(
aspectRatio: 1/controller!.value.aspectRatio,
child: CameraPreview(controller!)),
),
),
Column(
children: [
addHeadView(),
Container(
margin: const EdgeInsets.only(left: 20, right: 20, top: 50),
decoration: const BoxDecoration(color: Colors.transparent),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
BackgroundWall(
width: 100,
height: 100,
hasPlaceholder: true,
radius: 4.r,
avatarUrl: 'assets/images/bg_none_nearby.png',
fit: BoxFit.cover,
),
Container(
margin: const EdgeInsets.only(top: 15),
alignment: Alignment.topLeft,
child: Column(
children: const [
Text(
'请输入直播标题',
style: TextStyle(color: Colors.white, fontSize: 15),
)
],
),
)
],
),
),
Expanded(child: Container()),
Row(
children: [
Expanded(
child: GestureDetector(
onTap: (){
MyRouter.pushMyMap(context, MyRouter.directSeedingAnchor,
{"type":1});
},
child: Container(
margin: const EdgeInsets.only(left: 5, right: 5, bottom: 10),
padding: const EdgeInsets.only(top: 10, bottom: 10),
decoration: BoxDecoration(
color: Colors.red, borderRadius: BorderRadius.circular(20)),
child: Container(
alignment: Alignment.center,
child: const Text(
'开启视频直播',
style: TextStyle(color: Colors.white, fontSize: 16),
),
),
),
),
),
GestureDetector(
onTap: (){
//前后镜头切换
if(frontCamera==1){
controller = CameraController(cameras[0], ResolutionPreset.medium);
if (controller != null) {
controller!.initialize().then((_) {
if (!mounted) {
return;
}
frontCamera=0;
mySetState((){});
});
}
}else{
controller = CameraController(cameras[1], ResolutionPreset.medium);
if (controller != null) {
controller!.initialize().then((_) {
if (!mounted) {
return;
}
frontCamera=1;
mySetState((){});
});
}
}
},
child: Container(
margin: const EdgeInsets.only(left: 5, right: 10, bottom: 10),
padding: const EdgeInsets.only(top: 10, bottom: 10),
child: const Image(
image: AssetImage('assets/images/bg_none_nearby.png'),
width: 35,
height: 35,
),
),
)
],
)
],
),
],
),
);
}
Widget addHeadView() {
return Container(
padding: EdgeInsets.only(top: Global.topHeight + 11.r, bottom: 20.r),
child: Row(children: [
GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Container(
margin: EdgeInsets.only(left: 15.r, right: 12.r),
child: const Image(
image: AssetImage('assets/images/icon_back@2x.png'),
width: 24,
height: 24,
color: Colors.white,
),
),
),
]));
}
}
相关文章
- 【Flutter&Flame 游戏 - 贰肆】pinball 源码分析 - 项目结构介绍.md
- Flutter 绘制探索 | 来一起画箭头吧
- flutter-如何实现类型微信分享的功能
- 2022-01-17: flutter weekly第3期
- Flutter 绘制探索 | 扇形区域与点击校验
- 《吐血整理》高级系列教程-吃透Fiddler抓包教程(31)-Fiddler如何抓取Android系统中Flutter应用程序的包
- Flutter混编工程之异常处理
- Flutter 多引擎渲染,在稿定 App 的实践
- flutter系列之:flutter中listview的高级用法
- Flutter 绘制探索 | 操作坐标系范围
- 【错误记录】Flutter 设备连接显示 Loading... ( 断网 | 删除 flutter/bin/cache/lockfile 文件 )
- 【Flutter】Dart 面向对象 ( 抽象类 | 抽象方法 )
- 【Flutter】StatelessWidget 组件 ( CloseButton 组件 | BackButton 组件 | Chip 组件 )
- 【Flutter】Flutter 布局组件 ( 布局组件简介 | Row 组件 | Column 组件 | SizedBox 组件 | ClipOval 组件 )
- 【错误记录】Flutter 报错 ( Could not resolve io.flutter:flutter_embedding_debug:1.0.0. )
- 【Flutter】Flutter 拍照示例 ( 浮动按钮及点击事件 | 底部显示按钮组件 | 手势检测器组件 | 拍照并获取当前拍摄照片 | 从相册中选择图片 )
- 【Flutter】Flutter 照片墙 ( Center 组件 | Wrap 组件 | ClipRRect 组件 | Stack 组件 | Positioned 组件 | 按钮组合组件 )
- 【错误记录】Flutter 报错 ( Because xx depends on flutter_driver any from sdk which depends on args 1.6.0 )
- 【Flutter】Hero 动画 ( Hero 实现径向动画 | Hero 组件 createRectTween 设置 )
- 【Flutter】HTTP 网络操作 ( 引入 http 插件 | 测试网站 | Get 请求 | Post 请求 | 将响应结果转为 Dart 对象 | Future 异步调用 )
- 【Flutter】ListView 列表 ( List 集合的 map 方法说明 | 垂直列表 | 水平列表 | 代码示例 )
- 【Flutter】Flutter 混合开发 ( Flutter 与 Native 通信 | 在 Flutter 端实现 EventChannel 通信 )
- 【Flutter】自定义 Flutter 组件 ( 创建自定义 StatelessWidget、StatefulWidget 组件 | 调用自定义组件 )
- 【Flutter】屏幕像素适配方案 ( flutter_screenutil 插件 )
- Flutter 日志最佳实践