How can i drag the circle in this flutter code I recently added the tap through functionality now I am unable to drag the circle is there anyone who can solve this problem.

In this code I have used a tap through function for tapping through the overlay but now I am unable to drag the circle as it is the overlay widget. So is there anyone to solve this problem.

Also, I am using a flutter overlay_popup package for showing overlay on other apps using my flutter app.

I have tried this code and I want to get a code correction.

import 'package:flutter/material.dart';
import 'package:overlay_pop_up/overlay_pop_up.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool isActive = false;

  @override
  void initState() {
    super.initState();
    overlayStatus();
  }

  Future<void> overlayStatus() async {
    isActive = await OverlayPopUp.isActive();
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Flutter overlay deepu '),
          backgroundColor: Colors.red[900],
        ),
        body: Center(
          child: MaterialButton(
            onPressed: () async {
              final permission = await OverlayPopUp.checkPermission();
              if (permission) {
                if (!await OverlayPopUp.isActive()) {
                  isActive = await OverlayPopUp.showOverlay(
                    width: 300,
                    height: 300,
                    closeWhenTapBackButton: false,
                    isDraggable: true,
                    backgroundBehavior: OverlayFlag.tapThrough,
                  );
                  setState(() {});
                } else {
                  final result = await OverlayPopUp.closeOverlay();
                  setState(() {
                    isActive = (result == true) ? false : true;
                  });
                }
              } else {
                await OverlayPopUp.requestPermission();
                setState(() {});
              }
            },
            color: Colors.red[900],
            child: Text(
              isActive ? 'Close overlay' : 'Show overlay',
              style: TextStyle(color: Colors.white),
            ),
          ),
        ),
      ),
    );
  }
}

@pragma("vm:entry-point")
void overlayPopUp() {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(
    const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: OverlayWidget(),
    ),
  );
}

class OverlayWidget extends StatelessWidget {
  const OverlayWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Material(
      color: Colors.transparent, // Set the color to transparent
      child: Stack(
        children: [
          Positioned.fill(
            child: Draggable(
              child: Stack(
                alignment: Alignment.center,
                children: [
                  Container(
                    decoration: BoxDecoration(
                      color: Colors.red.withOpacity(0.3), // Red color with less opacity
                      border: Border.all(color: Colors.red, width: 2.0), // Bold outline
                      shape: BoxShape.circle,
                    ),
                  ),
                  Center(
                    child: Text(
                      '•', // Dot character
                      style: TextStyle(
                        fontSize: 40, // Adjust the size of the dot as needed
                        color: Colors.black,
                      ),
                    ),
                  ),
                ],
              ),
              feedback: Material(
                color: Colors.transparent,
                child: Container(
                  decoration: BoxDecoration(
                    color: Colors.red.withOpacity(0.3), // Red color with less opacity
                    border: Border.all(color: Colors.red, width: 2.0), // Bold outline
                    shape: BoxShape.circle,
                  ),
                ),
              ),
              onDraggableCanceled: (_, __) {}, // Allow dragging
            ),
          ),
        ],
      ),
    );
  }
}