아무나 빌려가세요

flutter Image Picker를 이용한 사진 선택,서버로 보내기 본문

플러터

flutter Image Picker를 이용한 사진 선택,서버로 보내기

빌라노바 2022. 1. 24. 21:08

필수 dart 패키지

import 'package:http_parser/http_parser.dart';
import 'package:image_picker/image_picker.dart';
import 'package:dio/dio.dart';

촬영한 단일사진을 선택하는 함수


 File? imageFile;
...
onPressed: () => getImage(source: ImageSource.camera)
//imageSource에서 camera로 할경우 촬영가능
gallary로 할 경우 이미지 갤러리로 이동
...

void getImage({required ImageSource source}) async {
    final file = await ImagePicker().pickImage(
        source: source, maxWidth: 640, maxHeight: 280, imageQuality: 100 //0-100
        );

    if (file?.path != null) {
      setState(() {
        imageFile = File(file!.path);
        _selectedFiles.clear();
      });
    }
  }

갤러리를 통해 2개이상의 사진을 선택하는 함수

 final ImagePicker _picker = ImagePicker();
  List<XFile> _selectedFiles = [];
...
Future selectImages() async {
    if (_selectedFiles != null) {
      _selectedFiles.clear();
    }
    try {
      final List<XFile>? selectedImages = await _picker.pickMultiImage(
          maxWidth: 640, maxHeight: 280, imageQuality: 100);
      setState(() {
        if (selectedImages!.isNotEmpty) {
          _selectedFiles.addAll(selectedImages);
          
        } else {
          print('no image select');
        }
      });
    } catch (e) {
      print(e);
    }

    print("Image List length: ${_selectedFiles.length.toString()}");
    //
  }

dio를 통해 서버로 이미지 전달

FormData _formData;

                  if (_selectedFiles.isEmpty) {//단일사진 전달
                    final MultipartFile _file = MultipartFile.fromFileSync(
                        imageFile!.path,
                        contentType: MediaType("image", "jpg"));
                    _formData = FormData.fromMap({"file": _file});
                  } else {//다중사진 전달
                    final List<MultipartFile> _files = _selectedFiles
                        .map((img) => MultipartFile.fromFileSync(img.path,
                            contentType: MediaType("image", "jpg")))
                        .toList();
                    _formData = FormData.fromMap({"file": _files});
                  }

                  Dio dio = Dio();

                  dio.options.contentType = 'multipart/form-data';
                  String currentLoginUserId =
                      context.read<UserInfoProvider>().uid;
                  
                  final res = await dio.post(
                      'URL',
                      data: _formData);
                  if (res.statusCode == 200) {
                   
                    print(res.data);
                  } else {
                   
                    print('eeerror');
                  }

'플러터' 카테고리의 다른 글

CarouselSlider에 youtube 띄우기  (0) 2022.01.26
스크롤을 올리거나 내릴 때 투명도를 주는 방법  (0) 2022.01.26
Map  (0) 2022.01.17
고차함수 (first order)  (0) 2022.01.17
enum 타입설정  (0) 2022.01.16