How to Load Images With Image.File In Flutter ?

How to Load Images With Image.File In Flutter ?

The most of application now a days requires to load images. So in this article, We will go through How to Load Images With Image.File In Flutter?

How to Load Images With Image.File In Flutter?

Flutter contains an assert section inside pubspec.yaml where it contains asserts of your application.

Depending on the type of widget which is used to display image user can give try to below methods.

Consider a code snippet like below:

assets:
    - data_repo/img/ic_launcher.png

• With pubspec.yaml

  import 'package:flutter/material.dart';
  
  void main() {
    runApp(new MaterialApp(home: LoadLocalImage()));
  }
  
  class LoadLocalImage extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return new Scaffold(
        appBar: new AppBar(
          title: new Text("Load Local Image"),
        ),
        body: new Container(
          decoration: new BoxDecoration(
              image: new DecorationImage(
                  image: new AssetImage('data_repo/img/ic_launcher.png'), fit: BoxFit.cover)),
        ),
      );
    }
  }

• With Image.asset:

  import 'package:flutter/material.dart';
  
      void main() {
        runApp(new MaterialApp(home: LoadLocalImage()));
      }
  
      class LoadLocalImage extends StatelessWidget {
        @override
        Widget build(BuildContext context) {
          return new Scaffold(
              appBar: new AppBar(
                title: new Text("Load Local Image"),
              ),
              body: Image.asset(
                'data_repo/img/ic_launcher.png',
                fit: BoxFit.cover,
              ));
        }
      }

  Now we will get the Image displayed on the screen.

  

  Load Image File

  Users can also give try to the below code.

  import 'package:http/http.dart' show get;
  import 'dart:io';
  
  Image loadImageFromFile(String path) {
      File file = new File(path);
      Image img = Image.file(file);
  }
  
  void storeImageToFile(String path,String url) async {
      var response = await get(Url);
      File file = new File(path);
      file.create(recursive: true).then((val) async {
          if (await val.exists()) {
              await file.writeAsBytesSync(response.bodyBytes);
          }
      });
  }

Conclusion:

Thanks for Reading !!! Keep Fluttering !!!

Do share your valuable feedback to serve you better.

In this article, we have been through How to Load Images With Image. File In Flutter?

FlutterAgency.com is our portal Platform dedicated to Flutter Technology and Flutter Developers. The portal is full of cool resources from Flutter like Flutter Widget Guide, Flutter Projects, Code libs and etc.

FlutterAgency.com is one of the most popular online portal dedicated to Flutter Technology and daily thousands of unique visitors come to this portal to enhance their knowledge on Flutter.