Skip to main content

Step by step guide to installing Flutter on Windows

 


Step 1: System Requirements

Ensure your system meets the following requirements:

  • Operating System: Windows 10 or later (64-bit).
  • Disk Space: 1.64 GB (minimum) for Flutter SDK, plus additional space for IDE/tools.
  • Tools:
    • Git for Windows: Download here.
    • Command Prompt (cmd) or PowerShell.

Step 2: Download Flutter SDK

  1. Go to the official Flutter website.
  2. Download the Windows Flutter SDK .zip file.
  3. Extract the .zip file to a directory, such as C:\src\flutter.

Step 3: Add Flutter to System PATH

  1. Open Environment Variables:
    • Search for "Environment Variables" in the Windows Start menu.
    • Click Edit the system environment variables > Environment Variables.
  2. Under System variables, find and select the Path variable.
  3. Click Edit and add the path to the Flutter bin directory (e.g., C:\src\flutter\bin).

Step 4: Verify Installation

  1. Open a new Command Prompt or PowerShell window.
  2. Run:
    bash
    flutter doctor
    • This checks your installation and lists missing dependencies.

Step 5: Install Android Studio

  1. Download and install Android Studio.
  2. Open Android Studio and go to Settings > SDK Manager.
    • Install the Android SDK and SDK Platform Tools.
    • Install Android Virtual Device (AVD) for emulators.
  3. Set up an Android Emulator:
    • Open AVD Manager in Android Studio.
    • Create a virtual device.

Step 6: Install Flutter Plugins in Android Studio

  1. In Android Studio, go to File > Settings > Plugins.
  2. Search for "Flutter" and click Install.
    • This also installs the Dart plugin automatically.

Step 7: Configure an Editor (Optional)

  • Visual Studio Code (VS Code):
    • Install VS Code.
    • Add the Flutter and Dart extensions from the VS Code marketplace.

Step 8: Run a Test Flutter App

  1. Create a new project:
    bash
    flutter create my_first_app cd my_first_app
  2. Run the app on an emulator or connected device:
    bash
    flutter run

Troubleshooting Tips

  • If flutter doctor shows errors, follow the recommended fixes.
  • Ensure Android SDK is properly installed and linked by setting the ANDROID_HOME environment variable.
  • Update Flutter regularly with:
    bash
    flutter upgrade

With these steps, Flutter should be successfully installed on your Windows machine.

Comments

Your Complete Flutter Roadmap: From Beginner to Pro

🌀 Flutter App Lifecycle – Easy Way to Understand

  When you build an app in Flutter , it goes through different states depending on how the user interacts with it (open, minimize, back button, etc). Think of it like a human day cycle – Wake up → Active → Sleep → Wake again . 🌱 1. main() – Birth of the App Every Flutter app starts from the main() function. void main() { runApp(MyApp()); } 👉 This is like turning ON the lights – your app is born. 🏗 2. Widgets Lifecycle In Flutter, everything is a Widget . There are two main types: StatelessWidget → UI that doesn’t change. StatefulWidget → UI that changes with user interaction. For StatefulWidget , the lifecycle looks like this: 🔹 When Widget is created createState() → Creates a State object (like preparing memory). initState() → First time setup (like waking up, stretching, preparing breakfast). Best place for API calls , animation controllers , initial values . 🔹 When Widget builds build() → Renders UI (like dressin...

📱 Flutter ListTile and ListView: Explained with Easy Examples

Flutter ListTile and ListView: When you start learning Flutter, two widgets often confuse beginners: ListTile  &  ListView . Both are used to display items in a list, but their purpose is different. Let’s break them down in a simple way. 🔹 What is ListTile in Flutter? ListTile is a ready-made widget used to show a single row (one item). It usually contains: title (main text) subtitle (small text under the title) leading (icon/image on the left) trailing (icon/text on the right) 👉 Think of ListTile as a single row card inside a list. ✅ Example of ListTile: import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar(title: const Text("Flutter ListTile Example")), body: const ListTile( leading:...

Text Widget In Flutter

  The Text widget in Flutter is used to display text on the screen. It's one of the most fundamental widgets and supports a wide range of customizations to style, align, and manage text. Here’s a detailed overview: Basic Syntax dart Copy code Text( 'Hello, Flutter!', style: TextStyle(fontSize: 24, color: Colors.blue), textAlign: TextAlign.center, ) Key Properties data : The text string to display. Example: 'Hello, World!' . style : Defines the appearance of the text. Uses the TextStyle class for customization. Example : dart Copy code Text( 'Styled Text', style: TextStyle( fontSize: 20, fontWeight: FontWeight.bold, color: Colors.red, fontStyle: FontStyle.italic, letterSpacing: 2.0, wordSpacing: 5.0, decoration: TextDecoration.underline, ), ) textAlign : Aligns the text horizontally. Values: TextAlign.left , TextAlign.right , TextAlign.center , TextAlign.justify , etc. Example: dart Copy code textAlign: TextAlign.cente...