Flutter/Dart中如何将类和函数迁移至单独文件？

一、正确迁移组件和工具函数到my_classes.dart #

完全可以把InternetRoute组件和showInternetDialog函数迁移到新文件，直接复制核心代码是可行的，但要注意以下几点：

1. 创建并编写my_classes.dart #

在项目目录下新建my_classes.dart文件，把代码复制进去，同时必须导入依赖的包：

// my_classes.dart
import 'package:flutter/material.dart';
import 'dart:io'; // 因为用到了SocketException和InternetAddress

// Internet route
class InternetRoute extends StatefulWidget {
  const InternetRoute({Key? key}) : super(key: key);

  @override
  State<InternetRoute> createState() => _InternetRouteState();
}

class _InternetRouteState extends State<InternetRoute> {
  bool activeConnection = false; // 建议变量名用小驼峰，符合Dart规范
  String tipText = "";

  Future<void> checkUserConnection() async {
    try {
      final result = await InternetAddress.lookup('example.com');
      if (result.isNotEmpty && result[0].rawAddress.isNotEmpty) {
        setState(() {
          activeConnection = true;
          tipText = "Turn off the data and repress again";
        });
      }
    } on SocketException catch (_) {
      setState(() {
        activeConnection = false;
        tipText = "Turn On the data and repress again";
        showInternetDialog(context);
      });
    }
  }

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("GeeksforGeeks"),
      ),
      body: Column(
        children: [
          Text("Active Connection? $activeConnection"),
          const Divider(),
          Text(tipText),
          OutlinedButton(
            onPressed: checkUserConnection,
            child: const Text("Check")
          )
        ],
      ),
    );
  }
}

// Alert Dialog about Internet connection
void showInternetDialog(BuildContext context) {
  // set up the button
  Widget okButton = Center(
    child: TextButton(
      child: const Text("OK"),
      onPressed: () {
        Navigator.of(context).pop(); // dismiss dialog
      },
    ),
  );

  // set up the AlertDialog
  AlertDialog alert = AlertDialog(
    content: const Text("Internet connection required"),
    actions: [
      okButton,
    ],
  );

  // show the dialog
  showDialog(
    context: context,
    builder: (BuildContext context) {
      return alert;
    },
  );
}

2. 在main.dart中导入并使用 #

在main.dart顶部添加导入语句：

import 'my_classes.dart';

之后你就可以像使用本地组件一样引用InternetRoute了，比如：

// 示例：在main.dart的MaterialApp中使用
void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: const InternetRoute(), // 直接使用迁移后的组件
    );
  }
}

3. 关于变量可见性的说明 #

• _InternetRouteState是私有类（以_开头），只能在my_classes.dart内部访问，其他页面无法直接引用，但这没关系——你只需要公开的InternetRoute组件即可。
• showInternetDialog是顶层函数，只要导入了my_classes.dart，任何页面都可以调用它。
• activeConnection和tipText是_InternetRouteState的私有成员，其他页面无法直接访问，如果你需要在外部使用这些状态，建议通过状态管理方案（比如Provider、Riverpod）来共享。

二、修复CheckUserConnection类的错误 #

你封装时遇到的问题是几个典型的Dart/Flutter基础误区：

1. 类名和方法名重名：Dart会把和类同名的方法识别为构造函数，构造函数不能有返回类型、不能用async修饰，这就是你看到"Constructors can't have a return type"等错误的原因。
2. 普通类无法调用setState：setState是State类的专属方法，只有继承自State的类才能使用，普通工具类没有这个方法。

下面给你两种可行的封装方案：

方案1：封装成独立的工具函数（最简单） #

不需要类，直接把网络检测写成异步函数，返回检测结果：

// my_classes.dart
import 'dart:io';

Future<(bool isConnected, String message)> checkUserConnection() async {
  try {
    final result = await InternetAddress.lookup('example.com');
    if (result.isNotEmpty && result[0].rawAddress.isNotEmpty) {
      return (true, "Turn off the data and repress again");
    }
  } on SocketException catch (_) {
    return (false, "Turn On the data and repress again");
  }
  return (false, "Unknown connection error");
}

然后在_InternetRouteState中调用：

Future<void> updateConnectionStatus() async {
  final (isConnected, message) = await checkUserConnection();
  setState(() {
    activeConnection = isConnected;
    tipText = message;
    if (!isConnected) {
      showInternetDialog(context);
    }
  });
}

方案2：封装成带状态管理的类（适合全局共享状态） #

如果需要在多个页面共享网络连接状态，可以用ChangeNotifier来封装：

// my_classes.dart
import 'dart:io';
import 'package:flutter/foundation.dart';

class ConnectionManager extends ChangeNotifier {
  bool _isConnected = false;
  String _statusMessage = "";

  bool get isConnected => _isConnected;
  String get statusMessage => _statusMessage;

  Future<void> checkConnection() async {
    try {
      final result = await InternetAddress.lookup('example.com');
      if (result.isNotEmpty && result[0].rawAddress.isNotEmpty) {
        _isConnected = true;
        _statusMessage = "Turn off the data and repress again";
      }
    } on SocketException catch (_) {
      _isConnected = false;
      _statusMessage = "Turn On the data and repress again";
    }
    notifyListeners(); // 通知所有监听者更新UI
  }
}

然后在页面中使用（需要配合Provider包，或者手动添加监听）：

// 在_InternetRouteState中
late ConnectionManager _connectionManager;

@override
void initState() {
  _connectionManager = ConnectionManager();
  _connectionManager.addListener(() {
    setState(() {}); // 状态变化时刷新UI
    if (!_connectionManager.isConnected) {
      showInternetDialog(context);
    }
  });
  _connectionManager.checkConnection();
  super.initState();
}

// 在build方法中使用状态
@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: const Text("GeeksforGeeks")),
    body: Column(
      children: [
        Text("Active Connection? ${_connectionManager.isConnected}"),
        const Divider(),
        Text(_connectionManager.statusMessage),
        OutlinedButton(
          onPressed: _connectionManager.checkConnection,
          child: const Text("Check")
        )
      ],
    ),
  );
}

内容的提问来源于stack exchange，提问作者Texter