How to Create a Desktop Window Application in Flutter?

The Flutter team recently released Flutter version 2.10 with Desktop support. Desktop support allows you to compile Flutter source code to a native Windows, macOS, or Linux desktop app. Flutter’s desktop support also extends to plugins—you can install existing plugins that support the Windows, macOS, or Linux platforms, or you can create your own.  

Requirement

As you know, Desktop support is available in Flutter version 2.10 or higher. So you need version 2.10 or higher. Upgrade Flutter SDK from the command line:

flutter upgrade

flutter upgrade

Create New Project

Create a new Flutter application using the command Prompt. To create a new app, write the following command and run it.

flutter create app_name

To know more about it refer this article: Creating a Simple Application in Flutter

Set up

On Windows, desktop support is enabled on Flutter 2.10 or higher. On macOS and Linux, desktop support is disabled by default in the stable channel. You can manually enable it with one of these commands, depending on which platform you are running:

flutter config --enable-macos-desktop flutter config --enable-linux-desktop

Note: You only need to execute flutter config –enable-<platform>-desktop once.

To test that desktop support is configured, use the flutter devices command to list the available targets. 

flutter devices 

flutter devices

This will show you the available devices in your system. You might also run flutter doctor to see if there are any unresolved issues. You should see a checkmark for each successfully configured area. It should look something like the following on Windows, with an entry for “develop for Windows”:

flutter doctor

Create and Run

Creating a windows desktop app is simple as creating a flutter project for another platform like Android. Once you’ve configured your environment for desktop support, you can create and run a desktop application either in the IDE or from the command line. Don’t remove the default code, we are going to run the default code of flutter.

import 'package:flutter/material.dart';

// Entry point of the Flutter application
void main() {
  runApp(const MyApp());
}

// Root widget of the application
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Flutter Demo',
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

// Stateful widget for the home page
class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  // Title of the home page
  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

// State class for MyHomePage
class _MyHomePageState extends State<MyHomePage> {
  // Counter to track button presses
  int _counter = 0;

  // Method to increment the counter
  void _incrementCounter() {
    // Increment the counter and update the UI
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'You have pushed the button this many times:',
            ),
            // Display the current counter value
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headlineMedium,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        // Increment counter when button is pressed
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}

Run From IDE

From IDE, you have to click on Start Debugging in the top right corner as shown image below.

Start Debugging

This will take a few minutes,

Run From Command Line 

cd project-name
flutter run -d windows

Build a release app

 To generate the release build, run the following in the command line,

flutter build windows
flutter build macos
flutter build linux