0

I'd like to use the overlayment package in Flutter to create a dragable "MDI" style window. This seems simple enough and the package even has a demo available for this exact use case.

However, there is a problem if you drag the window beyond the edge of the screen. The window starts to resize, even if it is constrained. The strange thing is that this only happens on the right and bottom edges, but not on the top and left. enter image description here

Also, the online demo seems to have been created with an older version of Flutter, where this doesn't occur at all. enter image description here

I'm looking for an explanation on why this behavior changed and why only two edges cause it? Some sort of fix or workaround would be great as well. It wouldn't bother me if the user was prevented from dragging the window beyond the edge of the screen. Sadly the package does not provide an onDrag callback or anything like that.

import 'dart:math';
import 'package:flutter/material.dart';
import 'package:overlayment/overlayment.dart';
void main() {
 runApp(const MyApp());
}
class MyApp extends StatelessWidget {
 const MyApp({Key? key}) : super(key: key);
 // This widget is the root of your application.
 @override
 Widget build(BuildContext context) {
 final key = GlobalKey<NavigatorState>();
 Overlayment.navigationKey = key;
 return MaterialApp(
 navigatorKey: key,
 home: Scaffold(
 appBar: AppBar(title: const Text('Overlayment')),
 body: ElevatedButton(
 onPressed: () => show(), child: const Text('New window')),
 floatingActionButton: FloatingActionButton(
 onPressed: Overlayment.dismissAll,
 child: const Icon(Icons.close),
 ),
 ),
 );
 }
 void show() {
 final name = Random().nextInt(1000).toString();
 Overlayment.show(OverWindow(
 name: name,
 position: const Offset(50, 50),
 canMove: true,
 child: child(name),
 ));
 }
 Widget child(String name) => Padding(
 padding: const EdgeInsets.all(15.0),
 child: Column(
 children: [
 Text('Window $name'),
 const Text('This this cool Window'),
 const SizedBox(height: 8),
 ElevatedButton(
 onPressed: () => Overlayment.dismissName(name),
 child: const Text('Dismiss'),
 )
 ],
 ),
 );
}
DarkBee
14.4k9 gold badges86 silver badges135 bronze badges
asked Mar 25, 2025 at 6:50

0

Know someone who can answer? Share a link to this question via email, Twitter, or Facebook.

Your Answer

Draft saved
Draft discarded

Sign up or log in

Sign up using Google
Sign up using Email and Password

Post as a guest

Required, but never shown

Post as a guest

Required, but never shown

By clicking "Post Your Answer", you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.