Get Started: Test Drive

This page describes how to “test drive” Flutter: create a new Flutter app from our templates, run it, and learn how to make changes with Hot Reload.

Flutter is a flexible toolkit, so please start by selecting your development tool of choice for writing, building, and running your Flutter app.

Android Studio: A complete, integrated IDE experience for Flutter.

Create new app

  1. Select File > New Flutter Project
  2. Select Flutter application as the project type, and press Next
  3. Enter a project name (e.g. myapp), and press Next
  4. Click Finish
  5. Wait for Android Studio to install the SDK, and create the project.

The above command creates a Flutter project directory called myapp that contains a simple demo app that uses Material Components.

In the project directory, the code for your app is in lib/main.dart.

Run the app

  1. Locate the main Android Studio toolbar:
    Main IntelliJ toolbar
  2. In the target selector, select an Android device for running the app. If none are listed as available, select Tools> Android > AVD Manager and create one there. For details, see Managing AVDs.
  3. Click the Run icon in the toolbar, or invoke the menu item Run > Run.
  4. If everything works, you should see your starter app on your device or simulator:
    Starter App on Android

Try a hot reload

Flutter offers a fast development cycle with hot reload, the ability to reload the code of a live running app without restarting or losing app state. Simply make a change to your source code, tell your IDE or command-line tool that you want to hot reload, and see the change in your simulator, emulator, or device.

  1. Change the string
    'You have pushed the button this many times:' to
    'You have clicked the button this many times:'
  2. Do not press the ‘Stop’ button; let your app continue to run.
  3. To see your changes invoke Save All, or click Hot Reload (the button with the lightning bolt icon).

You should see the updated string in the running app almost immediately.

VS Code: A light-weight editor with Flutter run and debug support.

Create new app

  1. Start VS Code
  2. Invoke View > Command Palette
  3. Type “flutter”, and select the Flutter: New Project action
  4. Enter a project name (such as myapp), and press Enter
  5. Create or select the parent directory for the new project folder
  6. Wait for project creation to complete and the main.dart file to appear

The command above creates a Flutter project directory called myapp that contains a simple demo app that uses Material Components.

In the project directory, the code for your app is in lib/main.dart.

Run the app

  1. Locate the VS Code status bar (the blue bar at the bottom of the window)
  2. Select a device from the Device Selector area. For details, see Quickly Switching Between Flutter Devices.
    • If no device is available and you’d like to use a device simulator, click No Devices and launch a simulator.
    • To setup a real device, follow the device-specific instructions on the Get Started: Install page for your OS.
  3. Invoke Debug > Start Debugging or press F5
  4. Wait for the app to launch — progress is printed in the Debug Console view
  5. If everything works, after the app has been built, you’ll see the starter app on your device:
    Starter App on Android

Try a hot reload

Flutter offers a fast development cycle with hot reload, the ability to reload the code of a live running app without restarting or losing app state. Simply make a change to your source code, tell your IDE or command-line tool that you want to hot reload, and see the change in your simulator, emulator, or device.

  1. Open lib/main.dart
  2. Change the string
    'You have pushed the button this many times:' to
    'You have clicked the button this many times:'
    Important: do not press the Stop button; let your app run
  3. Save your changes: invoke File > Save All, or click Hot Reload (the green circular arrow button)

You’ll see the updated string in the running app almost immediately.

Terminal + editor: Your editor-of-choice combined with Flutter’s terminal tool for running and building.

Create new app

  1. Use the flutter create command to create a new project:
$ flutter create myapp
$ cd myapp

The above command creates a Flutter project directory called myapp that contains a simple demo app that uses Material Components.

In the project directory, the code for your app is in lib/main.dart.

Run the app

  • Check that an Android device is running. If none are shown, see setup.
$ flutter devices
  • Run the app with the flutter run command:
$ flutter run
  • If everything works, after the app has been built, you should see your starter app on your device or simulator:
    Starter App on Android

Try a hot reload

Flutter offers a fast development cycle with hot reload, the ability to reload the code of a live running app without restarting or losing app state. Simply make a change to your source code, tell your IDE or command-line tool that you want to hot reload, and see the change in your simulator, emulator, or device.

  1. Open the file lib/main.dart
  2. Change the string
    'You have pushed the button this many times:' to
    'You have clicked the button this many times:'
  3. Do not press the ‘Stop’ button; let your app continue to run.
  4. To see your changes invoke Save All (cmd-s / ctrl-s), or click the Hot Reload button (the button with the lightning bolt icon).

You should see the updated string in the running app almost immediately.

Next step

Let’s learn some core Flutter concepts, by creating a small app.

Next step: Write your first app