Set min/max screen size in Flutter windows

I am developing a Windows flutter application. The app has already mobile versions and I am converting to windows. The mobile design is already there but I need to convert it to windows and the problem is the design is not ready yet.

For this reason, I have been given a task to find out how to give maximum width and height for the application so that the user cannot change the app screen size using the mouse.

Is there a way to implement this on Flutter windows?

Solution 1: Stefano Amorelli

Yes, we can limit the size of a Windows Flutter app by using the window_size package.

To use it in our app, we need to add it in our pubspec.yaml dependencies:

dependencies:
  flutter:
    sdk: flutter
  window_size:
    git:
      url: git://github.com/google/flutter-desktop-embedding.git
      path: plugins/window_size

And use it at initialization as follows below:

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:window_size/window_size.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  if (Platform.isWindows) {
    setWindowMaxSize(const Size(1024, 768));
    setWindowMinSize(const Size(512, 384));
  }
  runApp(MyApp());
}

Solution 2: Khamidjon Khamidov

METHOD 1

As @Stefano mentioned, I could use this library:

dependencies:
  window_size:
    git:
      url: git://github.com/google/flutter-desktop-embedding.git
      path: plugins/window_size

.

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:window_size/window_size.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  if (Platform.isWindows) {
    setWindowMaxSize(const Size(1024, 768));
    setWindowMinSize(const Size(512, 384));
    Future<Null>.delayed(Duration(seconds: 1), () {
        setWindowFrame(Rect.fromCenter(center: Offset(1000, 500), width: 600, height: 1000));
    });
  }
  runApp(MyApp());
}

But the problem here is that the window size is being set to default so it is changing its size after few seconds.

METHOD 2

Because, the first method didn't work as I expected I mixed the both methods:

In main.dart:

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  if (Platform.isWindows) {
    setWindowMaxSize(const Size(1024, 768));
    setWindowMinSize(const Size(512, 384));
  }
  runApp(MyApp());
}

In lib/windows/runner/win32_window.cpp: // this method already exists inside the file bool Win32Window::CreateAndShow(const std::wstring& title, const Point& origin, const Size& size) { Destroy();

  const wchar_t* window_class =
      WindowClassRegistrar::GetInstance()->GetWindowClass();

  const POINT target_point = {static_cast<LONG>(/*x // change here to move to center*/ 550),  // before -> origin.x
                              static_cast<LONG>(/*y // change here to move vertically*/ origin.y)}; // before -> origin.y
  HMONITOR monitor = MonitorFromPoint(target_point, MONITOR_DEFAULTTONEAREST);
  UINT dpi = FlutterDesktopGetDpiForMonitor(monitor);
  double scale_factor = dpi / 96.0;

  HWND window = CreateWindow(
      window_class, title.c_str(), WS_OVERLAPPEDWINDOW | WS_VISIBLE,
      Scale(/* x // move to center */ 550, scale_factor), Scale(/* y // move screen vertically */ origin.y, scale_factor),// before -> origin.x, origin.y
      Scale(/* width  // set default width */ 450, scale_factor), Scale(/* height // set default height */ 800, scale_factor), // before -> size.width, size.height
      nullptr, nullptr, GetModuleHandle(nullptr), this);

  if (!window) {
    return false;
  }

  return OnCreate();
}

Solution 3: Timotheux

Yes, this can be done and it also avoids the problem mentioned by @Khamidjon Khamidov. To achieve this, you will need to make changes in 3 files:

1. pubspec.yaml
2. main.cpp (at windows\runner\main.cpp)
3. main.dart

Add the code below to your pubspec.yaml, under dependencies and save the file.

window_size:
    git:
      url: https://github.com/google/flutter-desktop-embedding
      path: plugins/window_size

Change the code below in main.cpp:

Win32Window::Size size(1280, 720);
to
Win32Window::Size size(min_width, min_height)

The above code will ensure your app startup at the preferred size. Replace min_width and min_height with either your minimum or maximum value pair.

Modify your main.dart as show below:

void main() {
  WidgetsFlutterBinding.ensureInitialized();

  if (Platform.isWindows || Platform.isLinux || Platform.isMacOS) {
    setWindowTitle('My App');
    setWindowMaxSize(const Size(max_width, max_height));
    setWindowMinSize(const Size(min_width, min_height));
  }

  runApp(const MyApp());
}

Replace max_width, max_height, min_width and min_height with your preferred value.

Note: If you want a non-sizable form use the same min and max values.

Solution 4: Sunil Gupta

You can use methods like this, without additional packages. This is an example of setting the minimum window size:

await MethodChannel('desktop_window').invokeMethod('setMinWindowSize', {'width': 500, 'height': 800});

Solution 5: Abdulrahman Osama

You can use this Plugin to add the ability to control your window instance.

Installation

add this your your pubspec.yaml :

dependencies:
  window_manager: ^0.2.7

Usage

in your main() method add this :

void main() async{
  WidgetsFlutterBinding.ensureInitialized();
  await windowManager.ensureInitialized();
  if (Platform.isWindows) {
    WindowManager.instance.setMinimumSize(const Size(1200, 600));
    WindowManager.instance.setMaximumSize(const Size(1200, 600));
  }
  runApp(MyApp());
}    

and replace 1200, and 600 with your preferred size.