Bilder aus dem Web

Teil des Abschnitts Deine erste App der Flutter-Journey von Coddy. Lektion 27 von 32.

Image.network zeigt ein Bild von einer Webadresse an:

Image.network('https://picsum.photos/id/10/300/200')

Die App lädt das Bild während der Ausführung herunter, sodass es einen Moment nach dem Rest des Bildschirms erscheinen kann. Mit width: wird festgelegt, wie breit es gezeichnet wird, und seine Höhe passt sich an, damit die Form erhalten bleibt:

Image.network('https://picsum.photos/id/10/300/200', width: 150)

Bilder, die direkt in der App enthalten sind, verwenden Image.asset. Du wirst darauf stoßen, wenn du ein eigenes Projekt erstellst.

Aufgabe

Einfach

Zeige dieses Bild oberhalb der Bildunterschrift als erstes Kind der Column:

https://picsum.photos/id/237/300/200

Probier es selbst

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)),
            ],
          ),
        ),
      ),
    );
  }
}