Flutter MQTT客户端服务插件mqtt_client_service的使用

特性

• 轻松发送和接收消息

开始使用

要使用此包，在您的 pubspec.yaml 文件中添加 mqtt_client_service 作为依赖项。

使用方法

以下是一个简单的示例，展示了如何使用 mqtt_client_service 插件：

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

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  late MQTTClientService mqttClientService;
  final String broker = 'broker.emqx.io';
  final String clientId = 'mqttx_3ced2008';
  final TextEditingController topicController = TextEditingController();
  final TextEditingController messageController = TextEditingController();
  List<String> receivedMessages = []; // 存储接收到的消息
  Set<String> subscribedTopics = {}; // 跟踪已订阅的主题

  [@override](/user/override)
  void initState() {
    super.initState();
    mqttClientService = MQTTClientService(broker, clientId);
    mqttClientService.onMessageReceived = onMessageReceived;
    mqttClientService.initializeMQTTClient();
  }

  void onMessageReceived(String topic, String message) {
    setState(() {
      receivedMessages.add('Topic: $topic, Message: $message');
    });
  }

  [@override](/user/override)
  void dispose() {
    mqttClientService.onDisconnected();
    super.dispose();
  }

  void handleSubscribe() {
    final topic = topicController.text;
    if (topic.isNotEmpty) {
      mqttClientService.onSubscribed(topic);
    }
  }

  void handleUnsubscribe() {
    final topic = topicController.text;
    if (topic.isNotEmpty) {
      mqttClientService.unSubscribed(topic);
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('MQTT Client Example'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: <Widget>[
            TextField(
              controller: topicController,
              decoration: const InputDecoration(labelText: '主题'),
            ),
            TextField(
              controller: messageController,
              decoration: const InputDecoration(labelText: '消息'),
            ),
            const SizedBox(height: 20),
            ElevatedButton(
              onPressed: handleSubscribe,
              child: const Text('订阅'),
            ),
            const SizedBox(height: 20),
            ElevatedButton(
              onPressed: handleUnsubscribe,
              child: const Text('取消订阅'),
            ),
            const SizedBox(height: 20),
            ElevatedButton(
              onPressed: () {
                mqttClientService.publishMessage(
                  topicController.text,
                  messageController.text,
                );
              },
              child: const Text('发布'),
            ),
            const SizedBox(height: 20),
            Expanded(
              child: ListView.builder(
                itemCount: receivedMessages.length,
                itemBuilder: (context, index) {
                  final messageData = receivedMessages[index];
                  print("Received Message : $messageData");
                  // 解析接收到的消息
                  final parts = messageData.split(', ');
                  final topic = parts[0].substring('Topic: '.length);
                  final message = parts[1].substring('Message: '.length);
                  return ListTile(
                    title: Row(
                      children: [
                        Expanded(
                          child: Text(topic),
                        ),
                        Expanded(
                          child: Text(message),
                        ),
                      ],
                    ),
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }
}