이미지를 확대하고 스와이프하여 볼 수 있는 기능을 제공하는 ‘photo_view’ 패키지는 Flutter에서 많이 사용되는 패키지 중 하나입니다. 이번에는 이 ‘photo_view’ 패키지를 활용하여 이미지를 저장하고 공유하는 기능을 구현해보도록 하겠습니다.

1. 의존성 추가하기

먼저, ‘pubspec.yaml’ 파일에 ‘photo_view’ 패키지를 의존성으로 추가해야 합니다. 아래의 코드를 추가해주세요.

dependencies:
  flutter:
    sdk: flutter
  photo_view: ^0.11.1

저장 후, 터미널에서 flutter pub get 명령어를 실행하여 의존성을 다운로드합니다.

2. 이미지 저장하기

이미지를 저장하기 위해서는 ‘image_gallery_saver’ 패키지를 사용할 수 있습니다. ‘pubspec.yaml’ 파일에 해당 패키지를 추가해주세요.

dependencies:
  image_gallery_saver: ^1.6.3

의존성을 추가한 후, ‘main.dart’ 파일에 아래의 코드를 추가합니다.

import 'package:image_gallery_saver/image_gallery_saver.dart';

// ...

_saveImage() async {
  var response = await http.get('https://example.com/image.jpg');
  final result = await ImageGallerySaver.saveImage(
    Uint8List.fromList(response.bodyBytes),
    quality: 100,
  );
  print(result);
}

위 코드에서는 http 패키지를 사용하여 이미지를 다운로드한 후, ‘image_gallery_saver’ 패키지의 saveImage 메서드를 호출하여 이미지를 저장합니다. quality 매개변수를 이용하여 이미지 퀄리티를 조정할 수 있습니다. 저장 결과는 result 변수에 반환되며, 필요에 따라 출력하거나 처리할 수 있습니다.

3. 이미지 공유하기

이미지를 공유하기 위해서는 ‘share’ 패키지를 사용할 수 있습니다. ‘pubspec.yaml’ 파일에 해당 패키지를 추가해주세요.

dependencies:
  share: ^2.0.2

의존성을 추가한 후, ‘main.dart’ 파일에 아래의 코드를 추가합니다.

import 'package:share/share.dart';

// ...

_shareImage() async {
  var response = await http.get('https://example.com/image.jpg');
  final tempDir = await getTemporaryDirectory();
  final file = await new File('${tempDir.path}/image.jpg').create();
  await file.writeAsBytes(response.bodyBytes);

  await Share.shareFiles(
    [file.path],
    text: 'Check out this image!',
  );
}

위 코드에서는 http 패키지를 사용하여 이미지를 다운로드한 후, ‘share’ 패키지의 shareFiles 메서드를 호출하여 이미지를 공유합니다. 이미지는 임시 디렉토리에 저장한 후, 해당 파일의 경로를 shareFiles 메서드의 첫 번째 매개변수로 전달합니다. 공유할 때 함께 보낼 텍스트는 text 매개변수로 전달하면 됩니다.

4. 결과 확인하기

위에서 구현한 ‘저장하기’와 ‘공유하기’ 기능을 버튼 클릭 이벤트 등 사용자 동작에 맞게 호출하면 됩니다. 예를 들어, 아래와 같이 RaisedButton을 사용하여 버튼을 생성하고 각 버튼에 해당 기능을 연결할 수 있습니다.

RaisedButton(
  onPressed: _saveImage, // 이미지 저장 기능 호출
  child: Text('Save Image'),
),
RaisedButton(
  onPressed: _shareImage, // 이미지 공유 기능 호출
  child: Text('Share Image'),
),

이제 앱을 실행하고 버튼을 클릭하여 이미지를 저장하고 공유해보세요!

마무리

‘photo_view’ 패키지를 사용하여 이미지를 저장하고 공유하는 기능을 구현하는 방법에 대해서 알아보았습니다. 이를 통해 사용자들은 앱 내의 이미지를 쉽게 저장하고 다른 사용자들과 공유할 수 있게 됩니다. 추가적으로, ‘image_gallery_saver’와 ‘share’ 패키지를 다른 용도로 활용할 수도 있으니 자유롭게 참고하여 개발하시면 좋을 것입니다.

이 자습서가 도움이 되었기를 바라며, Flutter 개발을 더욱 재미있고 효과적으로 진행할 수 있기를 기원합니다. 감사합니다!

참고 링크

• photo_view 패키지
• image_gallery_saver 패키지
• share 패키지