WIP - Flutter Setup
Overview
This is a setup for any Flutter project on a Windows 10/11 device, and is what we will be using to setup IMACS. You only have to go through the setup once. Anything that you need to download can be found in the References section. Make sure Git is properly setup
Setting up Flutter
Install Flutter if you do not have it installed. You can also refer to the link for further guidance
When unzipping, Do not keep the version number as Flutter has an automatic update feature. When you extract the files, make sure you do so into a directory where there are NO spaces
Add flutter to path [flutter unzip location]/flutter/bin
Disable analytics by running the following in any terminal
flutter config --no-analytics
dart --disable-analytics.
In VS Code:
Go to settings: Ctrl+, OR File→Preferences→Settings
Search for telemetry
Set to off
Run
flutter doctor
. This command gives you a list of dependencies flutter requries before you can properly run your app. If you already have all the dependencies, you should see something like this in your terminal. If not, please follow the associated links the command gives you to set them up, or refer to the documentation below.
Android Studio and Android Toolchain setup
One of the flutter dependencies you may not have on your machine is Android Studio or the Android Studio Toolchain. If the steps presented with flutter doctor
do not work for you, please follow the steps below
Download Android Studio. Make sure you know the file path (note it down somewhere)
Open the android studio.exe you just downloaded. Follow the setup guide and accept any terms/conditions necessary
Open Android Studio. It should look like the photo below. Click on the More Actions drop down and select SDK manager.
Click SDK tools and checkmark the following boxes to install them.
Android SDK Build-Tools
Android SDK Command line Tools (latest)
Android Emulator
Android emulator hypervisor driver (installer)
Android SDK Platform tools
Once they are installed, add the following variables to your path to ensure they are accessible.
[Android SDK installation directory]/platform-tools
[Android SDK installation directory]/emulator
Download the Java Development Kit if you do not have it already. Make sure you know the directory it is installed in
Create some environment variables:
Create a JAVA_HOME variable and set the directory to your jdk installation
Create a ANDROID_HOME variable and set the directory to your android sdk installation
Run
flutter doctor
. If this is no longer showing you a warning/error for Android Studio and Android Toolchain, runflutter doctor --android-licenses
and accept all licenses. If you are still running into issues, watch this video here
Visual Studio Setup
Another dependency that you may not have already is Visual Studio (Different from Visual Studio Code). Follow these short steps to get it setup for Flutter.
Download Visual Studio. Navigate to where you downloaded it and open the exe
Once it prompts you to select add-on’s to download, include “Desktop development with C++” and all its default components
Run
flutter doctor
in your Command Prompt to confirm that you have it installed. If you find issues, watch this video here
VSCode Setup
Progress to this step ONLY IF you run flutter doctor
and have no issues. If you run into issues, refer to the setup guide provided by flutter linked in the reference section:
Start VSCode
Open a browser and go to the Visual Studio Marketplace. Here, search for the Flutter extension.
Click Install. Installing the Flutter extension also installs the Dart extension.
Validating your Setup with a Sample Project
If you want to make sure your setup works with an existing sample project you can find the complete instructions here or follow the steps below.
Setting up the test application
Open up VS Code
Invoke View > Command Palette.
Type “flutter”, and select the Flutter: New Project.
Select Application.
Create or select the parent directory for the new project folder.
Enter a project name, such as
my_app
, and press Enter.Wait for project creation to complete and the
main.dart
file to appear.
Running the test application
Locate the VS Code status bar (the blue bar at the bottom of the window):
Select a device from the Device Selector area (below
Invoke Run > Start Debugging or press F5.
Wait for the app to launch—progress is printed in the Debug Console view. The app should look something like this
If you see this screen, that means your setup is working! If you run into some errors, please make sure flutter doctor
does not return any issues, and you have everything correctly setup as per the instructions above. If you still run into issues, ask google!
References
Flutter
Java Developement Kit - https://www.oracle.com/ca-en/java/technologies/downloads/#jdk21-windows
Visual Studio - https://visualstudio.microsoft.com/downloads/
Android Studio - https://developer.android.com/studio
Mission Planner - Mission Planner Simulated Ardupilot