flutter_clock/lib/index_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_clock/model/constants.dart';
import 'package:flutter_clock/pages/alarm_page.dart';
import 'package:flutter_clock/pages/clock_page.dart';
import 'package:flutter_clock/pages/stopwatch_page.dart';
import 'package:flutter_clock/pages/timer/timer_page.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

/// Description: main page
/// Time       : 04/06/2025 Sunday
/// Author     : liuyuqi.gov@msn.cn
class IndexPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _IndexPageState();
  }
}

class _IndexPageState extends State<IndexPage>
    with SingleTickerProviderStateMixin {
  late TabController _tabController;
  late List<Widget> _tabs;


  @override
  void initState() {
    super.initState();
    _tabController = TabController(
        length: 4,
        vsync: this,
        initialIndex: 3); // Timer tab is selected by default
    
    // Initialize tabs with screen adaptation
    _tabs = [
      Tab(text: 'Alarm'),
      Tab(text: 'Clock'),
      Tab(text: 'Stopwatch'),
      Tab(text: 'Timer'),  
    ];
    
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        elevation: 0,
        toolbarHeight: 60.h,
        title: TabBar(
          controller: _tabController,
          tabs: _tabs,
          labelColor: kPrimaryColor,
          unselectedLabelColor: kGrayColor,
          indicatorColor: kPrimaryColor,
          indicatorWeight: 3.h,
          labelPadding: EdgeInsets.symmetric(horizontal: 4.w),
          labelStyle: TextStyle(fontWeight: FontWeight.bold, fontSize: 15.sp),
          unselectedLabelStyle: TextStyle(fontWeight: FontWeight.normal, fontSize: 15.sp),
        ),
      ),
      body: TabBarView(
        controller: _tabController,
        children: [
          // Wrap each page with AutomaticKeepAlive widget to preserve state
          KeepAlivePage(child: AlarmPage()),
          KeepAlivePage(child: ClockPage()),
          KeepAlivePage(child: StopwatchPage()),
          KeepAlivePage(child: TimerPage()),
        ],
      ),
    );
  }
}

/// A wrapper widget that keeps its child alive when switching between tabs
class KeepAlivePage extends StatefulWidget {
  final Widget child;

  const KeepAlivePage({Key? key, required this.child}) : super(key: key);

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

class _KeepAlivePageState extends State<KeepAlivePage> with AutomaticKeepAliveClientMixin {
  @override
  bool get wantKeepAlive => true;

  @override
  Widget build(BuildContext context) {
    super.build(context); // Important: This must be called
    return widget.child;
  }
}