cloudsolutions-atoms/lib/service_request_latest/views/components/timer_widget.dart

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/models/size_config.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'package:test_sa/extensions/string_extensions.dart';
import 'package:test_sa/service_request_latest/request_detail_provider.dart';

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

  @override
  _TimerWidgetState createState() => _TimerWidgetState();
}


class _TimerWidgetState extends State<TimerWidget> {
  Offset position = Offset(SizeConfig.screenWidth! - 100, SizeConfig.screenHeight! / 2 - 50);
  @override
  void initState() {
    // TODO: implement initState
    Provider.of<RequestDetailProvider>(context,listen: false).startTimer();
    super.initState();
  }
  @override
  void dispose() {
    // TODO: implement dispose
    //dispose the timer...
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Consumer<RequestDetailProvider>(
      builder: (context, provider, child) {
        return Positioned(
          left: position.dx,
          top: position.dy,
          child: GestureDetector(
            onPanEnd: (details){},
            onPanUpdate: (details) {
              setState(() {
                if (position.dy + details.delta.dy > 0 && position.dy + details.delta.dy < 560) {
                  position = Offset(
                    position.dx + details.delta.dx, // Update the X position
                    position.dy + details.delta.dy, // Update the Y position
                  );
                }
              });
            },
            child: buildTimerWidget(provider),
          ),
        );
      },
    );
  }

  Widget buildTimerWidget(RequestDetailProvider provider) {
    return GestureDetector(
      onTap: () {
        if (provider.isTimerRunning) {
          provider.stopTimer();
        } else {
          provider.startTimer();
        }
      },
      child: Container(
        padding: EdgeInsets.all(8.toScreenHeight),
        width: 80.toScreenWidth,
        decoration: BoxDecoration(
          color: AppColor.black10,
          borderRadius: BorderRadius.circular(10),
        ),
        child:
        Column(
                children: [
                  'drag_icon'.toSvgAsset(),
                  12.height,
                  provider.currentTime.toString().toDragAbleTimerFormat.tinyFont(context).custom(color: AppColor.white10, fontWeight: FontWeight.w600),
                  2.height,
                  context.translation.hours.tinyFont(context).custom(color: AppColor.white10, fontWeight: FontWeight.w600),
                ],
              ),
      ),
    );
  }
}

  //older code...
  // DateTime startTime = DateTime(0, 0, 0, 0, 0, 0); // Start from 00:00:00
  // Timer timer;
  // bool isRunning = false;
  //
  // @override
  // void initState() {
  //   super.initState();
  //  startTimer();
  // }
  //
  // void startTimer() {
  //   if (isRunning) return;
  //   timer = Timer.periodic(const Duration(seconds: 1), (Timer t) {
  //     setState(() {
  //       startTime = startTime.add(const Duration(seconds: 1));
  //     });
  //   });
  //   setState(() {
  //     isRunning = true;
  //   });
  // }
  //
  // void stopTimer() {
  //   timer?.cancel();
  //   setState(() {
  //     isRunning = false;
  //   });
  // }
  // @override
  // void dispose() {
  //   timer?.cancel();
  //   super.dispose();
  // }
  //
  // @override
  // Widget build(BuildContext context) {
  //   return Positioned(
  //     left: position.dx,
  //     top: position.dy,
  //     child: GestureDetector(
  //       onPanUpdate: (details) {
  //         setState(() {
  //           //calculate the exact bonds to be restrict the drag..
  //           if(position.dy + details.delta.dy>0&&position.dy + details.delta.dy<560){
  //             position = Offset(
  //               position.dx + details.delta.dx, // Update the X position
  //               position.dy + details.delta.dy, // Update the Y position
  //             );
  //           }
  //         });
  //       },
  //       child: buildTimerWidget(),
  //     ),
  //   );
  //   // return Positioned(
  //   //   left: position.dx,
  //   //   top: position.dy,
  //   //   child: Draggable(
  //   //     feedback: buildTimerWidget(),
  //   //     childWhenDragging: Container(),
  //   //     onDragEnd: (dragDetails) {
  //   //       setState(() {
  //   //         // Get the RenderBox of the parent widget (Stack)
  //   //         final renderBox = context.findRenderObject() as RenderBox;
  //   //
  //   //         // Convert the global position to a local position inside the Stack
  //   //         position = dragDetails.offset;
  //   //       });
  //   //     },
  //   //     child: buildTimerWidget(),
  //   //   ),
  //   // );
  // }
  //
  // Widget buildTimerWidget() {
  //   return GestureDetector(
  //     onTap: (){
  //       if(isRunning){
  //         stopTimer();
  //       }else{
  //         startTimer();
  //       }
  //     },
  //     child: Container(
  //       padding: EdgeInsets.all(8.toScreenHeight),
  //       width: 80.toScreenWidth,
  //       decoration: BoxDecoration(
  //         color: AppColor.black10,
  //         borderRadius: BorderRadius.circular(10),
  //       ),
  //       child: Column(
  //         children: [
  //           'drag_icon'.toSvgAsset(),
  //           12.height,
  //           startTime.toString().toDragAbleTimerFormat.tinyFont(context).custom(color: AppColor.white10, fontWeight: FontWeight.w600),
  //           2.height,
  //           context.translation.hours.tinyFont(context).custom(color: AppColor.white10, fontWeight: FontWeight.w600),
  //         ],
  //       ),
  //     ),
  //   );
  // }