EEPW论坛

一、开发环境介绍

在honestQiao的帮助下，完成了开发环境的学习，特此感谢。

开发环境有UiFlow UiFlow2 和arduino IDE

在最初始的时候我是选用了UiFlow进行开发。具体使用方法可以参考官网教程。

https://docs.m5stack.com/zh_CN/uiflow/m5paper/program

在安装完成后我才发现有UiFlow2，于是本着数字大的功能好的原则，果断选择了UiFlow2这个工具。

https://docs.m5stack.com/zh_CN/uiflow2/m5paper/program（官方教程）

UiFlow2是一个在线工具，省去了下载安装的麻烦。随时随地联网就可以使用。

支持图形化变成和Python语言编程。当前是2.4.3版本。

程序编写完成后，可以选择cloud或者是USB模式进行运行和下载。

选用cloud模式的话需要注册和登录账号。

在下方有device选择，mode选择，运行和下载工具

根据设置的情况进行选择设备即可。

点击运行后，会弹出串口选择，更根据自己电脑串口连接情况，选择相应的串口即可。

完成连接后，会弹出调试窗口。

上有各种工具按钮，进行运行和下载即可。

在这个地方，我使用的设备经常会出现需要重新插拔一下usb线才可以再次连接的情况。

二、电子宠物雏形

根据试用，我进行了桌面电子宠物的开发。

设计的雏形形象是一只小熊。具有睁眼和闭眼的功能。在设计过程中发现，墨水屏这样的显示方式在表现上比较单一，很难做出较为细腻的形象。

import M5

from M5 import *

import time

import random

import network

import ntptime

# ==================== 真实屏幕尺寸 ====================

SCREEN_WIDTH = 540   # 宽

SCREEN_HEIGHT = 960  # 高

COLOR_BG = 0xFFFFFF

COLOR_BEAR = 0x000000

COLOR_TEXT = 0x444444

# ==================== WiFi 配置 ====================

WIFI_SSID = "WIFI名称"

WIFI_PASSWORD = "WIFi密码"

# ==================== 绝对屏幕正中央 ====================

px = SCREEN_WIDTH // 2   # 270  水平中心

py = SCREEN_HEIGHT // 2  # 480  垂直中心

# 动画

eye_state = False

eye_time = 0

EYE_INTERVAL = 30000  # 30秒眨眼

# 互动

happy = False

last_touch = 0

last_min = -1

# 刷新

last_refresh = 0

REFRESH_20S = 20000

# ==================== 对话 ====================

TEXTS = [

    "哈喽～", "摸摸头", "开心！", "你好呀",

    "呼呼～", "一起玩吧", "嘿嘿", "别闹啦"

]

# ==================== 局部清除（不黑屏） ====================

def clean(x, y, w, h):

    M5.Lcd.fillRect(x, y, w, h, COLOR_BG)

# ========================

# 【纯线条·立体·正中央小熊】

# 宽540 × 高960 屏幕完美居中

# ========================

def draw_cute_bear():

    s = 3  # 大小比例

    # 身体

    M5.Lcd.drawEllipse(px, py, 48*s, 42*s, COLOR_BEAR)

    # 头部

    M5.Lcd.drawCircle(px, py - 28*s, 36*s, COLOR_BEAR)

    # 耳朵（双层圆形，更立体）

    M5.Lcd.drawCircle(px - 26*s, py - 46*s, 10*s, COLOR_BEAR)

    M5.Lcd.drawCircle(px + 26*s, py - 46*s, 10*s, COLOR_BEAR)

    M5.Lcd.drawCircle(px - 26*s, py - 46*s, 5*s, COLOR_BEAR)

    M5.Lcd.drawCircle(px + 26*s, py - 46*s, 5*s, COLOR_BEAR)

    # 眼睛

    if eye_state:

        M5.Lcd.drawLine(px - 12*s, py - 32*s, px - 4*s, py - 32*s, COLOR_BEAR)

        M5.Lcd.drawLine(px + 4*s, py - 32*s, px + 12*s, py - 32*s, COLOR_BEAR)

    else:

        M5.Lcd.drawCircle(px - 10*s, py - 32*s, 4*s, COLOR_BEAR)

        M5.Lcd.drawCircle(px + 10*s, py - 32*s, 4*s, COLOR_BEAR)

    # 鼻子

    M5.Lcd.drawEllipse(px, py - 16*s, 8*s, 6*s, COLOR_BEAR)

    # 嘴巴

    if happy:

        M5.Lcd.drawArc(px, py - 8*s, 10*s, 8*s, 0, 180, COLOR_BEAR)

    else:

        M5.Lcd.drawLine(px - 8*s, py - 6*s, px + 8*s, py - 6*s, COLOR_BEAR)

    # 四肢

    M5.Lcd.drawLine(px - 28*s, py + 24*s, px - 28*s, py + 40*s, COLOR_BEAR)

    M5.Lcd.drawLine(px + 28*s, py + 24*s, px + 28*s, py + 40*s, COLOR_BEAR)

    M5.Lcd.drawLine(px - 32*s, py + 40*s, px + 32*s, py + 40*s, COLOR_BEAR)

# ==================== 30秒 眨眼切换 ====================

def toggle_eye():

    global eye_state, eye_time

    now = time.ticks_ms()

    if now - eye_time > EYE_INTERVAL:

        eye_time = now

        eye_state = not eye_state

        clean(px - 80, py - 100, 160, 50)

        draw_cute_bear()

# ==================== 20秒 局部刷新 ====================

def refresh_20s():

    global last_refresh

    now = time.ticks_ms()

    if now - last_refresh > REFRESH_20S:

        last_refresh = now

        clean(px - 160, py - 160, 320, 320)

        draw_cute_bear()

# ==================== 触摸互动 ====================

def check_touch():

    global last_touch, happy

    if M5.Touch.getCount() > 0:

        now = time.ticks_ms()

        if now - last_touch > 1000:

            last_touch = now

            happy = True

# ==================== 显示时间（顶部中央） ====================

def show_time():

    global last_min

    t = time.localtime()

    minute = t[4]

    if minute != last_min:

        last_min = minute

        time_str = "{:02d}:{:02d}".format(t[3], t[4])

        date_str = "{:04d}-{:02d}-{:02d}".format(t[0], t[1], t[2])

        clean(170, 40, 200, 60)

        M5.Lcd.setFont(M5.Lcd.FONTS.DejaVu24)

        M5.Lcd.setTextColor(COLOR_TEXT, COLOR_BG)

        M5.Lcd.drawString(time_str, 220, 40)

        M5.Lcd.drawString(date_str, 180, 70)

# ==================== 联网授时 ====================

def connect_wifi():

    wlan = network.WLAN(network.STA_IF)

    wlan.active(True)

    if not wlan.isconnected():

        wlan.connect(WIFI_SSID, WIFI_PASSWORD)

        timeout = 30

        while not wlan.isconnected() and timeout > 0:

            time.sleep(1)

            timeout -= 1

    return wlan.isconnected()

def sync_ntp():

    try:

        ntptime.settime()

    except:

        pass

# ==================== 初始化 ====================

def setup():

    M5.begin()

    M5.Lcd.setEpdMode(M5.Lcd.EPDMode.EPD_FAST)

    M5.Lcd.clear(COLOR_BG)

    draw_cute_bear()

    connect_wifi()

    sync_ntp()

# ==================== 主循环 ====================

def loop():

    global happy

    M5.update()

    show_time()

    check_touch()

    toggle_eye()

    refresh_20s()

    if happy and time.ticks_ms() - last_touch > 5000:

        happy = False

        clean(px - 160, py - 160, 320, 320)

        draw_cute_bear()

    time.sleep_ms(80)

if __name__ == "__main__":

    setup()

    while True:

        loop()

显示效果如下，后续再进行增加一些功能。