Flutterで画像をぼかす方法

画像をぼかすために、Flutterのimage packageを使用します。まず、pubspec.yamlファイルでimageパッケージを追加します。以下のようにdependenciesセクションに追加してください:

dependencies:
  flutter:
    sdk: flutter
  image: ^3.0.2

その後、次の手順に従って画像をぼかすコードを作成します。

画像を読み込む: まず、ぼかす対象の画像を読み込みます。Flutterでは、Imageクラスを使用して画像を読み込むことができます。以下のコードを使用して、画像を読み込みます。

import 'package:flutter/material.dart';
import 'package:image/image.dart' as img;
void main() {
  runApp(MyApp());
}
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final image = img.decodeImage(File('path_to_your_image.jpg').readAsBytesSync());
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Image Blur Example'),
        ),
        body: Center(
          child: Image(image: MemoryImage(img.encodePng(image))),
        ),
      ),
    );
  }
}

画像をぼかす: 画像をぼかすために、imageパッケージのfilterBlurメソッドを使用します。以下のコードを使用して、画像をぼかすことができます。

import 'package:flutter/material.dart';
import 'package:image/image.dart' as img;
void main() {
  runApp(MyApp());
}
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final image = img.decodeImage(File('path_to_your_image.jpg').readAsBytesSync());
    final blurredImage = img.filterBlur(image, 10); // ぼかしの強さを指定します
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Image Blur Example'),
        ),
        body: Center(
          child: Image(image: MemoryImage(img.encodePng(blurredImage))),
        ),
      ),
    );
  }
}

上記のコードでは、filterBlurメソッドの第2引数にぼかしの強さを指定しています。数値を調整することで、ぼかしの効果を調節できます。

これで、Flutterで画像をぼかす方法がわかりました。画像処理に関する簡単な例として、ぼかしを実装する方法を紹介しました。他の画像処理のテクニックやフィルターを使用する場合は、imageパッケージのドキュメントを参照してください。