|
@@ -1,6 +1,12 @@
|
|
|
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});
|
|
@@ -10,17 +16,257 @@ class HomePage extends StatefulWidget {
|
|
|
}
|
|
|
|
|
|
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 TextButton(
|
|
|
- child: const Text("to login"),
|
|
|
- onPressed: () {
|
|
|
- print('跳转login');
|
|
|
- //Modular.to.popUntil(ModalRoute.withName('/'));
|
|
|
- Modular.to.navigate("/");
|
|
|
- },
|
|
|
+ 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,
|
|
|
+ ),
|
|
|
+ );
|
|
|
+ }
|
|
|
+}
|