flutter 拍照、选择相机image_picker

傅丁雷
2023-12-01

实现相机拍照和相册选择

1.首先在pubspec.yaml文件中新增依赖

image_picker: ^0.8.6

2.在Android的AndroidManifest.xml文件里面添加权限

<!-- 在application标签后添加权限设置 -->
<uses-permission android:name="android.permission.CAMERA" />

3.在ios的Info.plist文件里面添加权限 项目根目录/ios/Runner/Info.plist

    <key>NSCameraUsageDescription</key>
    <string>这是你的自拍照</string>
    <key>NSMicrophoneUsageDescription</key>
    <string>用于音频插件</string>
    <key>NSPhotoLibraryUsageDescription</key>
    <string>用于相册选择插件</string>
    <key>UIBackgroundModes</key>
    <array>
        <string>remote-notification</string>
    </array>

4.代码实现

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
class MineImagesPage extends StatefulWidget {
  const MineImagesPage({Key? key}) : super(key: key);

  @override
  State<MineImagesPage> createState() => _MineImagesPageState();
}

class _MineImagesPageState extends State<MineImagesPage> {
  final picker = ImagePicker();
  XFile? _imageFile;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("ImagePicker"),
      ),
      body: Center(
        child: Column(
          children: [
            ElevatedButton(onPressed: showPicker, child: const Text("底部弹出选择")),
            ElevatedButton(onPressed: _takePhoto, child: const Text("拍照")),
            ElevatedButton(onPressed: _openGallery, child: const Text("打开相册")),
            this._imageFile == null
                ? Text("请选择图片")
                : Image.file(File(_imageFile!.path))
          ],
        ),
      ),
    );
  }

  //弹出选择相册/拍照对话框
  showPicker() {
    //底部弹出
    showModalBottomSheet(
        context: context,
        builder: (BuildContext con) => Container(
          height: 160,
          padding: EdgeInsets.all(20),
          color: Colors.white,
          child: Expanded(
            child: Column(
              children: [
                GestureDetector(
                  onTap: ((){
                    _takePhoto();
                  }),
                  child: Container(
                    width: double.infinity,
                    height: 50,
                    alignment: Alignment.center,
                    child: Text('拍照'),
                  ),
                ),
                GestureDetector(
                  onTap: ((){
                    _openGallery();
                  }),
                  child: Container(
                    width: double.infinity,
                    height: 50,
                    alignment: Alignment.center,
                    child: Text('相册'),
                  ),
                )
              ],
            ),
          ),
        ));
  }

  //拍照
  _takePhoto() async {
    XFile? pickedFile = await picker.pickImage(
        source: ImageSource.camera, maxHeight: 600, maxWidth: 600);

    if (pickedFile != null) {
      print(pickedFile.path);
      print(File(pickedFile.path));
      setState(() {
        _imageFile = pickedFile;
      });
    }
  }
  //打开文件夹
  _openGallery() async {
    XFile? pickedFile = await picker.pickImage(
        source: ImageSource.gallery, maxHeight: 600, maxWidth: 600);

    if (pickedFile != null) {
      print(pickedFile.path);
      print(File(pickedFile.path));
      setState(() {
        _imageFile = pickedFile;
      });
    }
  }


}

 

 类似资料: