[flutter] photo_view 패키지로 이미지 감마 보정하기

이미지 보기 및 확대/축소 기능을 제공하는 photo_view 패키지는 Flutter 앱에서 이미지를 효과적으로 표시하는 도구입니다. 이 패키지를 사용하여 이미지를 감마 보정하는 방법을 알아보겠습니다.

1. photo_view 패키지 추가하기

먼저, pubspec.yaml 파일을 열고 dependencies 섹션에 photo_view 패키지를 추가합니다.

dependencies:
  flutter:
    sdk: flutter
  photo_view: ^0.11.1

저장한 후, 터미널에서 flutter pub get 명령을 실행하여 패키지를 설치합니다.

2. 이미지 감마 보정하기

photo_view를 사용하여 이미지를 화면에 표시하는 방법은 다음과 같습니다.

먼저, PhotoView 위젯을 사용하여 화면에 이미지를 표시합니다.

import 'package:flutter/material.dart';
import 'package:photo_view/photo_view.dart';

class ImageViewer extends StatelessWidget {
  final String imageUrl;
  final double gammaValue;

  ImageViewer({required this.imageUrl, this.gammaValue = 1.0});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Image Viewer'),
      ),
      body: Container(
        child: PhotoView(
          imageProvider: NetworkImage(imageUrl),
          filterQuality: FilterQuality.high,
          imageFilter: ColorFilter.matrix(<double>[
            gammaValue, 0, 0, 0, 0,
            0, gammaValue, 0, 0, 0,
            0, 0, gammaValue, 0, 0,
            0, 0, 0, 1, 0,
          ]),
        ),
      ),
    );
  }
}

gammaValue는 이미지의 감마 값을 나타내며, 기본값은 1.0입니다. 값이 1보다 작으면 이미지가 어둡게 표시되고, 1보다 크면 밝게 표시됩니다.

위 코드에서 NetworkImage를 사용하여 이미지의 URL을 가져와 imageProvider로 설정하였습니다. filterQuality는 이미지의 표시 품질을 결정하며 FilterQuality.high로 설정하면 더 선명한 이미지가 표시됩니다. imageFilter를 사용하여 이미지 감마 값을 설정합니다.

이미지 감마 값을 변경하기 위해 gammaValue를 수정하면됩니다.

ImageViewer(imageUrl: 'https://example.com/image.jpg', gammaValue: 0.8);

위와 같이 ImageViewer 위젯을 사용하여 이미지를 감마 보정된 상태로 표시할 수 있습니다.

마무리

이제 photo_view 패키지를 사용하여 이미지를 감마 보정하는 방법을 알아보았습니다. gammaValue 값을 조정하여 원하는 이미지 효과를 얻을 수 있습니다. 더 많은 정보와 사용 사례는 photo_view 패키지의 문서를 참조하시기 바랍니다.

참고: 이 예제는 Flutter의 photo_view 버전 0.11.1을 기준으로 작성되었습니다.