Flutter图片尺寸获取插件image_size_getter_flutter的使用

Flutter图片尺寸获取插件image_size_getter_flutter的使用

image_size_getter_flutter 是一个用于获取图片尺寸的插件。该插件基于 image_size_getter 插件，并专门为 Flutter 应用程序提供了支持。

示例

以下是一个简单的示例，展示如何使用 image_size_getter_flutter 获取 Flutter 资源图片的尺寸。

FlutterAssetImageInput 示例

import 'package:image_size_getter/image_size_getter.dart';
import 'package:image_size_getter_flutter/image_size_getter_flutter.dart';

Future<Size> getAsset(String assetKey) async {
  // 使用 FlutterAssetImageInput 来读取指定资源图片
  final input = FlutterAssetImageInput(assetKey);
  // 异步获取图片尺寸
  final size = await ImageSizeGetter.getSizeAsync(input);
  // 打印图片尺寸
  print('size: $size');
  return size;
}

完整示例代码

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  Size? imageSize;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        if (imageSize != null)
          Text(
            '图片尺寸: ${imageSize!.width} x ${imageSize!.height}',
            style: TextStyle(fontSize: 18),
          ),
        TextButton(
          onPressed: () async {
            // 获取图片尺寸并更新状态
            final size = await getAsset('assets/images/sample.png');
            setState(() {
              imageSize = size;
            });
          },
          child: const Text('点击以获取资源图片尺寸'),
        ),
      ],
    );
  }

  Future<Size> getAsset(String assetKey) async {
    // 使用 FlutterAssetImageInput 来读取指定资源图片
    final input = FlutterAssetImageInput(assetKey);
    // 异步获取图片尺寸
    final size = await ImageSizeGetter.getSizeAsync(input);
    // 打印图片尺寸
    print('size: $size');
    return size;
  }
}

更多关于Flutter图片尺寸获取插件image_size_getter_flutter的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter图片尺寸获取插件image_size_getter_flutter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


image_size_getter_flutter 是一个用于在 Flutter 中获取图片尺寸（宽度和高度）的插件。它支持从本地文件、网络图片或内存中的图片数据中获取尺寸。以下是如何使用这个插件的详细步骤：

1. 添加依赖

首先，你需要在 pubspec.yaml 文件中添加 image_size_getter_flutter 依赖：

dependencies:
  flutter:
    sdk: flutter
  image_size_getter_flutter: ^1.0.0

然后运行 flutter pub get 来安装依赖。

2. 使用 ImageSizeGetter 获取图片尺寸

2.1 获取本地图片的尺寸

你可以使用 ImageSizeGetter 来获取本地图片的尺寸。以下是一个简单的示例：

import 'package:flutter/material.dart';
import 'package:image_size_getter/image_size_getter.dart';
import 'package:flutter/services.dart';

class LocalImageSize extends StatelessWidget {
  Future<Size> getLocalImageSize() async {
    // 加载本地图片
    ByteData data = await rootBundle.load('assets/images/example.jpg');
    // 将 ByteData 转换为 Uint8List
    Uint8List bytes = data.buffer.asUint8List();
    // 使用 ImageSizeGetter 获取图片尺寸
    return ImageSizeGetter.getSize(ImageInput.byte(bytes));
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return FutureBuilder<Size>(
      future: getLocalImageSize(),
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return CircularProgressIndicator();
        } else if (snapshot.hasError) {
          return Text('Error: ${snapshot.error}');
        } else if (snapshot.hasData) {
          Size size = snapshot.data!;
          return Text('Image Size: ${size.width}x${size.height}');
        } else {
          return Text('No data');
        }
      },
    );
  }
}

void main() => runApp(MaterialApp(
  home: Scaffold(
    appBar: AppBar(title: Text('Local Image Size')),
    body: Center(child: LocalImageSize()),
  ),
));

2.2 获取网络图片的尺寸

你也可以使用 ImageSizeGetter 来获取网络图片的尺寸。以下是一个简单的示例：

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

class NetworkImageSize extends StatelessWidget {
  Future<Size> getNetworkImageSize(String imageUrl) async {
    // 下载图片数据
    var response = await http.get(Uri.parse(imageUrl));
    if (response.statusCode == 200) {
      // 使用 ImageSizeGetter 获取图片尺寸
      return ImageSizeGetter.getSize(ImageInput.byte(response.bodyBytes));
    } else {
      throw Exception('Failed to load image');
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return FutureBuilder<Size>(
      future: getNetworkImageSize('https://example.com/image.jpg'),
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return CircularProgressIndicator();
        } else if (snapshot.hasError) {
          return Text('Error: ${snapshot.error}');
        } else if (snapshot.hasData) {
          Size size = snapshot.data!;
          return Text('Image Size: ${size.width}x${size.height}');
        } else {
          return Text('No data');
        }
      },
    );
  }
}

void main() => runApp(MaterialApp(
  home: Scaffold(
    appBar: AppBar(title: Text('Network Image Size')),
    body: Center(child: NetworkImageSize()),
  ),
));
回到顶部