【Flutter之打开系统相册,拍照,剪裁】

准备工作

(1)添加依赖
 image_picker: ^0.6.4
 image_cropper: ^1.2.1

Android

建议添加上这些权限在清单文件下:

 <uses-permission android:name="android.permission.INTERNET"/>
 <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
  <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
  <uses-permission android:name="android.permission.CAMERA"/>

在application标签下添加:

 <activity
            android:name="com.yalantis.ucrop.UCropActivity"
            android:screenOrientation="portrait"
            android:theme="@style/Theme.AppCompat.Light.NoActionBar"/>

PS:测试发现,我们是不需要动态申请权限的,image_picker 插件都给封装进去了,使用的时候,它会自动去申请权限。

ios

需要在 Info.plist 下添加:

   <key>NSPhotoLibraryUsageDescription</key>
    <string>Example usage description</string>
    <key>NSCameraUsageDescription</key>
    <string>Example usage description</string>
	<key>CFBundleDevelopmentRegion</key>

如何使用:

这里直接上代码,关键处已做说明:

//弹出底部菜单
void _showBottomMenu(BuildContext context) {
    showModalBottomSheet(
        context: context,
        //isScrollControlled: true,//设为true,此时为全屏展示

        builder: (BuildContext context) {
          return Container(
            color: Colors.white,
            height: 180,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                ListTile(
                  title: Text('拍照',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          fontSize: KDimens.font_sp16,
                          color: KColors.colorAccent)),
                  onTap: () {
                    _takePhoto();
                    Navigator.pop(context);
                  },
                ),
                Divider(
                  height: 1,
                ),
                ListTile(
                  title: Text('相册',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          fontSize: KDimens.font_sp16,
                          color: KColors.colorAccent)),
                  onTap: () {
                    _openPhotoAlbum();
                    Navigator.pop(context);
                  },
                ),
                Container(
                  color: KColors.divider,
                  height: 10,
                ),
                ListTile(
                  title: Text('取消',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          fontSize: KDimens.font_sp16, color: KColors.gray_33)),
                  onTap: () {
                    Navigator.pop(context);
                  },
                ),
              ],
            ),
          );
        });
  }

  File _image;

  ///拍照
  Future _takePhoto() async {
    var image = await ImagePicker.pickImage(source: ImageSource.camera);

    setState(() {
      _cropImage(image);
    });
  }

  ///打开相册
  Future _openPhotoAlbum() async {
    var image = await ImagePicker.pickImage(source: ImageSource.gallery);
    setState(() {
      _cropImage(image);
    });
  }

//剪裁
  _cropImage(File imageFile) async {
    File croppedFile = await ImageCropper.cropImage(
      sourcePath: imageFile.path,
      aspectRatioPresets: [
        CropAspectRatioPreset.square,
        CropAspectRatioPreset.ratio3x2,
        CropAspectRatioPreset.original,
        CropAspectRatioPreset.ratio4x3,
        CropAspectRatioPreset.ratio16x9
      ],
      androidUiSettings: AndroidUiSettings(
          toolbarTitle: '剪裁图片',
          toolbarColor: Colors.white,
          toolbarWidgetColor: Colors.black,
          initAspectRatio: CropAspectRatioPreset.original,
          lockAspectRatio: false),
      iosUiSettings: IOSUiSettings(
        minimumAspectRatio: 1.0,
      ),
    );

    if (croppedFile != null) {
      setState(() {
        _image = croppedFile;
      });
    }
  }

依赖地址:

image_picker
image_cropper
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 8
    评论
### 回答1: 在Flutter,可以使用"url_launcher"包来打开应用外的系统浏览器。 首先,在pubspec.yaml添加"url_launcher"的依赖: ``` dependencies: url_launcher: ^X.X.X ``` 然后,在dart文件引入该包: ``` import 'package:url_launcher/url_launcher.dart'; ``` 最后,使用"launch"函数打开指定URL: ``` await launch('https://www.google.com'); ``` ### 回答2: 在Flutter里,可以通过使用`url_launcher`插件来打开应用外系统的浏览器。 首先,需要在`pubspec.yaml`文件添加`url_launcher`插件的依赖。可以在`dependencies`部分添加以下代码: ```yaml dependencies: url_launcher: ^5.7.10 ``` 然后运行`flutter pub get`命令来获取插件。 在Flutter应用打开系统浏览器,需要调用`launch`方法,并传递要打开的URL作为参数。例如: ```dart import 'package:url_launcher/url_launcher.dart'; void openURL() async { const url = 'https://www.example.com'; if (await canLaunch(url)) { await launch(url); } else { throw '无法打开该链接:$url'; } } ``` 在上述代码,首先定义了要打开的URL,然后使用`canLaunch`方法检查是否可以打开该URL。如果可以打开,就使用`launch`方法打开URL;否则,抛出异常。 在需要打开系统浏览器的地方,可以调用`openURL`函数来实现。 需要注意的是,由于此操作涉及到系统级别的权限,所以在某些平台上可能需要配置相应的权限。 ### 回答3: 在Flutter打开应用外系统的浏览器有多种方式可以实现。以下是一种常用的方法: 首先,我们需要导入`url_launcher`的依赖包。在`pubspec.yaml`文件,添加以下代码: ``` dependencies: flutter: sdk: flutter url_launcher: ^6.0.3 ``` 然后,在需要打开浏览器的地方,我们可以使用`url_launcher`库的`launch`方法。例如,我们可以在一个按钮的点击事件处理器使用以下代码来打开浏览器: ```dart import 'package:flutter/material.dart'; import 'package:url_launcher/url_launcher.dart'; class HomePage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: const Text('浏览器示例')), body: Center( child: ElevatedButton( child: Text('打开浏览器'), onPressed: () async { const url = 'https://www.example.com'; if (await canLaunch(url)) { await launch(url); } else { throw '无法打开浏览器'; } }, ), ), ); } } ``` 以上代码会在按钮被点击时,尝试使用系统浏览器打开一个指定的URL(在此例为`https://www.example.com`)。我们首先使用`canLaunch`方法检查是否可以打开指定的URL,然后再使用`launch`方法打开浏览器。 需要注意的是,为了使用`url_launcher`库,你的应用必须在Android和iOS的原生配置文件进行相应的设置,以允许应用打开外部链接。具体的设置方法可以参考`url_launcher`库的官方文档或相关示例。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值