How to add Assets Images and Network images in flutter?

This Article is posted by bloggeraatit at 9/20/2019 5:54:47 AM




There are a lots of ways to add the asset and network images in flutter. This is one of the simplest way to add images in flutter.

First of all,to show the asset image you have to put the image in a folder,in my case i have put the image in image folder.
and then you can give the asset path in pubsec.yaml file like this




Then You can simply use Image.asset and Image.network to add asset and network image. 

The output of app will be like this




The complete main.dart code is like this:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Image on flutter"),
      ),
      backgroundColor: Colors.greenAccent,
      body: Center(
          child: Column(
        children: <Widget>[
          Image.asset("image/robo.jpg"),
          Image.network(
            "https://picsum.photos/250?image=9",
          ),
          
        ],
      )),
    );
  }
}



Tags: flutter








0 Comments
Login to comment.
Recent Comments

Be the first to Comment. You can ask a Query or Share your toughts or Just say thanks.


© 2018 - Fluttercentral | Email to me - seven.srikanth@gmail.com