[flutter] 플러터와 Firebase Storage를 사용하여 이미지 압축 및 크기 조정하는 방법

08 Dec 2023

flutter

이미지 업로드를 지원하는 앱을 개발 중이라면 이미지의 크기와 품질을 관리하는 것이 중요합니다. Firebase Storage와 플러터를 사용하여 이미지를 업로드할 때 압축하고 크기를 조정하는 방법에 대해 알아보겠습니다.

Firebase Storage와 이미지 업로드

Firebase Storage는 앱의 사용자가 저장한 파일을 안전하게 보관하고 제공하는 클라우드 스토리지 시스템입니다. Firebase Storage SDK를 사용하면 간편하게 이미지를 업로드하고 관리할 수 있습니다. 이미지를 Firebase Storage에 업로드하려면 다음과 같이 진행합니다.

import 'dart:io';
import 'package:firebase_storage/firebase_storage.dart';

Future<String> uploadImage(File imageFile, String fileName) async {
  Reference storageReference = FirebaseStorage.instance.ref().child(fileName);
  UploadTask uploadTask = storageReference.putFile(imageFile);
  TaskSnapshot taskSnapshot = await uploadTask.whenComplete(() => null);
  String imageUrl = await taskSnapshot.ref.getDownloadURL();
  return imageUrl;
}

위 코드는 이미지 파일을 Firebase Storage에 업로드하고 다운로드 URL을 반환하는 함수입니다. 이제 이미지의 크기를 조정하고 압축하는 방법에 대해 알아보겠습니다.

이미지 압축 및 크기 조정

플러터에서 이미지를 압축하고 크기를 조정하기 위해 flutter_image_compress 패키지를 사용할 수 있습니다. 해당 패키지를 이용하면 이미지의 크기를 줄이고 품질을 조정할 수 있습니다.

먼저, flutter_image_compress 패키지를 프로젝트에 추가합니다.

dependencies:
  flutter_image_compress: ^0.10.0

다음으로 이미지를 압축하고 크기를 조정하는 방법은 아래와 같습니다.

import 'package:flutter_image_compress/flutter_image_compress.dart';
import 'dart:io';

Future<File> compressAndResizeImage(File imageFile) async {
  var result = await FlutterImageCompress.compressAndGetFile(
    imageFile.path,
    imageFile.path,
    quality: 50, // 이미지 품질 (0 - 100)
    maxHeight: 1024, // 최대 높이
    maxWidth: 1024, // 최대 너비
  );
  
  return result;
}

위의 코드는 이미지를 최대 1024x1024 픽셀 크기로 조정하고 품질을 50으로 압축하는 함수입니다. 이제 이미지를 Firebase Storage에 업로드하기 전에 compressAndResizeImage 함수를 사용하여 이미지를 처리하고 업로드하면 됩니다.

이제 플러터 앱에서 이미지를 Firebase Storage에 업로드하고, 압축 및 크기를 조정하는 방법에 대해 알아보았습니다. 이미지 품질과 크기를 관리하여 앱의 성능을 향상시키고 사용자 경험을 개선할 수 있습니다.

더 많은 정보를 원하시면 아래 링크를 참조하세요.

이제 이미지를 효율적으로 관리하여 사용자들이 더 나은 경험을 할 수 있도록 도와주는 앱을 만들어 보세요!