显示网络图片

显示图片是大多数移动应用程序的基础功能。Flutter 提供了 Image 小部件来显示不同类型的图片。

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

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

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

Image.network(
    'https://docs.flutter.dev/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 = '网络图片';

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

除非另有说明，否则本网站上的文档反映的是 Flutter 的最新稳定版本。页面最后更新于 2025-01-30。 查看源代码 或 报告问题。