如何確定顫動中圖像的寬度和高度？

Question

假設我宣佈我的形象在我的pubspec.yaml這樣的：

assets: 
    - assets/kitten.jpg 

而且我撲代碼是這樣的：

void main() { 
    runApp(
    new Center(
     child: new Image.asset('assets/kitten.jpg'), 
    ), 
); 
} 

現在，我有一個new Image.asset()，我該如何確定寬度和該圖像的高度？例如，我只想打印出圖像的寬度和高度。

（它看起來像dart:ui's Image class具有高度和寬度，但不知道如何從控件的形象去鏢：用戶界面的圖片。）

謝謝！

Answer 1

如果你已經有一個Image小部件，您可以通過它ImageProvider調用resolve閱讀ImageStream出來。

import 'dart:ui' as ui; 
import 'dart:async'; 
import 'package:flutter/material.dart'; 
import 'package:flutter/services.dart'; 

void main() { 
    runApp(new MaterialApp(
    home: new MyHomePage(), 
)); 
} 

class MyHomePage extends StatelessWidget { 

    Widget build(BuildContext context) { 
    Image image = new Image.network('https://i.stack.imgur.com/lkd0a.png'); 
    Completer<ui.Image> completer = new Completer<ui.Image>(); 
    image.image 
     .resolve(new ImageConfiguration()) 
     .addListener((ImageInfo info, bool _) => completer.complete(info.image)); 
    return new Scaffold(
     appBar: new AppBar(
     title: new Text("Image Dimensions Example"), 
    ), 
     body: new ListView(
     children: [ 
      new FutureBuilder<ui.Image>(
      future: completer.future, 
      builder: (BuildContext context, AsyncSnapshot<ui.Image> snapshot) { 
       if (snapshot.hasData) { 
       return new Text(
        '${snapshot.data.width}x${snapshot.data.height}', 
        style: Theme.of(context).textTheme.display3, 
       ); 
       } else { 
       return new Text('Loading...'); 
       } 
      }, 
     ), 
      image, 
     ], 
    ), 
    ); 
    } 
} 

Answer 2

您可以resolveImageProvider得到​​，然後使用addListener在圖像準備就緒時通知。

import 'dart:ui' as ui; 
import 'dart:async'; 
import 'package:flutter/material.dart'; 
import 'package:flutter/services.dart'; 

void main() { 
    runApp(new MaterialApp(
    home: new MyHomePage(), 
)); 
} 

class MyHomePage extends StatelessWidget { 

    Future<ui.Image> _getImage() { 
    Completer<ui.Image> completer = new Completer<ui.Image>(); 
    new NetworkImage('https://i.stack.imgur.com/lkd0a.png') 
     .resolve(new ImageConfiguration()) 
     .addListener((ImageInfo info, bool _) => completer.complete(info.image)); 
    return completer.future; 
    } 

    Widget build(BuildContext context) { 
    return new Scaffold(
     appBar: new AppBar(
     title: new Text("Image Dimensions Example"), 
    ), 
     body: new Center(
     child: new FutureBuilder<ui.Image>(
      future: _getImage(), 
      builder: (BuildContext context, AsyncSnapshot<ui.Image> snapshot) { 
      if (snapshot.hasData) { 
       ui.Image image = snapshot.data; 
       return new Text(
       '${image.width}x${image.height}', 
       style: Theme.of(context).textTheme.display4); 
      } else { 
       return new Text('Loading...'); 
      } 
      }, 
     ), 
    ), 
    ); 
    } 
}