Flutter RawImage


简介

一个直接显示dart:ui.Image的widget

基本用法

RawIamge很少使用,推荐使用Image

  • RawImage 是通过 paintImage 绘制出来的Image。这个方法更加详细的描述了各个字段的含义
  • 传递给RawImage中的Image是dart:ui下的Image而不是Material下的Image,见Demo注释

高级用法

关于更多详细介绍,请看paintImage的属性说明

实例演示

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart' show rootBundle;
import 'dart:typed_data';
import 'dart:ui' as ui;

class RawImageDemo extends StatefulWidget {
  _RawImageDemoState createState() => _RawImageDemoState();
}

class _RawImageDemoState extends State<RawImageDemo> {
  ui.Image _img;

  @override
  void initState() {
    super.initState();
    _loadImageByAsset('assets/images/food06.jpeg').then((_urlImage) {
      setState(() {
        _img = _urlImage;
      });
    });
  }

// 注意这里必须使用ui.Image
  Future<ui.Image> _loadImageByAsset(String asset) async {
    ByteData data = await rootBundle.load(asset);
    ui.Codec codec = await ui.instantiateImageCodec(data.buffer.asUint8List());
    ui.FrameInfo fi = await codec.getNextFrame();

    return fi.image;
  }

  @override
  Widget build(BuildContext context) {
    if (_img == null) {
      return Container(
        child: null,
      );
    }
    return Container(
      child: RawImage(image: _img),
    );
  }
}