Your First Flutter App: Polishing the App

The Dart language comes with many pre-built data types and functions you can use in your apps to solve a variety of common tasks. These are part of what are called Dart core libraries.

You can think of the Dart core libraries as a big box of books filled with code that you can use in your apps.

In fact, you’ve used elements in the Dart core libraries already. Number types like int and the String type are part of the core libraries. The print function you used to print a message to the console is a also a part of the core libraries. The part of the core libraries that include these fundamental types and functions is imported into your Flutter programs automatically.

When you’re developing your own Dart apps, you’ll frequently want to use elements in the Dart core libraries, rather than re-inventing the wheel. But the libraries are big, so how can you know what’s available?

Luckily, the Flutter and Dart documentation available online is really expansive. You can go to dart.dev/guide/libraries to read all about and investigate what’s available in the Dart core libraries. flutter.dev/docs is also a great resource to learn about all things Flutter.

Demo

To get started, open your project in progress or download the starter project. In this episode, we’re going to be using code from the core libraries to produce a random number. Open up, flutter.dev/docs in your browser. You’ll see there are a bunch of options. The videos is a great resource for learning all about the framework from the developers themselves.

Click on the API Docs option. You’ll be brought to the table of contents. On the left hand side, you’ll see links to all sorts of libraries that you can use in your app. We’re interested in the Core Libraries, so scroll down to see all of the core libraries.

We’re interested in a random number. This can be found in the math library, so click on dart.math. The math library contains a bunch of classes, followed by more constants, and even more functions. Click on the Random class. We’re looking to create a random integer from one to one hundred.

If you scroll down, you’ll see a method called nextInt(). Click on it. Here it provides some information about the method itself. When you first start, this information may seem a bit annoying, but as you get comfortable, you’ll be able to read them with ease.

Now switch back to your project. Open up main.dart. At the top of the file, import the math library.

import 'dart:math';

How’d I know the syntax of the import? Well, the documentation showed me. Back in your browser, navigate back to the dart math library page. You’ll see an example of the import. Remember, whenever you have a question, the documents are a great starting point.

Now, let’s pass in a random number. In the initState found in _GamePageState, update the GameModel to the following.

_model = GameModel(Random().nextInt(100));

Unfortunately, there’s a slight bug. We’re actually getting a random number from zero to ninety-nine as opposed to one from one hundred. How do I know this? Well, from the documentation. You can either go back to your web browser, but you can also access the docs right inside of Visual Studio Code.

If you are using macOS, hold down command. If you are using Windows, hold down control. Now click on the nextInt method and you’ll be brought to the documentation.

You’ll see that NextInt generates a non-negative integer distributed in the range from 0 (inclusive meaning it being included) to max (exclusive meaning it not being included). So in our case, zero to ninety-nine. We want one to one hundred so we’ll add a number.

_model = GameModel(Random().nextInt(100) + 1);

All we have to do is call it. Update the Prompt widget to use the new target.

Prompt(targetValue: _model.target),

Now run the app and we’ll be prompted to find a random number. Hot reload the app and you’ll get a new number each time.

Remember when you’re learning Flutter development, you don’t need to memorize every single thing you can do. Instead, you just need to focus on learning the general concepts, and what’s possible - and then you can refer to the documentation when you inevitably forget things.

As you progress through our learning path and learn more about Flutter development and Dart, the documentation will start to make a lot more sense, and you’ll eventually get to the point where you can use it to refresh your memory on what you’ve learned in the courses, and even start striking off into new things on your own.