【快捷指令案例】分享Wi-Fi密码

320 阅读3分钟

前言

想分享 Wi-Fi 密码我们首先要了解一下 Wi-Fi 密码共享的原理,只有了解了 Wi-Fi 密码共享的原理我们才能正确的利用规则分享。

设计思路

  • 已连接 Wi-Fi 直接获取当前 Wi-Fi 网络名称

  • 没有连接 Wi-Fi 需要手动输入 Wi-Fi 网络名称

  • 要求输入 Wi-Fi 网络密码

  • 使用文本根据 Wi-Fi 网络格式拼接网络信息

  • 使用二维码工具生成二维码

Wi-Fi密码共享的原理

Wi-Fi 密码分享本质上只是将 Wi-Fi 网络的信息和密码以特定格式写入到二维码中。只要了解了这种「特定格式」,我们就能自己生成 Wi-Fi 密码共享的二维码。

Wi-Fi 网络二维码格式

WIFI:S:;T:<WPA|WEP|>;P:;H:<true|false|>;

  • SSID:网络名称

  • WPA|WEP:网络加密模式

  • password:网络密码

  • H: 网络是否隐藏,可以不加

例如:

WIFI:S:MyNetwork;T:WPA;P:P455w0rd;

实现

1.Wi-Fi网络信息处理

  • 使用【获取网络的详细信息】获取网络名称

  • 判断获取的网络名称是否有值

  • 有值直接使用【设定变量】设置为变量“SSID

  • 没有值使用【请求输入】要求输入并将输入内容设置为变量“SSID

  • 使用【请求输入】要求输入密码

  • 使用【文本】拼接网络信息

图片

图片

图片

2.Wi-Fi网络共享

使用【生成二维码】将拼接的网络信息生成对应二维码

图片

生成完后,我们将得到这样的一个二维码

图片

3.美化UI

对于分享 Wi-Fi 信息来说单纯的二维码很难知道是哪个网络对应的信息,这是我们可以选择对二维码进行美化。快捷指令中支持 HTML 展示,我们可以利用HTML 对二维码进行美化,首先需要配置一个 HTML 的模板。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>扫码连WiFi</title>
    <style>
        * {
            font-size: 1.3em;
            text-align: center;
            font-family: 'PingFang SC', sans-serif;
        }
        body {
            background-color: #f0f8ff;
            color: #333;
        }
        .title {
            color: #2c3e50;
        }
        .wifi-name {
          color: #3498db;
          font-size: 0.8em;
        }
        img {
            display: block;
            margin: 0 auto;
            border: 3px dashed #3498db;
            border-radius: 10px;
            width: 8em;
        }
        p {
            color: #7f8c8d;
            font-size: 0.8em;
        }
        .tips {
          color: #7f8c8d;
          font-size: 0.5em;
        }
</style>
</head>

<body>
    <h1 class="title">扫码连接WiFi</h1>
    <span class="wifi-name">WiFi名称:SSID</span>
    <p style="font-size:0.7em;">使用【iPhone自带相机】扫码即可连接</p>
    <img src='data:;base64,base64图片编码'>
    <span class="tips">若无法连接,请确认WiFi名称和密码是否正确</span>
</body>

</html>

图片

配置一个菜单供选择,是则使用 HTML 模板进行美化,否直接将二维码保存到相簿。

图片

将模板粘贴到【文本】工具,使用变量替换对应参数,选择【HTML制作多信息文本】即可查看到完整的展示

图片

否条件直接将生成的二维码保存到相簿。

图片

预览效果

图片

快捷指令口令

见原文【快捷指令案例】分享Wi-Fi密码

参考

本文同步自微信公众号 "程序员小溪" ,这里只是同步,想看及时消息请移步我的公众号,不定时更新我的学习经验。