# Working with Assets

Assets are the files your app needs to function, like images, fonts, or data files. Here’s how you can include and use assets in your Flutter app.

### 1. Adding Assets to Your Project 🗂️

First, create a folder named `assets` in the root of your project and place your asset files in it.

### 2. Updating pubspec.yaml 📄

Next, update your `pubspec.yaml` file to include the assets. Under `flutter:`, add an `assets:` section like so:

```yaml
flutter:
  assets:
    - assets/
```

### 3. Using Images from Assets 📸

Now that you’ve added your assets, you can use them in your app. Here’s how to display an image:

```dart
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Assets Example'),
        ),
        body: Center(
          child: Image.asset('assets/image.png'),
        ),
      ),
    );
  }
}
```

### 4. Using Custom Fonts 🅰️

You can also include custom fonts in your assets. First, create a `fonts` folder inside `assets`, then update your `pubspec.yaml`:

```yaml
flutter:
  fonts:
    - family: CustomFont
      fonts:
        - asset: assets/fonts/CustomFont-Regular.ttf
```

Now, you can use your custom font in your app:

```dart
Text(
  'Hello, Flutter University!',
  style: TextStyle(
    fontFamily: 'CustomFont',
    fontSize: 20,
  ),
)
```

### 5. Loading and Using Data Files 📂

You can read data from files stored in your assets as well:

```dart
Future<String> loadAsset() async {
  return await rootBundle.loadString('assets/data.json');
}
```

### Assignments 📝

Time for some hands-on practice:

* [ ] Add several images to your project and display them on different screens.
* [ ] Include a custom font and use it to style text in your app.
* [ ] Load a JSON file from your assets and display its contents on the screen.

***

With these assignments, you'll get a practical understanding of working with assets in Flutter.

{% hint style="info" %}
**Congratulations you're done with the basics of flutter!**

**Let's move to intermediate stuff now.**
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://flutteruniversity.gitbook.io/docs/learn-flutter/basics/working-with-assets.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.