[flutter] 플러터 프로바이더를 이용한 파일 다운로드

14 Dec 2023

flutter

이번 포스트에서는 플러터 앱에서 파일을 다운로드하는 방법에 대해 알아보겠습니다. 파일을 다운로드하는 과정 중에는 플러터의 provider 패키지를 이용하여 상태 관리를 할 수 있습니다. 파일 다운로드를 위한 기초적인 코드부터 프로바이더를 통한 파일 다운로드 상태 관리까지 살펴보도록 하겠습니다.

1. 파일 다운로드를 위한 기본 코드

먼저, 파일 다운로드를 위한 기본적인 코드를 작성해보겠습니다. http 패키지를 이용하여 파일을 다운로드하는 방법을 살펴보겠습니다.

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:io';
import 'package:path_provider/path_provider.dart';

class FileDownloader extends StatefulWidget {
  @override
  _FileDownloaderState createState() => _FileDownloaderState();
}

class _FileDownloaderState extends State<FileDownloader> {
  Future<void> downloadFile() async {
    String url = 'https://example.com/file.pdf';
    var response = await http.get(url);

    var dir = await getApplicationDocumentsDirectory();
    File file = File("${dir.path}/file.pdf");
    file.writeAsBytesSync(response.bodyBytes);

    // 파일이 다운로드되었음을 사용자에게 알릴 수 있는 방법을 구현
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      // 파일 다운로드 버튼을 누르면 downloadFile 함수가 호출되도록 구현
    );
  }
}

FileDownloader 위젯은 파일을 다운로드하는 기능을 담당합니다. downloadFile 메서드에서는 http 패키지를 사용하여 파일을 다운로드하고, 다운로드가 완료되면 해당 파일을 사용자의 기기 내부에 저장합니다.

2. 프로바이더를 이용한 파일 다운로드 상태 관리

이제, provider 패키지를 이용하여 파일 다운로드의 상태를 관리하는 방법을 알아보겠습니다. 파일 다운로드 상태 및 진행률을 효과적으로 관리하기 위해 플러터의 프로바이더를 활용할 수 있습니다.

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:io';
import 'package:path_provider/path_provider.dart';
import 'package:provider/provider.dart';

class FileDownloaderProvider extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<FileDownloadModel>(
      create: (context) => FileDownloadModel(),
      child: Consumer<FileDownloadModel>(
        builder: (context, model, _) {
          return Container(
            child: Column(
              children: [
                if (model.isDownloading)
                  CircularProgressIndicator() // 파일 다운로드 진행 표시
                else
                  ElevatedButton(
                    onPressed: () {
                      model.startDownload();
                    },
                    child: Text('파일 다운로드'),
                  ),
              ],
            ),
          );
        },
      ),
    );
  }
}

class FileDownloadModel extends ChangeNotifier {
  bool _isDownloading = false;
  bool get isDownloading => _isDownloading;

  Future<void> startDownload() async {
    _isDownloading = true;
    notifyListeners();

    String url = 'https://example.com/file.pdf';
    var response = await http.get(url);

    var dir = await getApplicationDocumentsDirectory();
    File file = File("${dir.path}/file.pdf");
    file.writeAsBytesSync(response.bodyBytes);

    _isDownloading = false;
    notifyListeners();
  }
}

위 코드에서 FileDownloaderProvider 위젯은 ChangeNotifierProvider를 사용하여 파일 다운로드 상태를 관리합니다. FileDownloadModel 클래스는 파일 다운로드와 관련된 메서드를 포함하고 있으며, 상태가 변경될 때마다 notifyListeners를 호출하여 화면을 업데이트합니다.

플러터에서 파일을 다운로드하는 방법과 프로바이더를 사용하여 상태를 관리하는 방법에 대해 알아보았습니다. 이를 응용하여 사용자 경험을 향상시키는 다양한 기능을 추가할 수 있을 것입니다.