【问题标题】:flutter: very low res image using imagePicker颤振:使用 imagePicker 的非常低分辨率的图像
【发布时间】:2019-07-04 16:47:52
【问题描述】:

我使用 image_picker 从用户手机中挑选图像,但是一旦图像被挑选出来,它就会显得非常低分辨率。

有什么办法可以解决这个问题吗?我想使用质量更好的图片,但我想不通!这是显示图像和使用图像选择器的代码:

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'dart:io';
import 'package:uni_markt/models/product.dart';

class ImageInput extends StatefulWidget {
 final Function setImage;
 final Product product;

ImageInput(this.setImage, this.product);

  @override
  State<StatefulWidget> createState() {
    return _ImageInputState();
  }
}

 class _ImageInputState extends State<ImageInput> {
 File _imageFile;

 void _getImage(BuildContext context, ImageSource source) {
 ImagePicker.pickImage(source: source, maxWidth: 400).then((File image) {
  setState(() {
    _imageFile = image;
  });
  widget.setImage(image);
  Navigator.pop(context);
});
}

  void _openImagePicker(BuildContext context) {
showModalBottomSheet(
  context: context,
  builder: (BuildContext context) {
    return Container(
      height: 150,
      padding: EdgeInsets.all(10),
      child: Column(
        children: <Widget>[
          Text(
            'Pick an Image source',
            style: TextStyle(fontWeight: FontWeight.bold),
          ),
          SizedBox(
            height: 10,
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              FlatButton(
                textColor: Theme.of(context).primaryColor,
                child: Icon(
                  Icons.art_track,
                  size: 90,
                ),
                onPressed: () {
                  _getImage(context, ImageSource.gallery);
                },
              ),
              SizedBox(
                width: 20,
              ),
              FlatButton(
                textColor: Theme.of(context).primaryColor,
                child: Icon(
                      Icons.camera_alt,
                      size: 70,
                    ),
                    onPressed: () {
                      _getImage(context, ImageSource.camera);
                  },
                ),
              ],
            ),
           ],
         ),
       );
      },
    );
  }

 @override
 Widget build(BuildContext context) {
final Color color = Theme.of(context).primaryColor;

Widget previewImage = Text('Please select an image');
if (_imageFile != null) {
  previewImage = Image.file(_imageFile,
      fit: BoxFit.cover,
      height: 300,
      alignment: Alignment.center,
      width: MediaQuery.of(context).size.width);
} else if (widget.product != null) {
  previewImage = Image.network(widget.product.image,
      fit: BoxFit.cover,
      height: 300,
      alignment: Alignment.center,
      width: MediaQuery.of(context).size.width);
}

return Column(
  children: <Widget>[
    OutlineButton(
      borderSide: BorderSide(color: color, width: 3),
      onPressed: () {
        _openImagePicker(context);
      },
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Icon(
            Icons.camera_alt,
            color: color,
          ),
          SizedBox(
            width: 5,
          ),
          Text(
            'Add Image',
            style: TextStyle(
              color: color,
            ),
          ),
        ],
      ),
    ),
    SizedBox(
      height: 10,
    ),
    previewImage,

  ],
);

我认为我忽略了一些东西,但我不知道什么。有人可以帮忙解决这个问题吗?

【问题讨论】:

  • 当您调用 ImagePicker.pickImage 时,您将最大宽度指定为 400。如果原始图像具有更高的分辨率(就像您的情况一样),选择器会将其缩小,以便它的宽度是 400。简单地说,删除 maxWidth 参数将为您提供原始分辨率的图像。

标签: android image flutter


【解决方案1】:

image_picker 有一个参数imageQuality

imageQuality 参数修改图像的质量,范围 从 0 到 100,其中 100 是原始/最大质量。如果imageQuality 是 null,返回原画质的图片。

所以除了maxWidthmaxHeight,你还可以这样做:

ImagePicker.pickImage(source: source, maxWidth: 400, imageQuality: 100,)

并注意 image_picker 0.8.4 的当前实现:

Future<XFile?> pickImage(
       {required ImageSource source,
       double? maxWidth,
       double? maxHeight,
       int? imageQuality,
       CameraDevice preferredCameraDevice = CameraDevice.rear}
)

旧 API:

PickedFile image = await _picker.getImage(...)

新 API:

XFile image = await _picker.pickImage(...)

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-11-20
    • 1970-01-01
    • 1970-01-01
    • 2021-03-07
    • 1970-01-01
    • 2017-08-23
    • 2011-04-07
    相关资源
    最近更新 更多