---
# System prepended metadata

title: 604 20 洪俊翔 電腦作業。 (缺圖片)

---

# 進階功能:(顏色追蹤:紅色)
# 程式碼![image](https://hackmd.io/_uploads/Sk9Wx1YkA.png)
```javascript=
try:
  def printExcept(e):
    lcd.clear()
    log = str(e)
    sys.print_exception(e)
    data_len, i, colume = 30, 0, 0
    while i < len(log):
      lcd.draw_string(50, 100 + (colume * 20), (log[i : i + data_len] + '\n'), 0x00F8, 0x0000)
      i = i + data_len
      colume = colume + 1

  from time import sleep
  from webai_blockly import Camera
  from webai import ColorObject
  from webai_blockly import Lcd
  
  _E7_95_AB_E9_9D_A2 = 0
  _E9_A1_8F_E8_89_B2_E8_B3_87_E8_A8_8A = 0
  
  try:
    from webai import *
  except:
    pass
  
  camera = Camera()
  
  view = Lcd()
  
  def _hex_to_rgb(hex):
    h = hex.lstrip('#')
    return tuple(int(h[i:i+2], 16) for i in (0, 2, 4))
  
  def _rgb_to_hex565(rgb):
    (red, green, blue) = rgb
    hex565 = "0x%0.4X" % ((int(red / 255 * 31) << 11) | (int(green / 255 * 63) << 5) | (int(blue / 255 * 31)))
    board_hex = '0x' + hex565[4:] + hex565[2:4]
    return int(board_hex, 16)
  
  # RUN USB MODE
  _deviceID = 'Web:AI'
  try:
    print(_onServiceEvent)
    from time import sleep
    sleep(1)
    webai.mqtt.sub(topic=_deviceID + '/SERVICE', callback=_onServiceEvent)
  except:
    pass
  
  
  while True:
    _E7_95_AB_E9_9D_A2 = camera.snapshot()
    # 可點擊右鍵->小工具，使用顏色小工具選擇顏色
    _E9_A1_8F_E8_89_B2_E8_B3_87_E8_A8_8A = ColorObject.findMax(_E7_95_AB_E9_9D_A2, (0,100,24,128,-128,128))
    if (_E9_A1_8F_E8_89_B2_E8_B3_87_E8_A8_8A.pixels() if _E9_A1_8F_E8_89_B2_E8_B3_87_E8_A8_8A else 0) > 10:
      view.drawString(x=125, y=110, text=b"{var}".format(var='紅色'), color=_rgb_to_hex565(_hex_to_rgb('#ffffff')), scale=2, x_spacing=20, img=_E7_95_AB_E9_9D_A2, display=False)
    view.displayImg(img=_E7_95_AB_E9_9D_A2)
  
    sleep(0.001)
except Exception as e:
  printExcept(e)
```
# 心得:
操作過顏色追蹤才知道，這是真的有難度的，我在做很多次試驗都是以失敗收場，我發現到我在調整為其他顏色的時候，還要再把其他的小細節去做微調


# WebAI MoonCar:鍵盤遙控車
# 程式碼![image](https://hackmd.io/_uploads/Byd0-1KJC.png)
```javascript=
try:
  def printExcept(e):
    lcd.clear()
    log = str(e)
    sys.print_exception(e)
    data_len, i, colume = 30, 0, 0
    while i < len(log):
      lcd.draw_string(50, 100 + (colume * 20), (log[i : i + data_len] + '\n'), 0x00F8, 0x0000)
      i = i + data_len
      colume = colume + 1

  from ujson import loads, dumps
  __on_line = {}
  __on_sheet = {}
  __on_monster = {}
  def _onServiceEvent(topic, msg):
    try:
      data = loads(msg)
      payload = data['payload']
      if data['type'] == 'sheet':
        if data['actionType'] == 'responseWrite':
          __on_sheet['write' + payload['url'] + payload['name']](payload)
        elif data['actionType'] == 'responseFeature':
          __on_sheet[payload['url'] + payload['name']](payload)
        elif data['actionType'] == 'responseData':
          _google_sheet_receive_data()
          __on_sheet[payload['cell']] = payload['value']
      elif data['type'] == 'line':
        if data['actionType'] == 'replyToken' or data['actionType'] == 'channelMsg':
          eval('_on_channel_' + payload['channelID'])(payload)
      elif data['type'] == 'monster':
        if data['actionType'] == 'click':
          eval('on_click_' + payload['monster'] + '()')
      elif data['type'] == 'keyboard':
        eval('_' + data['actionType'] + '_' + payload['keycode'])()
      elif data['type'] == 'value_input':
        _on_value_input_cb(payload['value'])
      elif data['type'] == 'speech_to_text':
        receive_speech_to_text(payload['value'])
    except:
      pass
  
  try:
    from webai import *
  except:
    pass
  
  mcar.init()
  def _CAR_FORWARD():
    mcar.forward()
  def _CAR_BACK():
    mcar.backward()
  def _CAR_LEFT_FORWARD():
    mcar.move(0, 100)
  def _CAR_LEFT_BACK():
    mcar.move(0, -100)
  def _CAR_RIGHT_FORWARD():
    mcar.move(100, 0)
  def _CAR_RIGHT_BACK():
    mcar.move(-100, 0)
  def _CAR_TURN_RIGHT():
    mcar.right(100)
  def _CAR_TURN_LEFT():
    mcar.left(100)
  def _CAR_STOP():
    mcar.stop()
  def _CAR_KEEP():
    pass
  
  def _onkeydown_38():
  
    _CAR_FORWARD()
  
  def _onkeydown_40():
  
    _CAR_BACK()
  
  def _onkeydown_37():
  
    _CAR_TURN_LEFT()
  
  def _onkeydown_39():
  
    _CAR_TURN_RIGHT()
  
  def _onkeydown_32():
  
    _CAR_STOP()
  
  # RUN USB MODE
  _deviceID = 'Web:AI'
  try:
    print(_onServiceEvent)
    from time import sleep
    sleep(1)
    webai.mqtt.sub(topic=_deviceID + '/SERVICE', callback=_onServiceEvent)
  except:
    pass
  
  
  mcar.l_ratio = 1
  mcar.r_ratio = 1
except Exception as e:
  printExcept(e)
```
  
# 心得:
我覺得這是最好玩的東西，操作起來不算困難，也沒有很難的地方，很適合給我們這種初學者使用看看，看到他真的以我的按鍵去控制自己前進的方向，這是我覺得最厲害的地方，雖然有點一板一眼的，不過還是很好玩的。


# 基礎功能:遠端遙控秀圖
# 程式碼![image](https://hackmd.io/_uploads/Hy089v7eR.png)
```javascript=
try:
  def printExcept(e):
    lcd.clear()
    log = str(e)
    sys.print_exception(e)
    data_len, i, colume = 30, 0, 0
    while i < len(log):
      lcd.draw_string(50, 100 + (colume * 20), (log[i : i + data_len] + '\n'), 0x00F8, 0x0000)
      i = i + data_len
      colume = colume + 1

  from ujson import dumps
  from webai_blockly import Mqtt
  import webai_blockly
  import _thread
  from webai_blockly import Lcd
  
  try:
    from webai import *
  except:
    pass
  
  view = Lcd()
  
  def SYSTEM_THREAD_MQTT_2qd2au15y(checkTime, topic):
  
    while 1:
      try:
        if webai_blockly.SYSTEM_ALLOCATE_LOCK.locked():
          webai_blockly.SYSTEM_ALLOCATE_LOCK.acquire()
          webai_blockly.SYSTEM_ALLOCATE_LOCK.release()
        if webai_blockly.SYSTEM_MQTT_TOPIC[topic] != "":
          if (webai_blockly.SYSTEM_MQTT_TOPIC[topic]) == 'g':
            view.displayImg(img=(webai.res.loadImg('green.jpg')))
          elif (webai_blockly.SYSTEM_MQTT_TOPIC[topic]) == 'r':
            view.displayImg(img=(webai.res.loadImg('red.jpg')))
          elif (webai_blockly.SYSTEM_MQTT_TOPIC[topic]) == 'b':
            view.displayImg(img=(webai.res.loadImg('blue.jpg')))
          elif (webai_blockly.SYSTEM_MQTT_TOPIC[topic]) == 'y':
            view.displayImg(img=(webai.res.loadImg('yellow.jpg')))
          webai_blockly.SYSTEM_MQTT_TOPIC[topic] = ""
      except Exception as e:
        webai_blockly.SYSTEM_MQTT_TOPIC[topic] = ""
        printExcept(e)
      finally:
        time.sleep_ms(checkTime)
  
  # RUN USB MODE
  _deviceID = 'Web:AI'
  try:
    print(_onServiceEvent)
    from time import sleep
    sleep(1)
    webai.mqtt.sub(topic=_deviceID + '/SERVICE', callback=_onServiceEvent)
  except:
    pass
  
  
  # 執行前請點擊右上角開啟 【 更多 】-【 網頁互動 】
  webai.mqtt.pub(topic=_deviceID + '/SERVICE', msg=dumps({
      "type": 'monster',
      "actionType": 'talk',
      "payload": {
        "msg": '1. 請用行動裝置掃描 QR Code'
      },
      "monster": 'green'
    }))
  webai.mqtt.pub(topic=_deviceID + '/SERVICE', msg=dumps({
      "type": 'monster',
      "actionType": 'talk',
      "payload": {
        "msg": '2. 將萬用遙控器廣播頻道【 發送 】設定為：萬用遙控器'
      },
      "monster": 'red'
    }))
  webai.mqtt.pub(topic=_deviceID + '/SERVICE', msg=dumps({
      "type": 'monster',
      "actionType": 'talk',
      "payload": {
        "msg": '3. 點擊萬用遙控器的四隻小怪獸，就可以在 Web:AI 上看到他們囉！'
      },
      "monster": 'yellow'
    }))
  webai.mqtt.pub(topic=_deviceID + '/SERVICE', msg="{|'type|':|'monster|'|.|'actionType|':|'urlImg|'|.|'payload|':|'%s|'|.|'monster|':|'blue|'}" % str('https://i.imgur.com/hbcLA1B.png'))
  Mqtt.sub('萬用遙控器')
  webai_blockly.SYSTEM_MQTT_TOPIC.update(eval("{'萬用遙控器': ''}"))
  _thread.start_new_thread(SYSTEM_THREAD_MQTT_2qd2au15y, (100, '萬用遙控器'))
except Exception as e:
  printExcept(e)
```
# 心得:
遠端秀圖沒有到很困難，與mooncar相比沒有那麼簡單，但是跟顏色追蹤相比又沒有那麼難，屬於一個中型的挑戰，不過對我來說，這還是算小Case的。


# All:網路圖片顯示
# 程式碼![image](https://hackmd.io/_uploads/r1mf_dmg0.png)
# 圖片連結:https://img.moegirl.org.cn/common/8/89/KSPKSP.jpg
# 圖片連結:https://i.imgur.com/283kGvx.jpg
```javascript=
try:
  def printExcept(e):
    lcd.clear()
    log = str(e)
    sys.print_exception(e)
    data_len, i, colume = 30, 0, 0
    while i < len(log):
      lcd.draw_string(50, 100 + (colume * 20), (log[i : i + data_len] + '\n'), 0x00F8, 0x0000)
      i = i + data_len
      colume = colume + 1

  from webai_blockly import Lcd
  
  try:
    from webai import *
  except:
    pass
  
  view = Lcd()
  
  # RUN USB MODE
  _deviceID = 'Web:AI'
  try:
    print(_onServiceEvent)
    from time import sleep
    sleep(1)
    webai.mqtt.sub(topic=_deviceID + '/SERVICE', callback=_onServiceEvent)
  except:
    pass
  
  
  webai.cloud.download('https://img.shoplineapp.com/media/image_clips/6169254ea8a2ec00236c78a0/original.jpg',resize=320,filename='pic.jpg')
  view.displayImg(img=(webai.res.loadImg('pic.jpg')))
except Exception as e:
  printExcept(e)
```
# 心得:
說到這個，一開始因為忘記調整後面的參數，導致試驗了很久都沒有成功，這是第一個因素，第二個因素則是因為我找的圖片不符合他的格式，我找了6張圖片，沒有一張是.jpg格式的，也是讓我覺得有點難過，不能把自己喜歡的圖片放上去然而我可以轉檔案成jpg，可是與其我花時間轉檔，不如再找新圖片來的比較便利。


# WebAI小畫家:星星
# 程式碼![image](https://hackmd.io/_uploads/rymxBOmeC.png)
```javascript=
try:
  def printExcept(e):
    lcd.clear()
    log = str(e)
    sys.print_exception(e)
    data_len, i, colume = 30, 0, 0
    while i < len(log):
      lcd.draw_string(50, 100 + (colume * 20), (log[i : i + data_len] + '\n'), 0x00F8, 0x0000)
      i = i + data_len
      colume = colume + 1

  from webai_blockly import Lcd
  
  try:
    from webai import *
  except:
    pass
  
  view = Lcd()
  
  def _hex_to_rgb(hex):
    h = hex.lstrip('#')
    return tuple(int(h[i:i+2], 16) for i in (0, 2, 4))
  
  def _rgb_to_hex565(rgb):
    (red, green, blue) = rgb
    hex565 = "0x%0.4X" % ((int(red / 255 * 31) << 11) | (int(green / 255 * 63) << 5) | (int(blue / 255 * 31)))
    board_hex = '0x' + hex565[4:] + hex565[2:4]
    return int(board_hex, 16)
  
  # RUN USB MODE
  _deviceID = 'Web:AI'
  try:
    print(_onServiceEvent)
    from time import sleep
    sleep(1)
    webai.mqtt.sub(topic=_deviceID + '/SERVICE', callback=_onServiceEvent)
  except:
    pass
  
  
  view.drawLine(x0=72, y0=87, x1=245, y1=87, color=_rgb_to_hex565(_hex_to_rgb('#ffff66')), thickness=5)
  view.drawLine(x0=72, y0=87, x1=212, y1=189, color=_rgb_to_hex565(_hex_to_rgb('#ffff66')), thickness=5)
  view.drawLine(x0=212, y0=189, x1=158, y1=24, color=_rgb_to_hex565(_hex_to_rgb('#ffff66')), thickness=5)
  view.drawLine(x0=158, y0=24, x1=105, y1=189, color=_rgb_to_hex565(_hex_to_rgb('#ffff66')), thickness=5)
  view.drawLine(x0=105, y0=189, x1=245, y1=87, color=_rgb_to_hex565(_hex_to_rgb('#ffff66')), thickness=5)
except Exception as e:
  printExcept(e)
```
# 心得:
原本想要用臉紅，沒有要用星星，但是後來發現自己用星星比較簡單上手，也不用去想怎麼配色之類的，只要是星星，不管甚麼顏色，都不會太難看，也不會太過於複雜。簡單易上手，且無需去考慮其他因素，做出來基本上就完成了，對我來說，我覺得星星是蠻獨一無二的，是個完美的圖形。
