flutter_nayou/lib/app/pages/home/home_page.dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_modular/flutter_modular.dart';
enum ImageType {
  CUSTOMER,
  PROMOTION,
  TUTORIAL,
  RENEWAL,
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {



  final Map<ImageType, String> imageMap = {
    ImageType.CUSTOMER: "images/main/customer.png",
    ImageType.PROMOTION: "images/main/promotion.png",
    ImageType.TUTORIAL: "images/main/tutorial.png",
    ImageType.RENEWAL: "images/main/renewal.png",
  };


  void onImageTap(ImageType type) {
    print("${imageMap[type]} tapped as ${type.toString().split('.').last}");
  }


  ConnectionStatus _status = ConnectionStatus.disconnected;

  void _simulateStatusChange() {
    setState(() {
      switch (_status) {
        case ConnectionStatus.disconnected:
          _status = ConnectionStatus.connecting;
          break;
        case ConnectionStatus.connecting:
          _status = ConnectionStatus.stopped;
          break;
        case ConnectionStatus.stopped:
          _status = ConnectionStatus.disconnected;
          break;
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return  Scaffold(
      body: Container(
        decoration: const BoxDecoration(
            image: DecorationImage(
              image: AssetImage("images/main/main.png"),
              fit: BoxFit.fill,
            )
        ),
        child: Column(

          children: [
            const UserStatusWidget(isActive: true),
            Padding(
              padding: const EdgeInsets.fromLTRB(20, 25, 0, 0),
              child: Row(
                children: imageMap.entries.expand((entry) {
                  return [
                    GestureDetector(
                      onTap: () => onImageTap(entry.key),
                      child: Image(
                        image: AssetImage(entry.value),
                        width: 60,
                        height: 60,
                      ),
                    ),
                    //Spacer(), // 平均分配间隔
                    SizedBox(width: 30),
                  ];
                }).toList()..removeLast(), // 删除最后一个Spacer
              )

            ),
            const SizedBox(height: 30,),
            const Padding(
              padding: EdgeInsets.fromLTRB(30, 0 , 30, 0),
              child: Row(
                children: [

                    Text("http://127.0.0.1:5336"),
                    Spacer(),
                    Text("socks://127.0.0.1:5337"),
                ],
              ),
            ),
            ConnectionWidget(status: ConnectionStatus.disconnected,onStatusChange: (con) {

            },)
          ],
        )
      ),
    );
  }

}




class UserStatusWidget extends StatefulWidget {
  final bool isActive;

  const UserStatusWidget({Key? key, required this.isActive}) : super(key: key);

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

class _UserStatusWidgetState extends State<UserStatusWidget> {
  @override
  Widget build(BuildContext context) {
    String imagePath = widget.isActive ? "images/main/userstatus.png" : "images/main/userstatusoff.png";

    return Align(
      alignment: Alignment.topCenter,
      child: Padding(
        padding: const EdgeInsets.fromLTRB(10.0, 40.0, 10.0, 10.0),
        child:
            Row(
              children: [
                const SizedBox(
                  width: 80,
                  height: 20,
                ),
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,  // 这将使子组件从左边开始对齐
                  children: [
                    Row(
                      children: [
                        const Text("用户名: xxxxx"),
                        const SizedBox(width: 10,),
                        Image(
                          image: AssetImage(imagePath),
                          width: 100,
                          height: 30,
                        ),
                        const SizedBox(width: 10,),
                        IconButton(
                          icon: Image.asset("images/main/refresh.png"),
                          onPressed: () {
                            // 刷新操作
                          },
                        )
                      ],
                    ),
                    const Text(
                      '到期时间: xxx-xx-xx',
                      style: TextStyle(
                        fontSize: 8.0,  // 设置字体大小为20像素
                      ),
                    ),
                    const Text(
                      '用户流量: 5G',
                      style: TextStyle(
                        fontSize: 8.0,  // 设置字体大小为20像素
                      ),
                    )
                  ],
                ),
              ],
            ),
           // const SizedBox(height: 10,),  // 可调整间隔
      ),
    );

  }
}


enum ConnectionStatus { disconnected, connecting, stopped }
 

class ConnectionWidget extends StatefulWidget {

  final ConnectionStatus status;
  final Function(ConnectionStatus) onStatusChange;
  ConnectionWidget({required this.status, required this.onStatusChange});

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

class _ConnectionWidgetState extends State<ConnectionWidget> {

  ConnectionStatus _currentStatus = ConnectionStatus.disconnected;
  late AssetImage currentImage;

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

  void _updateStatus() {
    setState(() {
      switch (_currentStatus) {
        case ConnectionStatus.disconnected:
          _currentStatus = ConnectionStatus.connecting;
          Future.delayed(const Duration(seconds: 5), () {
            if (mounted) { // 确保Widget仍然在Widget树中
              setState(() {
                _currentStatus = ConnectionStatus.stopped;
                _updateImage();
              });
            }
          });
          break;
        case ConnectionStatus.connecting:
        // 在"connecting"状态时加入延迟

          //_currentStatus = ConnectionStatus.stopped;
          break;
        case ConnectionStatus.stopped:
          _currentStatus = ConnectionStatus.disconnected;
          break;
      }
      _updateImage();
    });
  }

  @override
  void didUpdateWidget(ConnectionWidget oldWidget) {
    super.didUpdateWidget(oldWidget);
    _updateImage();
  }

  void _updateImage() {
    switch (_currentStatus) {
      case ConnectionStatus.disconnected:
        currentImage = const AssetImage('images/main/disconnected.gif');
        break;
      case ConnectionStatus.connecting:
        currentImage = const AssetImage('images/main/connecting.gif');
        break;
      case ConnectionStatus.stopped:
        currentImage = const AssetImage('images/main/stopped.gif');
        break;
    }
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        _updateStatus();
        // Add your action on tap here
        // ScaffoldMessenger.of(context).showSnackBar(
        //   SnackBar(content: Text('Status: ${widget.status.toString()}')),
        // );
      },
      child: Image(
          image: currentImage,
        width: 250,
        height: 250,
      ),
    );
  }
}