Flutter Example - Handle Image | Load Image from Asset

1. Prepare the image to use.

 

2. Create a folder (assets/images) to store images in the root path of the project. Then copy the prepared image to the folder.

 

3. Add the path of the image file to the assets section of the pubspec.yaml file.

flutter:
  assets:
    - assets/images/image.jpg

 

4. Source Code

import 'package:flutter/material.dart';

class LoadImageFromAsset extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Load Image From Asset")),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Center(
            child: Image.asset(
              "assets/images/image.jpg",
            ),
          ),
          Text("path: assets/images/image.jpg")
        ],
      ),
    );
  }
}

 

 

 

▶ Go to Table of Contents | 강의 목차로 이동

---

※ This example is also available in the Flutter Code Examples app. | 본 예제는 Flutter Code Examples 앱에서도 제공됩니다.

Flutter Code Examples - Google Play 앱