#100DaysOfCodeChallenge - 작물 관리 정보 시스템 - 9일차

요약

PlatformException (PlatformException(no_available_camera, No cameras available for taking pictures., null, null))를 해결했습니다.

개요

이 게시물에서는 장치 카메라에 액세스하고 클라우드 저장소에 사진을 저장하는 방법에 대해 설명합니다.

더 깊이

장치 카메라를 사용하여 사진을 찍고 다음으로 사진을 클라우드 저장소에 저장하고 마지막으로 클라우드 저장소 사진의 URL 참조를 클라우드 Firestore의 농부 문서에 저장합니다.

장치 카메라 사용.

class _AddFarmerScreenController extends State<AddFarmerScreen> {
  @override
  Widget build(BuildContext context) => _AddFarmerScreenView(this);
  FarmerServiceModel farmer = FarmerServiceModel.form();

  final _picker = ImagePicker();
  PickedFile? _pickedFile;
  late File? _farmerProfilePicture;
}

요약하면 클래스_AddFarmerScreenController()는 클래스_AddFarmerScreenView()와 관련된 모든 논리를 담당합니다. 후자 클래스는 AddFarmerScreen 의 레이아웃을 담당합니다.
ImagePicker()는 flutterimage_picker 패키지에서 가져온 것입니다. 이 클래스는 장치 카메라를 사용하는 데 필요한 메서드에 대한 액세스를 제공합니다.
PickedFile는 장치 카메라에서 사진을 찍는 메서드 호출에서 반환됩니다.
File는 클라우드 스토리지에 저장될 사진입니다.

사진 촬영 방법

  void _handleTakePhoto() async {
    _pickedFile = await _picker.getImage(source: ImageSource.camera);
    _farmerProfilePicture = File(_pickedFile!.path);
    setState(() {});
  }

_handleTakePhoto()는 사용자가 농부 사진 찍기 버튼을 누를 때 호출됩니다. _picker.getImage(source: ImageSource.camera)는 장치 카메라에 대한 액세스를 제공하는 방법입니다. 반환된 사진은 PickedFile 입니다. _pickedFile는 File에 의해 File(_pickedFile!.path)로 변환되어 _farmerProfilePicture 변수에 저장됩니다.

  ImageProvider<Object>? _imagePreview() {
    if (_pickedFile != null) {
      if (kIsWeb) {
        return NetworkImage(_pickedFile!.path);
      } else {
        return FileImage(File(_pickedFile!.path));
      }
    } else {
      return null;
    }
  }

_imagePreview() 방법이 다음에 할당됩니다.

CircleAvatar(
  backgroundImage: state._imagePreview(),
  minRadius: 200.0,
),

이 위젯은 아래 스크린샷과 같이 촬영한 사진의 미리보기를 표시합니다.

양식 데이터 저장

  void _handleRegisterFarmer() async {
    if (_formkey.currentState!.validate()) {
      _formkey.currentState!.save();
      farmer.saveRegistrationNumber('');
      AddFarmerCommand(context).run(
          farmerServiceModel: farmer,
          context: context,
          farmerProfilePicture: _farmerProfilePicture);
    }
  }

양식 데이터가 저장되면 농부의 프로필 사진이 다른 농부 데이터 및 빌드 컨텍스트와 함께 AddFarmerCommand().run() 메서드로 전달됩니다.

농부 프로필 사진을 클라우드 스토리지에 저장합니다.

/// This class is responsible for farmer registration.
class AddFarmerCommand extends BaseCommand {
  AddFarmerCommand(BuildContext c) : super(c);

  /// Calls FarmerService.addFarmer method
  ///
  /// Receives farmer data and buildcontext from widget and pass it to the farmerService.addFarmer and fileService.uploadFarmerProfilePicture method.
  Future<bool> run({
    required FarmerServiceModel farmerServiceModel,
    required File? farmerProfilePicture,
    required BuildContext context,
  }) async {
    bool farmerAddedSuccess = false;

    if (farmerProfilePicture != null) {
      final farmerProfilePictureUrl =
          await fileservice.uploadFarmerProfilePicture(farmerProfilePicture);
      farmerServiceModel.saveProfilePicture(farmerProfilePictureUrl);
    }
    await farmerService
        .addFarmer(farmerServiceModel: farmerServiceModel)
        .then((value) => farmerAddedSuccess = true);
    return farmerAddedSuccess;
  }
}

이 방법은 두 가지 주요 부분으로 구성됩니다. await fileservice.uploadFarmerProfilePicture() 및 await farmerService.addFarmer()

fileService.uploadFarmerProfilePicture()

농부의 프로필 사진이 null이 아닌 경우에만 fileService.uploadFarmerProfilePicture() 메서드가 호출됩니다.

class FileStorageService {
  final storage = firebase_storage.FirebaseStorage.instance;

  Future<String?> uploadFarmerProfilePicture(
    File farmerProfilePicture,
  ) async {
    String? farmerProfilePictureUrl;
    try {
      await storage
          .ref()
          .child('farmer_profile_picture')
          .child(basename(farmerProfilePicture.path))
          .putFile(farmerProfilePicture)
          .then((value) async {
        farmerProfilePictureUrl = await value.ref.getDownloadURL();
      });
    } on firebase_storage.FirebaseException catch (e) {
      // e.g, e.code == 'canceled'
      print(e);
    }
    return farmerProfilePictureUrl;
  }
}

farmerProfilePicture는 await storage.ref().child().child.putFile().then() 방식을 사용하여 클라우드 스토리지에 저장됩니다. farmerProfilePicture를 farmer_profile_picture 폴더에 저장합니다. 그런 다음 then() 메서드에서 파일에 대한 URL 참조를 반환합니다. 이 참조는 await farmerService.addFarmer() 메서드가 호출될 때 나머지 농부 데이터와 함께 클라우드 Firestore에 저장됩니다.

마무리

이 게시물에서는 장치 카메라의 사진을 클라우드 저장소에 저장하고 클라우드 저장소의 사진에 대한 URL 클라우드 참조를 클라우드 Firestore의 나머지 농부 데이터와 함께 저장하는 방법에 대해 논의했습니다.

아래는 프로세스의 스크린 샷입니다.

나와 연결

내 게시물을 읽어 주셔서 감사합니다. #100DaysOfCodeChallenge에 참여하려면 아래에서 구독하거나 및 에서 저와 연결하세요. 또한 buy me a book 귀하의 지원을 보여줄 수 있습니다.