Flutter智能配置插件esp_smartconfig的使用

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

Flutter智能配置插件esp_smartconfig的使用

esp_smartconfig

pub version license

esp_smartconfig 是一个用于实现 EspTouch 配置协议的 Dart 实现。它支持 Android、iOS、Windows、Linux 和 macOS 平台。

已实现的协议

  • EspTouch
  • EspTouch V2

支持的平台

所有非 Web 平台都受支持。Web 平台不支持,主要是因为浏览器不允许 UDP 通信。

如果您打算在桌面平台上使用此库,请确保防火墙为入站数据打开了 UDP 端口 18266

iOS 14.6/16 的重大变更

该重大变更是从 14.6 开始实施的。然而,似乎这个问题只发生在 iOS 版本 16 的设备上,导致无法与 ESP 建立连接。

如何解决:

  • 您需要一个 Apple 开发者账号。
  • 在开发者账号被批准后,您必须通过这个表单申请使用多播 API 的权限。
  • 然后您可以按照这个指南(新流程)进行操作。

示例代码

以下是一个完整的示例,展示了如何使用 esp_smartconfig 插件来配置 Wi-Fi 设备:

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('ESP SmartConfig Example')),
        body: Center(child: ConfigButton()),
      ),
    );
  }
}

class ConfigButton extends StatefulWidget {
  @override
  _ConfigButtonState createState() => _ConfigButtonState();
}

class _ConfigButtonState extends State<ConfigButton> {
  final provisioner = Provisioner.espTouch();
  bool isLoading = false;

  void startProvisioning() async {
    setState(() {
      isLoading = true;
    });

    try {
      await provisioner.start(ProvisioningRequest.fromStrings(
        ssid: "YOUR_NETWORK_SSID",
        password: "YOUR_NETWORK_PASSWORD",
      ));

      // 显示对话框并等待结果
      await showDialog(
        context: context,
        builder: (context) => AlertDialog(
          title: Text("配置中..."),
          content: Text("请稍候,正在配置设备"),
        ),
      );

      // 配置完成后停止
      provisioner.stop();
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text("设备已成功连接到Wi-Fi")),
      );
    } catch (e, s) {
      print(e);
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text("配置失败: $e")),
      );
    } finally {
      setState(() {
        isLoading = false;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: isLoading ? null : startProvisioning,
      child: isLoading ? CircularProgressIndicator() : Text("配置设备"),
    );
  }

  @override
  void dispose() {
    provisioner.stop();
    super.dispose();
  }
}

在这个示例中,我们创建了一个简单的 Flutter 应用程序,其中包含一个按钮,点击按钮后会启动 SmartConfig 配置过程。配置过程中会显示一个对话框,并在配置完成后显示成功或失败的消息。

SmartConfig 技术简介

SmartConfig™ 是一种用于将新的 Wi-Fi 设备连接到 Wi-Fi 网络的配置技术。其优势在于设备不需要直接知道接入点(AP)的 SSID 或密码。这些信息由该库提供。这对于无头设备和系统尤其重要,因为它们缺乏用户界面。

作者

GitHub: abobija
Homepage: abobija.com

许可证

MIT License - 详情

希望这个帖子能帮助您了解如何在 Flutter 中使用 esp_smartconfig 插件进行 Wi-Fi 配置。如果您有任何问题或需要进一步的帮助,请随时提问!


更多关于Flutter智能配置插件esp_smartconfig的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter智能配置插件esp_smartconfig的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter项目中集成并使用ESP-IDF(Espressif IoT Development Framework)提供的智能配置插件esp_smartconfig,通常需要结合原生代码(如Dart与Kotlin/Swift)来实现设备配置功能。由于Flutter本身并不直接支持ESP-IDF库,你需要通过Flutter的插件机制来桥接原生平台代码。

以下是一个简化的示例,展示如何在Flutter中调用原生代码实现ESP SmartConfig功能。这个示例假设你已经熟悉Flutter插件开发流程,并且已经设置好了Flutter项目。

1. 创建Flutter插件

首先,创建一个新的Flutter插件项目,用于封装SmartConfig功能。

flutter create --org com.example --template=plugin esp_smartconfig_flutter
cd esp_smartconfig_flutter

2. 实现Android端代码

android/src/main/kotlin/com/example/esp_smartconfig_flutter/EspSmartconfigPlugin.kt中,添加对SmartConfig的支持。由于直接调用ESP-IDF库在Android上并不现实,通常会使用Espressif提供的Android库(如EspTouch)或者通过TCP/UDP与ESP32设备通信。

以下是一个使用EspTouch库的示例(假设你已经将EspTouch库集成到项目中):

package com.example.esp_smartconfig_flutter

import android.content.Context
import android.os.Handler
import androidx.annotation.NonNull
import io.flutter.embedding.engine.plugins.FlutterPlugin
import io.flutter.embedding.engine.plugins.activity.ActivityAware
import io.flutter.embedding.engine.plugins.activity.ActivityPluginBinding
import io.flutter.plugin.common.BinaryMessenger
import io.flutter.plugin.common.MethodCall
import io.flutter.plugin.common.MethodChannel
import io.flutter.plugin.common.MethodChannel.MethodCallHandler
import io.flutter.plugin.common.MethodChannel.Result
import io.flutter.plugin.common.PluginRegistry.Registrar
import com.espressif.iot.esptouch.EsptouchTask
import com.espressif.iot.esptouch.EsptouchTaskListener
import com.espressif.iot.esptouch.EsptouchWiFiConfig

class EspSmartconfigPlugin: FlutterPlugin, MethodCallHandler, ActivityAware {
    private lateinit var channel: MethodChannel
    private var context: Context? = null

    override fun onAttachedToEngine(@NonNull flutterPluginBinding: FlutterPluginBinding) {
        channel = MethodChannel(flutterPluginBinding.binaryMessenger, "esp_smartconfig_flutter")
        channel.setMethodCallHandler(this)
        context = flutterPluginBinding.applicationContext
    }

    override fun onMethodCall(@NonNull call: MethodCall, @NonNull result: Result) {
        if (call.method == "startSmartConfig") {
            val ssid = call.argument<String>("ssid") ?: return
            val password = call.argument<String>("password") ?: return
            val deviceIp = call.argument<String>("deviceIp") ?: return

            startSmartConfig(ssid, password, deviceIp, result)
        } else {
            result.notImplemented()
        }
    }

    private fun startSmartConfig(ssid: String, password: String, deviceIp: String, result: Result) {
        val wifiConfig = EsptouchWiFiConfig.Builder()
                .ssid(ssid)
                .password(password)
                .build()

        EsptouchTask(context!!, wifiConfig, object : EsptouchTaskListener {
            override fun onEsptouchStart() {
                // Handle start
            }

            override fun onEsptouchProgress(percent: Int) {
                // Handle progress
            }

            override fun onEsptouchSuccess(deviceIp: String) {
                result.success("Device configured successfully with IP: $deviceIp")
            }

            override fun onEsptouchFail(errorCode: Int, errorMsg: String) {
                result.error("SMART_CONFIG_FAILURE", errorMsg, null)
            }

            override fun onEsptouchStop() {
                // Handle stop
            }
        }).start()
    }

    override fun onDetachedFromEngine(@NonNull binding: FlutterPluginBinding) {
        channel.setMethodCallHandler(null)
    }

    override fun onAttachedToActivity(binding: ActivityPluginBinding) {
        // No-op
    }

    override fun onDetachedFromActivityForConfigChanges() {
        // No-op
    }

    override fun onReattachedToActivityForConfigChanges(binding: ActivityPluginBinding) {
        // No-op
    }

    override fun onDetachedFromActivity() {
        // No-op
    }
}

3. 实现iOS端代码(可选)

对于iOS,你需要使用Objective-C或Swift实现类似的功能,并桥接到Flutter。由于iOS上没有直接对应的Espressif库,你可能需要通过TCP/UDP协议与ESP32设备通信,或者使用其他第三方库。

4. 在Flutter中调用插件

在你的Flutter应用中,通过MethodChannel调用上述插件的方法:

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

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

class MyApp extends StatelessWidget {
  static const platform = MethodChannel('esp_smartconfig_flutter');

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('ESP SmartConfig Demo'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: _startSmartConfig,
            child: Text('Start SmartConfig'),
          ),
        ),
      ),
    );
  }

  Future<void> _startSmartConfig() async {
    try {
      final String ssid = 'your_ssid';
      final String password = 'your_password';
      final String deviceIp = 'device_ip_or_broadcast_address';

      final String result = await platform.invokeMethod('startSmartConfig', <String, dynamic>{
        'ssid': ssid,
        'password': password,
        'deviceIp': deviceIp,
      });

      print(result);
    } on PlatformException catch (e) {
      print("Failed to invoke: '${e.message}'.");
    }
  }
}

注意事项

  1. 依赖管理:确保在Android项目中正确集成了EspTouch或其他相关库。
  2. 错误处理:在真实项目中,添加更多的错误处理和用户反馈。
  3. 权限:在AndroidManifest.xml中添加必要的网络权限。
  4. 跨平台兼容性:iOS端实现可能需要额外的工作,因为iOS没有直接的Espressif库支持。

这个示例提供了一个基本的框架,你可以根据实际需求进行扩展和优化。

回到顶部