[Flutter] Flutter 이미지 피커를 적용해보자! (feat. Error: Unhandled Exception: MissingPluginException(No implementation found for method pickImage on channel plugins.flutter.io/image_picker))

https://pub.dev/packages/image_picker

image_picker | Flutter Package

먼저 pubspec.yaml에 아래와 같이 넣어보자

dependencies:
  image_picker: ^0.8.6

다음으로 ios > Runner > info.plist에 들어가 다음 코드를 작성한다.

아래 코드는 최초 카메라 접근 시 이용동의 알림창에 나오는 글들을 의미한다.

<key>NSCameraUsageDescription</key>
<string>Used to demonstrate image picker plugin</string>
<key>NSMicrophoneUsageDescription</key>
<string>Used to capture audio for image picker plugin</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>Used to demonstrate image picker plugin</string>

이렇게 하고 
Unhandled Exception: MissingPluginException(No implementation found for method pickImage on channel plugins.flutter.io/image_picker)
이런 오류가 나온다면 
Android Studio를 껐다가 다시켜면 잘 동작한다. 

전체 코드는 아래와 같다.

import 'dart:io';

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(

        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});


  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  File? _image;
  final picker = ImagePicker();

  // 비동기 처리를 통해 카메라와 갤러리에서 이미지를 가져온다.
  Future getImage(ImageSource imageSource) async {
    final image = await picker.pickImage(source: imageSource);

    setState(() {
      _image = File(image!.path); // 가져온 이미지를 _image에 저장
    });
  }



  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(

        title: Text(widget.title),
      ),
      body: Center(

        child: Column(

          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            // 갤러리에서 이미지를 가져오는 버튼
            FloatingActionButton(
              child: Icon(Icons.wallpaper),
              tooltip: 'image_picker',
              onPressed: () {
                getImage(ImageSource.gallery);
              },
            ),
          ],
        ),
      ),

    );
  }
}