Flutter MQTT通信插件mqtt_helper的使用

发布于 1周前 作者 sinazl 来自 Flutter

Flutter MQTT通信插件mqtt_helper的使用

mqtt_helper 是一个为 mqtt_client 提供更简单、更直观API的封装包,使得在Flutter项目中使用MQTT变得更加容易。

Features

  • Wrapper类:覆盖了 mqtt_client 的所有功能。
  • 事件监听器:提供了对 mqtt_client 事件和其他回调的支持。
  • 简化使用
    • 提供连接状态变化和事件的监听器。
    • 支持订阅和取消订阅单个或多个主题。
    • 允许发布消息到MQTT主题。

Getting Started

首先,在你的 pubspec.yaml 文件中添加 mqtt_helper 依赖:

dependencies:
  mqtt_helper: <latest-version>

Usage

1. 创建 MqttHelper 实例

var helper = MqttHelper();

2. 初始化并连接到MQTT服务器

var config = MqttConfig(); // 你需要在 MqttConfig 中传递你的凭证和配置
helper.initialize(config);

Additional Information

Listeners

  • 连接状态变化监听:使用 onConnectionChange() 监听MQTT连接状态的变化。
  • 事件监听:使用 onEvent() 监听来自MQTT的事件。

Subscribing and Unsubscribing

  • 订阅单个主题:使用 subscribeTopic() 订阅单个主题。
  • 订阅多个主题:使用 subscribeTopics() 订阅多个主题。
  • 取消订阅单个主题:使用 unsubscribeTopic() 取消订阅单个主题。
  • 取消订阅多个主题:使用 unsubscribeTopics() 取消订阅多个主题。

Publishing

  • 发布消息:使用 publishMessage() 发布消息到指定主题。

示例代码

以下是一个完整的示例代码,展示了如何使用 mqtt_helper 进行MQTT通信:

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('MQTT Helper Example')),
        body: MqttExample(),
      ),
    );
  }
}

class MqttExample extends StatefulWidget {
  @override
  _MqttExampleState createState() => _MqttExampleState();
}

class _MqttExampleState extends State<MqttExample> {
  MqttHelper? _mqttHelper;

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

  void _initializeMqtt() async {
    var config = MqttConfig(
      host: 'your-mqtt-broker-host',
      port: 1883,
      identifier: 'flutter-client',
      username: 'your-username',
      password: 'your-password',
    );

    _mqttHelper = MqttHelper();
    _mqttHelper!.initialize(config);

    _mqttHelper!.onConnectionChange.listen((event) {
      if (event.connectionStatus == MqttConnectionStatus.connected) {
        print('Connected to MQTT broker');
      } else {
        print('Disconnected from MQTT broker');
      }
    });

    _mqttHelper!.onEvent.listen((event) {
      print('Received event: $event');
    });

    _mqttHelper!.connect();
  }

  void _subscribeToTopic() {
    _mqttHelper!.subscribeTopic('test/topic', (message) {
      print('Received message: $message');
    });
  }

  void _publishMessage() {
    _mqttHelper!.publishMessage('test/topic', 'Hello, MQTT!');
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          ElevatedButton(
            onPressed: _subscribeToTopic,
            child: Text('Subscribe to Topic'),
          ),
          SizedBox(height: 16),
          ElevatedButton(
            onPressed: _publishMessage,
            child: Text('Publish Message'),
          ),
        ],
      ),
    );
  }

  @override
  void dispose() {
    _mqttHelper?.disconnect();
    super.dispose();
  }
}

在这个示例中,我们创建了一个简单的Flutter应用,通过 mqtt_helper 连接到MQTT代理,并实现了订阅主题和发布消息的功能。希望这个示例能帮助你更好地理解和使用 mqtt_helper 插件。


更多关于Flutter MQTT通信插件mqtt_helper的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter MQTT通信插件mqtt_helper的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,下面是一个关于如何使用Flutter的MQTT通信插件mqtt_client(注意:mqtt_helper并非一个广泛认知的官方或主流Flutter插件,而mqtt_client是较为常用的MQTT客户端库)的示例代码。这个示例将展示如何连接到MQTT代理、订阅主题和发布消息。

首先,确保在pubspec.yaml文件中添加mqtt_client依赖:

dependencies:
  flutter:
    sdk: flutter
  mqtt_client: ^x.y.z  # 替换为最新版本号

然后,运行flutter pub get来获取依赖。

接下来是一个完整的Flutter应用示例,展示如何使用mqtt_client

import 'package:flutter/material.dart';
import 'package:mqtt_client/mqtt_client.dart';
import 'package:mqtt_client/mqtt_server_client.dart';

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

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

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  MqttClient? _client;
  String _connectionStatus = 'Disconnected';
  String _subscriptionMessage = '';

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

  void connectToMqttBroker() async {
    final String broker = 'mqtt.eclipse.org'; // MQTT代理地址
    final int port = 1883; // MQTT代理端口
    final String clientId = 'FlutterMqttClient-' + DateTime.now().millisecondsSinceEpoch.toString();

    _client = MqttServerClient(broker, clientId);
    _client!.port = port;
    _client!.keepAlivePeriod = 60;
    _client!.protocolVersion = MqttProtocolVersion.v311;

    final MqttConnectOptions connOpts = MqttConnectOptions.builder()
        .setClientId(clientId)
        .setCleanSession()
        .setKeepAliveInterval(20)
        .setWillTopic('willtopic') // 遗嘱主题
        .setWillMessage('My device is offline') // 遗嘱消息
        .setWillQos(MqttQos.atLeastOnce)
        .setAutomaticReconnect()
        .build();

    try {
      await _client!.connect(connOpts).timeout(Duration(seconds: 30), onTimeout: () {
        throw Exception('Connection timed out');
      });
      setState(() {
        _connectionStatus = 'Connected';
      });
      _client!.updates!.listen((List<MqttReceivedMessage<MqttMessage>>? c) async {
        final MqttPublishMessage? pubMsg = c![0].payload as MqttPublishMessage?;
        final String? pt = pubMsg!.payloadAsString;
        setState(() {
          _subscriptionMessage = pt ?? 'null';
        });
      });
      await _client!.subscribe('test/topic', MqttQos.atLeastOnce);
    } catch (e) {
      print(e);
      setState(() {
        _connectionStatus = 'Disconnected with error: ${e.message ?? ''}';
      });
    }
  }

  void publishMessage() async {
    if (_client!.isConnected()) {
      final MqttPublishMessage pubMsg = MqttPublishMessage.builder()
          .withTopic('test/topic')
          .withQos(MqttQos.atLeastOnce)
          .withPayload('Hello MQTT')
          .build();
      _client!.publishMessage(pubMsg);
    } else {
      print('Client is not connected');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('MQTT Client Demo'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text('Connection Status: $_connectionStatus'),
            SizedBox(height: 20),
            Text('Subscription Message: $_subscriptionMessage'),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: publishMessage,
              child: Text('Publish Message'),
            ),
          ],
        ),
      ),
    );
  }

  @override
  void dispose() {
    _client?.disconnect();
    super.dispose();
  }
}

代码解释:

  1. 依赖项:在pubspec.yaml文件中添加mqtt_client依赖。
  2. 主应用:创建了一个简单的Flutter应用,包含一个文本显示连接状态、订阅消息和一个按钮用于发布消息。
  3. 连接到MQTT代理:在initState方法中调用connectToMqttBroker函数,该函数负责连接到MQTT代理,设置连接选项,并订阅一个主题。
  4. 消息监听:使用_client!.updates!.listen来监听传入的消息,并更新UI显示收到的消息。
  5. 发布消息publishMessage函数用于发布消息到订阅的主题。
  6. 资源清理:在dispose方法中断开与MQTT代理的连接。

这个示例提供了一个基本的MQTT客户端功能,可以根据需要进行扩展和修改。

回到顶部