Imagens da web
Parte da seção Seu primeiro app do Journey de Flutter da Coddy. Lição 27 de 32.
Image.network exibe uma imagem de um endereço da web:
Image.network('https://picsum.photos/id/10/300/200')O app baixa a imagem enquanto está em execução, então ela pode aparecer um instante depois do restante da tela. width: define a largura com que ela é exibida, e a altura é ajustada para manter suas proporções:
Image.network('https://picsum.photos/id/10/300/200', width: 150)Imagens incluídas no próprio app usam Image.asset. Você vai conhecer esse recurso quando criar seu próprio projeto.
Desafio
FácilMostre esta imagem acima da legenda, como o primeiro filho de Column:
https://picsum.photos/id/237/300/200
Experimente você mesmo
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)),
],
),
),
),
);
}
}
Esta lição inclui um quiz rápido. Comece a lição para respondê-lo e acompanhar seu progresso.
Todas as lições de Seu primeiro app
1Olá, Flutter
O que é Flutter?Altere o textoA árvore de widgetsScaffold e AppBarStrings e aspasComentários7Projeto: Cartão de Visita
Cartão de Visita: LayoutCartão de Visita: Estilo6Ícones e imagens
ÍconesTamanho e cor dos íconesImagens da webAvatares redondosWidgets a partir de uma listaPratique por conta própria: Compilador de Flutter online