2023-09-24 330 View 공개 |
Flutter에서 이미지를 기기에 저장하고 불러오려면 여러 단계를 거쳐야 한다. 크게 요약하면 다음과 같은 단계로 나눌 수 있다. 원격지에서 이미지를 다운로드한다. 다운로드한 이미지를 기기의 로컬 스토리지에 저장한다. 기기에 저장된 이미지를 사용하려면 로컬 경로에서 이미지를 불러옵니다. memberInfo['PHOTO'] 의 값이 변경될 때만 위의 단계들을 반복한다. 아래는 이를 구현하는 간단한 방법이다. 먼저, 필요한 패키지를 추가해야 한다.
dependencies: flutter: sdk: flutter http: ^0.13.3 path_provider: ^2.0.2 flutter_cache_manager: ^3.1.2
import 'dart:io'; import 'package:flutter_cache_manager/flutter_cache_manager.dart'; import 'package:path_provider/path_provider.dart'; Future<File?> downloadImage(String imageUrl, String imageName) async { var file = await DefaultCacheManager().getSingleFile(imageUrl); if (file != null && file.existsSync()) { final directory = await getApplicationDocumentsDirectory(); final imagePath = '${directory.path}/$imageName'; final savedImage = await file.copy(imagePath); return savedImage; } return null; } Future<File?> loadImage(String imageName) async { final directory = await getApplicationDocumentsDirectory(); final imagePath = '${directory.path}/$imageName'; File imageFile = File(imagePath); if (imageFile.existsSync()) { return imageFile; } return null; } ... // 이미지를 다운로드하고 저장하려면: String imageUrl = 'https://mblog.kr/_member/member_imgs/${memberInfo['PHOTO']}'; String imageName = memberInfo['PHOTO']; // 다운로드하고 저장하기 File? savedImage = await downloadImage(imageUrl, imageName); // 저장된 이미지 불러오기 File? localImage = await loadImage(imageName); // 이미지 위젯 사용하기 Image.file(localImage!)
이렇게 하면 원격지에서 이미지를 다운로드하여 기기에 저장하고, 저장된 이미지를 불러와서 사용할 수 있다. 만약 memberInfo['PHOTO']의 값이 변경된다면, 다운로드 및 저장 프로세스를 다시 실행하여 이미지를 업데이트할 수 있다.