The Fluent Design is Microsoft’s solution for designing beautiful Windows programs. Flutter has finally expanded support to Windows UWP in Google I/O 2021, which calls for well-designed Windows apps. In this article, I will show you how to create a basic Fluent Design app with Flutter.

This guide will work best for Win32 and UWP Flutter apps. If you have not set up your UWP Flutter app yet, follow my  other guide to do so.

Add the required packages

The first step is to install the  fluent_ui package by  bdlukaa.

In a command line inside your app’s folder, type the following command:

flutter pub add fluent_ui

Now, it is time to start creating our Fluent Design app!

FluentApp

In main.dart, import the fluent_ui package:

import 'package:fluent_ui/fluent_ui.dart';

Then, create a FluentApp widget in the build function. This is the base of your Fluent app.

return FluentApp();

#flutter #uwp #windows