从互联网显示图像

显示图像对于大多数移动应用程序来说是必不可少的。Flutter 提供了 Image 小部件来显示不同类型的图像。

要使用来自 URL 的图像,请使用 Image.network() 构造函数。

飞镖
Image.network('https://picsum.photos/250?image=9'),

额外:动画 GIF

#

Image 小部件的一个有用之处在于:它支持动画 GIF。

飞镖
Image.network(
    'https://docs.flutterdart.cn/assets/images/dash/dash-fainting.gif');

带占位符的图像淡入

#

默认的 Image.network 构造函数不支持更高级的功能,例如在加载后淡入图像。要完成此任务,请查看 使用占位符淡入图像

交互式示例

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

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    var title = 'Web Images';

    return MaterialApp(
      title: title,
      home: Scaffold(
        appBar: AppBar(
          title: Text(title),
        ),
        body: Image.network('https://picsum.photos/250?image=9'),
      ),
    );
  }
}