来自网络的图片
本课属于 Coddy Flutter 学习旅程的“你的第一个应用”单元。第 27 课,共 32 课。
Image.network 会显示来自网址的图片:
Image.network('https://picsum.photos/id/10/300/200')应用会在运行时下载图片,因此图片可能会比屏幕上的其他内容晚一会儿显示。width: 用来设置图片的绘制宽度,高度会相应调整,以保持图片的形状:
Image.network('https://picsum.photos/id/10/300/200', width: 150)应用自带的图片使用 Image.asset。你在创建自己的项目时会用到它。
挑战
简单将这张图片显示在标题上方,作为 Column 的第一个子项:
https://picsum.photos/id/237/300/200
亲手试试
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text('A good dog', style: TextStyle(fontSize: 24)),
],
),
),
),
);
}
}
这节课包含一个小测验。开始学习即可作答,并记录你的进度。
你的第一个应用中的所有课
自己练习: Flutter 在线编译器