Escolha uma Página

Ao exibir imagens usando o Image widget padrão , você pode notar que elas simplesmente aparecem na tela quando são carregadas. Isso pode parecer visualmente chocante para seus usuários.

Em vez disso, não seria bom se você pudesse exibir um marcador de posição no início e as imagens desapareceriam à medida que fossem carregadas? Nós podemos usar o Widget FadeInImage que vem junto com o Flutter exatamente para este propósito!

FadeInImage funciona com imagens de qualquer tipo: memória interna, recursos locais ou imagens da Internet. Nesse exemplo irei mostrar a forma mais comum do seu uso, o carregamento de imagens pela internet.

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final title = 'Carregamento de imagens';

    return MaterialApp(
      title: title,
      home: Scaffold(
        appBar: AppBar(
          title: Text(title),
        ),
        body: Center(
          child: FadeInImage.assetNetwork(
            placeholder: 'assets/loading.gif',
            image:
                'https://github.com/flutter/website/blob/master/src/_includes/code/layout/lakes/images/lake.jpg?raw=true',
          ),
        ),
      ),
    );
  }
}

Qualquer dúvida ou sugestão de Widget é só entrar em contato!