IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 移动开发 -> flutter学习之权限申请相关,选择本地图片,视频,拍照 -> 正文阅读

[移动开发]flutter学习之权限申请相关,选择本地图片,视频,拍照

flutter学习之权限申请相关,选择本地图片,视频,拍照

在flutter中权限申请和拍照视频都是依赖一些库实现。
相关的库如下:

#  获取设备信息
  device_info_plus: ^2.1.0
#动态权限申请
  permission_handler: ^8.1.4+2
#选择相册
  image_picker: ^0.8.3+2
#  视频播放
  video_player: ^2.1.12
  chewie: ^1.2.2

可以自己在https://pub.flutter-io.cn/上面搜索该库,查看使用方法



一、获取设备信息

device_info_plus是一个获取设备信息的库,支持Android iOS MacOS Web Linux Windows这几个平台,是Flutter 团队开发的。

import 'package:device_info_plus/device_info_plus.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_view_demo/res/ShowToast.dart';
import 'package:fluttertoast/fluttertoast.dart';

class TesttwentYThree extends StatefulWidget {
  const TesttwentYThree({Key? key}) : super(key: key);

  @override
  _TesttwentYThreeState createState() => _TesttwentYThreeState();
}

class _TesttwentYThreeState extends State<TesttwentYThree> {

  late AndroidDeviceInfo androidInfo;

  @override
  void initState() {
    super.initState();
    _getDevice();
  }

  _getDevice() async{
    DeviceInfoPlugin deviceInfo = DeviceInfoPlugin();
    androidInfo = await deviceInfo.androidInfo;
    print('Running on ${androidInfo.model}');  // e.g. "Moto G (4)"
}

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("获取设备信息"),),
      body: ListView(
          children: [
            ListTile(
              title: Text("version"),
              onTap: (){
                showToast("${androidInfo.version}");
              },
            ),
            ListTile(
              title: Text("board"),
              onTap: (){
                showToast("${androidInfo.board}");
              },
            ),
            ListTile(
              title: Text("bootloader"),
              onTap: (){
                showToast("${androidInfo.bootloader}");
              },
            ),
            ListTile(
              title: Text("brand"),
              onTap: (){
                showToast("${androidInfo.brand}");
              },
            ),
            ListTile(
              title: Text("device"),
              onTap: (){
                showToast("${androidInfo.device}");
              },
            ),
            ListTile(
              title: Text("fingerprint"),
              onTap: (){
                showToast("${androidInfo.fingerprint}");
              },
            ),
            ListTile(
              title: Text("display"),
              onTap: (){
                showToast("${androidInfo.display}");
              },
            ),
            ListTile(
              title: Text("hardware"),
              onTap: (){
                showToast("${androidInfo.hardware}");
              },
            ),
            ListTile(
              title: Text("host"),
              onTap: (){
                showToast("${androidInfo.host}");
              },
            ),
            ListTile(
              title: Text("id"),
              onTap: (){
                showToast("${androidInfo.id}");
              },
            ),ListTile(
              title: Text("manufacturer"),
              onTap: (){
                showToast("${androidInfo.manufacturer}");
              },
            ),ListTile(
              title: Text("model"),
              onTap: (){
                showToast("${androidInfo.model}");
              },
            ),ListTile(
              title: Text("product"),
              onTap: (){
                showToast("${androidInfo.product}");
              },
            ),ListTile(
              title: Text("tags"),
              onTap: (){
                showToast("${androidInfo.tags}");
              },
            ),ListTile(
              title: Text("type"),
              onTap: (){
                showToast("${androidInfo.type}");
              },
            ),ListTile(
              title: Text("isPhysicalDevice"),
              onTap: (){
                showToast("${androidInfo.isPhysicalDevice}");
              },
            ),ListTile(
              title: Text("androidId"),
              onTap: (){
                showToast("${androidInfo.androidId}");
              },
            ),
          ],
      ),
    );
  }
}

二、动态权限申请

三方库地址:https://pub.flutter-io.cn/packages/permission_handler

用之前Android和IOS都需要在对应工程下做相关配置:
Android:
1.将以下内容添加到您的“gradle.properties”文件中:

android.useAndroidX=true
android.enableJetifier=true

2.确保compileSdkVersion将“android/app/build.gradle”文件中的 设置为 30:
在app下build.gradle文件里

android {
  compileSdkVersion 30
  ...
}

IOS:请查看官方文档

批量申请权限:

  /**
   * 批量申请权限
   */
  void requestAllPermission() async{
    if (await Permission.contacts.request().isGranted) {
      // Either the permission was already granted before or the user just granted it.
    }

// You can request multiple permissions at once.
    Map<Permission, PermissionStatus> statuses = await [
      Permission.location,
      Permission.storage,
      Permission.camera,
    ].request();
    print(statuses[Permission.location]);
  }

运行是单个权限申请

  Future<bool> requestCalendarPermission() async {
    //获取当前的权限
    var status = await Permission.phone.status;
    if (status == PermissionStatus.granted) {
//已经授权
      return true;
    } else {
      //未授权则发起一次申请
      status = await Permission.phone.request();
      if (status == PermissionStatus.granted) {
        return true;
      } else {
        return false;
      }
    }
  }
}

整体代码查看:

import 'package:flutter_view_demo/res/ShowToast.dart';
import 'package:permission_handler/permission_handler.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class TesttwentYFour extends StatefulWidget {
  const TesttwentYFour({Key? key}) : super(key: key);

  @override
  _TesttwentYFourState createState() => _TesttwentYFourState();
}

class _TesttwentYFourState extends State<TesttwentYFour> {
  @override
  void initState() {
    super.initState();
//   批量申请权限
    requestAllPermission();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("权限申请"),
      ),
      body: ListView(
        children: [
          ListTile(
            title: Text("动态申请定位权限"),
            onTap: (){
              requestPermission(0);
            },
          ),
          ListTile(
            title: Text("动态申请相机权限"),
            onTap: (){
              requestPermission(1);
            },
          ),
          ListTile(
            title: Text("动态申请存储权限"),
            onTap: (){
              requestPermission(2);
            },
          ),
          ListTile(
            title: Text("动态申请设备信息权限"),
            onTap: (){
              requestPermission(3);
            },
          ),
        ],
      ),
    );
  }

  /**
   * 批量申请权限
   */
  void requestAllPermission() async{
    if (await Permission.contacts.request().isGranted) {
      // Either the permission was already granted before or the user just granted it.
    }

// You can request multiple permissions at once.
    Map<Permission, PermissionStatus> statuses = await [
      Permission.location,
      Permission.storage,
      Permission.camera,
    ].request();
    print(statuses[Permission.location]);
  }

  void requestPermission(int type) async {
    //   申请权限
    late bool hasLocationPermission;
    if(type ==0){
      hasLocationPermission = await requestLocationPermission();
    }else if(type ==1){
      hasLocationPermission = await requestCameraPermission();
    }else if(type ==2){
      hasLocationPermission = await requestWritePermission();
    }else if(type ==3){
      hasLocationPermission = await requestCalendarPermission();
    }

    if (hasLocationPermission) {
      showToast("权限申请通过");
    } else {
      showToast("权限申请不通过");
    }
  }

  //   申请定位权限
  //   授予定位权限返回  true,    否则返回  false
  Future<bool> requestLocationPermission() async {
    //获取当前的权限
    var status = await Permission.location.status;
    if (status == PermissionStatus.granted) {
//已经授权
      return true;
    } else {
  //未授权则发起一次申请
      status = await Permission.location.request();
      if (status == PermissionStatus.granted) {
        return true;
      } else {
        return false;
      }
    }
  }

  Future<bool> requestCameraPermission() async {
    //获取当前的权限
    var status = await Permission.camera.status;
    if (status == PermissionStatus.granted) {
//已经授权
      return true;
    } else {
      //未授权则发起一次申请
      status = await Permission.camera.request();
      if (status == PermissionStatus.granted) {
        return true;
      } else {
        return false;
      }
    }
  }

  Future<bool> requestWritePermission() async {
    //获取当前的权限
    var status = await Permission.storage.status;
    if (status == PermissionStatus.granted) {
//已经授权
      return true;
    } else {
      //未授权则发起一次申请
      status = await Permission.storage.request();
      if (status == PermissionStatus.granted) {
        return true;
      } else {
        return false;
      }
    }
  }

  Future<bool> requestCalendarPermission() async {
    //获取当前的权限
    var status = await Permission.phone.status;
    if (status == PermissionStatus.granted) {
//已经授权
      return true;
    } else {
      //未授权则发起一次申请
      status = await Permission.phone.request();
      if (status == PermissionStatus.granted) {
        return true;
      } else {
        return false;
      }
    }
  }
}

三、拍照和相册

Image Picker plugin for Flutter是Flutter官方提供的一个图片选择库,里面自带动态权限申请,不需要自己再去申请权限了。主要适用于Android和IOS端,
相关方法:

import 'package:image_picker/image_picker.dart';
    ...
    final ImagePicker _picker = ImagePicker();
    // Pick an image		拍照
    final XFile? image = await _picker.pickImage(source: ImageSource.gallery);
    // Capture a photo		选择一张图片
    final XFile? photo = await _picker.pickImage(source: ImageSource.camera);
    // Pick a video		录制视频
    final XFile? image = await _picker.pickVideo(source: ImageSource.gallery);
    // Capture a video		选择一个视频
    final XFile? photo = await _picker.pickVideo(source: ImageSource.camera);
    // Pick multiple images		批量选择图片
    final List<XFile>? images = await _picker.pickMultiImage();
    ...

具体实现:

import 'dart:io';
import 'package:image_picker/image_picker.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class TesttwentYFive extends StatefulWidget {
  const TesttwentYFive({Key? key}) : super(key: key);

  @override
  _TesttwentYFiveState createState() => _TesttwentYFiveState();
}

class _TesttwentYFiveState extends State<TesttwentYFive> {

  final ImagePicker _picker = ImagePicker();
  XFile? _photo;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("相册,拍照"),),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            this._photo == null?Text("请选择图片"):Image.file(File(_photo!.path)),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [

                ElevatedButton(onPressed: (){
                  // requestPermission(0);
                  _takePhoto();
                }, child: Text("拍照")),
                SizedBox(width: 10,),
                ElevatedButton(onPressed: (){
                  // requestPermission(0);
                  _galleryPhoto();
                }, child: Text("相册")),
                SizedBox(width: 10,),
                ElevatedButton(onPressed: (){
                  // requestPermission(0);
                  _choicePhoto();
                }, child: Text("相册多选")),
              ],
            )
          ],
        ),
      ),
    );
  }
  
  _takePhoto() async{
    XFile? photo = await _picker.pickImage(source: ImageSource.camera,maxWidth: 400,maxHeight: 400);
    if(photo != null){
      setState(() {
        this._photo = photo;
      });
    }
  }

  _galleryPhoto() async{
    XFile? photo = await _picker.pickImage(source: ImageSource.gallery,maxWidth: 400,maxHeight: 400);
    if(photo != null){
      setState(() {
        this._photo = photo;
      });
    }
  }

  _choicePhoto() async{
    // Pick multiple images
    final List<XFile>? images = await _picker.pickMultiImage();
  }
}

四、视频播放

video_player是flutter官方提供的一个视频播放库,支持ANDROID IOS WEB,但是只有播放功能,所以的需求功能都需要扩展,所以需要搭配其他的库一起使用。
chewie是一个video_player的播放扩展库。三方库地址:
video_player:https://pub.flutter-io.cn/packages/video_player/install
chewie:https://pub.flutter-io.cn/packages/chewie

1.加载网络视频

class NetVideoPlayer extends StatefulWidget {
  const NetVideoPlayer({Key? key}) : super(key: key);

  @override
  _NetVideoPlayerState createState() => _NetVideoPlayerState();
}

class _NetVideoPlayerState extends State<NetVideoPlayer> {
  late VideoPlayerController videoPlayerController;
  late ChewieController chewieController;

  @override
  initState() {
    super.initState();
    _initVideo();
  }
  //初始化播放状态
  _initVideo() async {
    videoPlayerController = VideoPlayerController.network(
        'https://vfx.mtime.cn/Video/2019/02/04/mp4/190204084208765161.mp4');
//    await videoPlayerController.initialize();
    chewieController = ChewieController(
      videoPlayerController: videoPlayerController,
      autoPlay: true,
      looping: true,
    );
  }

  @override
  void dispose() {
    //页面关闭的时候销毁
    videoPlayerController.dispose();
    chewieController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("网络视频播放"),
      ),
      body: Center(
        child: Chewie(
          controller: chewieController,
        ),
      ),
    );
  }
}

2.加载本地视频

获取本地视频。获取成功跳转播放视频页

  final ImagePicker _picker = ImagePicker();

  _getVideo() async{
    final XFile? image = await _picker.pickVideo(source: ImageSource.gallery);
    if(image != null){
      String videoPath = image.path;
      Navigator.pushNamed(context, "/LocationVideoPlay",arguments: {
        "videoPath":videoPath
      });
    }
  }

class LocationVideoPlay extends StatefulWidget {
  var arguments;

  LocationVideoPlay({Key? key,this.arguments}) : super(key: key);

  @override
  _LocationVideoPlayState createState() => _LocationVideoPlayState(this.arguments);
}

class _LocationVideoPlayState extends State<LocationVideoPlay> {
  var arguments;
  _LocationVideoPlayState(this.arguments);

  late VideoPlayerController videoPlayerController;
  late ChewieController chewieController;

  @override
  initState() {
    super.initState();
    _initVideo();
  }
  //初始化播放状态
  _initVideo() async {
    videoPlayerController = VideoPlayerController.file(File(arguments["videoPath"]));
//    await videoPlayerController.initialize();
    chewieController = ChewieController(
      videoPlayerController: videoPlayerController,
      autoPlay: true,
      looping: true,
    );
  }

  @override
  void dispose() {
    //页面关闭的时候销毁
    videoPlayerController.dispose();
    chewieController.dispose();
    super.dispose();
  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("本地视频播放"),),
      body: Center(
        child: Chewie(
          controller: chewieController,
        ),
      ),
    );
  }
}


总结

  移动开发 最新文章
Vue3装载axios和element-ui
android adb cmd
【xcode】Xcode常用快捷键与技巧
Android开发中的线程池使用
Java 和 Android 的 Base64
Android 测试文字编码格式
微信小程序支付
安卓权限记录
知乎之自动养号
【Android Jetpack】DataStore
上一篇文章      下一篇文章      查看所有文章
加:2021-08-11 12:31:59  更:2021-08-11 12:34:20 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年5日历 -2024/5/19 3:40:39-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码