[TIL] flutter image_picker

김영광·2026년 1월 20일

앱에서 사진을 가져오기 위해서는 갤러리 접근, 사진 촬영의 방법이 있다.
flutter에서는 주로 image_picker 라이브러리를 사용한다.

🔎 image_picker

flutter pub add image_picker

먼저, 해당 라이브러리를 사용하기 위해서는 pub dev에서 라이브러리를 설치해야한다.
라이브러리 추가를 완료하면 각 OS별 permission을 작성해줘야 한다.

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

Android 권한 설정은 AndroidManifest.xml 파일안에 다음 권한을 넣어주면 된다.
CAMERA 권한은 camera에 직접적으로 접근할 수 있는 권한이다.
write_external_storage는 갤러리에 사진을 저장하는 것을. read_external_storage는 읽어오는 것을 의미한다.

권한 설정 이후 flutter clean을 수행해줘야 한다.


iOS는 info.plist 파일안에 사진과 같이 여러 key값을 지정해줘야 한다.
해당 내용은 나중에 앱스토어 심사에서 사용되므로 String의 권한 필요 사유는 자세하게 적는 것이 좋다.

🔎 너, 사용법

image_picker를 통해 불러오는 데이터는 모두 XFile 데이터 타입을 갖는다.
기본적으로 처음에는 값을 가질 수 없기에 XFile?으로 데이터 타입을 잡아주는 것이 일반적이다.

  1. imagePicker() 객체를 생성한다.
  2. pickImage() 메서드를 이용해 이미지를 불러온다.
    • image를 불러올 때, pickImage메서드의 내부 속성인 source를 통해 불러올 위치, maxWidth, maxHeight를 통해 최대 사이즈를 제한할 수 있다.
  3. 사진을 찍고 싶을 땐 source를 ImageSource.camera로 설정한 뒤 prefferedCameraDevice를 통해 전면, 후면 설정이 가능하다.

🔎 주요 속성 및 고급 사용법

Gemini를 통해 주요 속성들을 질문해봤다.
참고로 후면 카메라를 사용하려면 CameraDevice.rear로 설정하면 된다.

⭐ 고급 사용법

1️⃣ pickMultiImage

한 번에 여러 사진을 가져오려면 해당 메서드를 사용하면 된다.
pickImage와 속성은 동일하다.

2️⃣ pickVedio

사진 대신 영상을 가져오려면 해당 메서드를 사용한다.
최대 녹화 시간을 지정해 해당 시간만큼의 영상만 가져온다.

3️⃣ XFile -> File or Bytes

Xfile을 손쉽게 File 타입이나 Bytes 타입으로 변환할 수 있다.
File("xFile 경로")를 통해 File 타입으로 변환할 수 있고, xFile.readAsBytes()를 통해 바이트 단위로 읽어올 수 있다.

profile
주니어 개발자

0개의 댓글