Menu
CoddyTech

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.

challenge icon

Desafio

Fácil

Mostre 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)),
            ],
          ),
        ),
      ),
    );
  }
}
quiz iconTeste seus conhecimentos

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

Pratique por conta própria: Compilador de Flutter online