flutter windows串口列表获取以及参数设置示例

这段代码提供了一个基本的框架，用于配置和显示串口通信的设置，打开对话框后，搜索获取本机可用串口，现在在串口选择框供用户选择，其他串口参数也做了预定义，在相应的选择框选择。点击确认按钮这些数据返回给主界面显示。

import 'package:flutter/material.dart';
import 'package:flutter_libserialport/flutter_libserialport.dart';

// 创建DropdownButton的函数，onChanged参数是可选的
DropdownButton<String> createDropdownButton(List<String> items, String? currentValue, {void Function(String?)? onChanged}) {
  return DropdownButton<String>(
    hint: Text('Select an item'),
    value: currentValue,
    onChanged: onChanged ?? ((String? newValue) {}),
    items: items.map<DropdownMenuItem<String>>((String value) {
      return DropdownMenuItem<String>(
        value: value,
        child: Text(value),
      );
    }).toList(),
  );
}

class SerialPortSelectionDialog {
  Future<Map<String, String>?> show(BuildContext context, StateSetter setState) async {
    final portNames = SerialPort.availablePorts;
    String? selectedPort;
    String? selectedBaudRate;
    String? selectedDataBits;
    String? selectedParity;
    String? selectedStopBits;

    return showDialog<Map<String, String>?>(
      context: context,
      builder: (BuildContext context) {
        return AlertDialog(
          title: Text('Select serial port settings'),
          content: StatefulBuilder(
            builder: (BuildContext context, StateSetter _setState) {
              return Column(
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  Text('Port:'),
                  createDropdownButton(
                    portNames,
                    selectedPort,
                    onChanged: (String? newValue) {
                      _setState(() {
                        selectedPort = newValue;
                      });
                    },
                  ),
                  SizedBox(height: 10),
                  Text('Baud rate:'),
                  createDropdownButton(
                    ['9600', '19200', '38400', '57600', '115200'],
                    selectedBaudRate,
                    onChanged: (String? newValue) {
                      _setState(() {
                        selectedBaudRate = newValue;
                      });
                    },
                  ),
                  SizedBox(height: 10),
                  Text('Data bits:'),
                  createDropdownButton(
                    ['8', '7', '6', '5'],
                    selectedDataBits,
                    onChanged: (String? newValue) {
                      _setState(() {
                        selectedDataBits = newValue;
                      });
                    },
                  ),
                  SizedBox(height: 10),
                  Text('Parity:'),
                  createDropdownButton(
                    ['None', 'Odd', 'Even'],
                    selectedParity,
                    onChanged: (String? newValue) {
                      _setState(() {
                        selectedParity = newValue;
                      });
                    },
                  ),
                  SizedBox(height: 10),
                  Text('Stop bits:'),
                  createDropdownButton(
                    ['1', '1.5', '2'],
                    selectedStopBits,
                    onChanged: (String? newValue) {
                      _setState(() {
                        selectedStopBits = newValue;
                      });
                    },
                  ),
                ],
              );
            },
          ),
          actions: <Widget>[
            TextButton(
              child: Text('CANCEL'),
              onPressed: () {
                Navigator.of(context).pop();
              },
            ),
            TextButton(
              child: Text('OK'),
              onPressed: () {
                Navigator.of(context).pop({
                  'port': selectedPort ?? '',
                  'baudRate': selectedBaudRate ?? '',
                  'dataBits': selectedDataBits ?? '',
                  'parity': selectedParity ?? '',
                  'stopBits': selectedStopBits ?? '',
                });
              },
            ),
          ],
        );
      },
    );
  }
}

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Serial Port Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: SerialPortHome(),
    );
  }
}

class SerialPortHome extends StatefulWidget {
  @override
  _SerialPortHomeState createState() => _SerialPortHomeState();
}

class _SerialPortHomeState extends State<SerialPortHome> {
  String _selectedPort = 'No port selected';
  String _selectedBaudRate = 'No baud rate selected';

  Future<void> _showPortSelectionDialog() async {
    final result = await SerialPortSelectionDialog().show(context, setState);

    if (result != null) {
      setState(() {
        _selectedPort = result['port'] ?? 'No port selected';
        _selectedBaudRate = result['baudRate'] ?? 'No baud rate selected';
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Serial Port Demo'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text('Selected port: $_selectedPort'),
            Text('Selected baud rate: $_selectedBaudRate'),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _showPortSelectionDialog,
        tooltip: 'Select Port and Baud Rate',
        child: Icon(Icons.settings_input_component),
      ),
    );
  }
}

以下是对这段代码的分析：
一、整体功能概述
这段代码是一个使用 Flutter 框架开发的应用程序，主要功能是展示一个界面，用于选择串口设置，包括串口名称、波特率、数据位、校验位和停止位。用户可以通过点击悬浮按钮打开一个对话框，在对话框中进行这些设置的选择，选择完成后，界面上会显示所选的串口名称和波特率。

二、代码结构分析
导入部分
导入了package:flutter/material.dart，这是 Flutter 框架的基础库，提供了构建用户界面所需的各种组件和工具。
导入了package:flutter_libserialport/flutter_libserialport.dart，这个库可能用于与串口进行通信。

函数定义
createDropdownButton函数：
用于创建一个下拉菜单按钮（DropdownButton）。它接受一个字符串列表items表示下拉菜单的选项，一个可选的当前选中值currentValue，以及一个可选的回调函数onChanged。函数内部创建了一个DropdownButton，并使用传入的参数进行配置。
类定义
SerialPortSelectionDialog类：
这是一个用于显示串口设置对话框的类。
show方法：
以异步方式显示对话框。它接受一个BuildContext和一个 StateSetter作为参数。首先获取可用的串口名称列表，然后创建一个对话框， 对话框中包含了多个下拉菜单用于选择串口设置。当用户点击 “OK” 按钮时， 返回一个包含所选设置的Map<String, String>；当用户点击 “CANCEL” 按钮 时，返回null。
MyApp类：
这是 Flutter 应用的根组件。它定义了应用的主题和主页面。
SerialPortHome类：
这是应用的主页面组件。
_SerialPortHomeState类：
这是SerialPortHome的状态类。它维护了所选的串口名称和波特率，并提 供了一个方法_showPortSelectionDialog用于显示串口设置对话框。当从对话 框中返回结果时，更新界面上显示的串口名称和波特率。

主函数
main函数：调用runApp启动应用，传入MyApp作为根组件。

三、技术要点分析
状态管理：
使用StatefulWidget和State来管理应用的状态。例如，SerialPortHome是一个StatefulWidget，_SerialPortHomeState是它的状态类，用于维护所选的串口名称和波特率。
在SerialPortSelectionDialog中，使用StatefulBuilder来管理对话框内部的状态，以便在下拉菜单选项改变时更新界面。

异步操作：
SerialPortSelectionDialog.show方法是一个异步方法，使用showDialog显示对话框，并返回一个Future<Map<String, String>?>，表示可能的结果。
_showPortSelectionDialog方法也是异步的，它调用SerialPortSelectionDialog.show方法，并在结果不为null时更新状态。

界面构建：
使用MaterialApp构建应用的整体结构，包括主题和主页面。
使用Scaffold构建页面的基本布局，包括AppBar、body和 floatingActionButton。
在对话框和页面中使用Text、DropdownButton等组件构建用户界面。

功能扩展：可以进一步扩展应用的功能，例如实际进行串口通信、显示串口数据等。