Month: November 2022

Flutter Examples Repo

I’ve set up a github repo with some Flutter examples (here). Planning to keep adding to these as I do spare time learning.

Three examples up there…

  1. Handling mouse/touch tracking in Flutter
  2. Simple Polygon display in Flutter
  3. Point plotting and triangulation in Flutter

That last one is a project I did because I couldn’t figure out something I needed for work. I built a Flutter project from the ground up to allow me to understand the algorithm completely and to improve my Flutter skills. Hopefully it’ll be handy to someone as it allows you to experiment with the ear triangulation code

Advertisement

Useful Flutter Commands

Quick list of Flutter commands. I’ll keep adding to this as I think of them…

flutter doctor

This does a health check on your flutter installation and checks that everything is set up as it’s supposed to be. It’ll flag problems and will usually give instructions on how to solve those problems

If you want to find more detailed info (including installation paths) then add -v to get the verbose version

flutter devices

Checks for connected flutter capable devices (targets) and displays information on them. Will look something like this…

flutter doctor --android-licenses

This will agree to Android licenses. Often handy when flutter doctor points out that you haven’t agreed to them

flutter clean

Cleans the project and removes any content adding during a build. Handy for when you’re checking in and don’t want to additional files

flutter upgrade

upgrade flutter to the latest version

flutter build web

Build content to your local web directory to allow pushing to a website

flutter pub get

Will update the local dependencies to match the pubspec.yaml file

flutter build appbundle

This will build an aar for Android (assuming you’ve set everything up correctly)

Set up Visual Studio Code for use with Flutter

Install Visual Studio Code. Go here for the installer; https://code.visualstudio.com/

Click the “Download for Windows” (I’m assuming you’re using Windows)

When the installer finishes downloading then run it.

Agree to the terms and conditions (if you agree with them) and click “Next”

Select the install location (I leave it at the defaults) and click “Next”

Select the Start Menu Folder. Again, just hit “Next” and leave at the default

Select Additional Tasks. Again, I leave at the defaults and just click “Next”

“Ready to Install”… just click “Install”

Let the install complete…

…and we’re done. Just click “Finish” to launch VSCode

Once VSCode starts up, you’ll see something along the lines of this: –

Next, we need to install the Flutter extension

Select View->Command Palette. This will show a list of commands that can be executed withing VSCode

Type “Install Extensions” and select the line shown below

In the search box (shown below), type “Flutter” to find the Flutter extension. You’ll know you’ve got the right one as it’s got a LOT of installs

Click Install to install it

Wait for the install to complete…

If you now run flutter doctor again, you’ll see that it’s found the VSCode install (see below)

Setting up a New Flutter Project

Still in Visual Studio Code, select View->Command Palette and type “Flutter”. In the selection is shows (below), click on “Flutter: New Project”

Now, you could well see this (below). If you do then restart Visual Studio Code. It just needs a restart to find the flutter SDK. Either way, I’d recommend restarting VSCode after installing the Flutter extension

After a restart, repeat the View-Command Palette in the first step and you should now see this…

Select “Application”

Select a location to store the application in the dialog that shows

Now select the name for your application in this dialog

Then in the “Trust” dialog, select “yes, I trust the authors”

You will now see the screenshot below and you are ready to deploy your first flutter app

In the bottom right, you’ll see the pop-up below. Select Yes on this one to use the recommended settings

…and for this one, just click the cross in the upper right to close it

Now press F5 to build and deploy and you’ll see this…

You’ve now built and deployed your first Flutter app! Well done!

Installing Flutter

Go to https://docs.flutter.dev/get-started/install and select the OS that works for you

I’m working with Windows so I’ll step through what’s needed for that

Download the Flutter SDK by clicking the “flutter_windows_3.3.7-stable.zip” or whatever version it’s up to by the time you read this (approx 820MB)

Extract to c:\src

Add the c:\src\flutter\bin folder to your path (in the environment variables)

Open a command prompt (Press the Start Button  and type CMD[Enter])

Type “cd \src\flutter” to get to the flutter directory

Type “flutter doctor”. This will check the install is good and report any problems. In my case, I got the following: –

To resolve the “Unable to locate Android SDK” problem, install Android Studio from https://developer.android.com/studio/index.html

Once the Android studio install has completed, run “flutter doctor” again and you’ll see this: –

To solve the cmdline-tools problem, open the SDK Manager in Android Studio and install the Android SDK Command-line Tools as shown in the screenshots below: –

…and this is easily solved by typing “flutter doctor –android-licenses” and pressing [Enter]

Follow the prompts and accept the licenses and you’ll now see a clean bill of health

Ok. You now have Flutter installed!