今日目標
實現經典的多頁面UI切換。我們將使用兩個實體按鈕,結合之前學過的中斷機制與SSD1306 OLED,打造一個能順暢切換「主頁面」、「溫濕度頁面」與「系統狀態頁面」的互動選單系統。
程式碼
import time
from machine import Pin,I2C
import ssd1306
i2c=I2C(0,scl=Pin(22),sda=Pin(21),freq=400000)
oled=sdd1306.SSD1306_I2C(128,64,i2c)
btn_prev=Pin(4,Pin.IN,Pin.PULL_UP)
btn_next=Pin(5,Pin.IN,Pin.PULL_UP)
current_page=0
TOTAL_PAGES=3
last_interrupt_time=0
def button_headler(pin):
global current_page,last_interrupt_time
now=time.ticks_ms()
if time.ticks_diff(now,last_interrupt_time)>200:
if pin==btn_next:
current_page=(current_page+1)%TOTAL_PAGES
elif pin ==btn_prev:
current_page=(current_page-1+TOTAL_PAGES)%TOTAL_PAGES
last_interrupt_time=now
btn_perv.irq(trigger=Pin.IRQ_FALLING,headler=button_headler)
btn_next.irq(trigger=Pin.IRQ_FALLING,headler=button_headler)
def render_page_0():
oled.text("===MAIN MENU===",0,0)
oled.hline(0,12,128,1)
oled.text("Welcome to IoT",0,24)
oled.text("Press[>] to Next",0,42)
def render_page_1():
oled.text("===SENSORS===",0,0)
oled.hline(0,12,128,1)
oled.text("Temp:26.5 C",0,24)
oled.text("Humi:60.0%",0,40)
def render_page_2():
oled.text("===SYS INFO===")
oled.hline(0,12,128,1)
oled.text("Uptime:120s",0,24)
oled.text("WiFi:Connected",0,40)
print("===多頁面選單系統啟動===")
last_rendered_page=-1
while True:
oled.fill(0)
if current_page==0:
render_page_0()
elif current_page==1:
render_page_1()
elif current_page==2:
render_page_2()
oled.hline(0,52,128,1)
oled.text(f"Page [{current_page+1}/{TOTAL_PAGES}]",32,55)
oled.show()
time.sleep_ms(100)
心得
今天我們把實體輸入與視覺化輸出結合在一起,實作出極具實用價值的多頁面UI控制架構,這種模組化的頁面繪製搭配中斷狀態切換,是開發小型穿戴裝置或儀表板的最佳程式架構。