opt chat window on its overlay, make window focusable as a desktop app

flutter/lib/common/widgets/overlay.dart

@@ -1,6 +1,7 @@
 import 'package:auto_size_text/auto_size_text.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_hbb/common.dart';
+import 'package:get/get_state_manager/src/rx_flutter/rx_obx_widget.dart';
 import 'package:provider/provider.dart';
 
 import '../../consts.dart';
@@ -91,11 +92,14 @@ class DraggableChatWindow extends StatelessWidget {
               bottom: BorderSide(
                   color: Theme.of(context).hintColor.withOpacity(0.4)))),
       height: 38,
+      child: Obx(() => Opacity(
+          opacity: chatModel.isWindowFocus.value ? 1.0 : 0.4,
           child: Row(
             mainAxisAlignment: MainAxisAlignment.spaceBetween,
             children: [
               Padding(
-              padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 8),
+                  padding:
+                      const EdgeInsets.symmetric(horizontal: 15, vertical: 8),
                   child: Row(children: [
                     Icon(Icons.chat_bubble_outline,
                         size: 20, color: Theme.of(context).colorScheme.primary),
@@ -112,7 +116,7 @@ class DraggableChatWindow extends StatelessWidget {
                     boxSize: 32,
                   ))
             ],
-      ),
+          ))),
     );
   }
 }
@@ -304,15 +308,17 @@ class _DraggableState extends State<Draggable> {
     if (widget.checkKeyboard) {
       checkKeyboard();
     }
-    if (widget.checkKeyboard) {
+    if (widget.checkScreenSize) {
       checkScreenSize();
     }
-    return Positioned(
+    return Stack(children: [
+      Positioned(
           top: _position.dy,
           left: _position.dx,
           width: widget.width,
           height: widget.height,
-        child: widget.builder(context, onPanUpdate));
+          child: widget.builder(context, onPanUpdate))
+    ]);
   }
 }
 

flutter/lib/models/chat_model.dart

@@ -4,6 +4,8 @@ import 'package:dash_chat_2/dash_chat_2.dart';
 import 'package:draggable_float_widget/draggable_float_widget.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_hbb/models/platform_model.dart';
+import 'package:get/get_rx/src/rx_types/rx_types.dart';
+import 'package:get/get_state_manager/src/rx_flutter/rx_obx_widget.dart';
 import 'package:window_manager/window_manager.dart';
 
 import '../consts.dart';
@@ -37,6 +39,8 @@ class ChatModel with ChangeNotifier {
   OverlayEntry? chatWindowOverlayEntry;
   bool isConnManager = false;
 
+  RxBool isWindowFocus = true.obs;
+
   final ChatUser me = ChatUser(
     id: "",
     firstName: "Me",
@@ -133,11 +137,28 @@ class ChatModel with ChangeNotifier {
     final overlayState = _getOverlayState();
     if (overlayState == null) return;
     final overlay = OverlayEntry(builder: (context) {
-      return DraggableChatWindow(
+      bool innerClicked = false;
+      return Listener(
+          onPointerDown: (_) {
+            if (!innerClicked) {
+              isWindowFocus.value = false;
+            }
+            innerClicked = false;
+          },
+          child: Obx(() => Container(
+              color: isWindowFocus.value ? Colors.red.withOpacity(0.3) : null,
+              child: Listener(
+                  onPointerDown: (_) {
+                    innerClicked = true;
+                    if (!isWindowFocus.value) {
+                      isWindowFocus.value = true;
+                    }
+                  },
+                  child: DraggableChatWindow(
                       position: const Offset(20, 80),
                       width: 250,
                       height: 350,
-          chatModel: this);
+                      chatModel: this)))));
     });
     overlayState.insert(overlay);
     chatWindowOverlayEntry = overlay;