From Static Screen to AI-Driven Dashboard: Integrating TFT LCD (ILI9341/ST7789) with ASI Biont

The Problem with Traditional Display Programming

TFT LCDs like ILI9341 and ST7789 are everywhere – from weather stations to industrial HMIs. But every time you need to show new data – a different metric, an updated graph, a push notification – you have to rewrite and reflash the microcontroller. That’s hours of coding, debugging, and serial monitoring. What if you could tell an AI agent to show a temperature trend line or a warning message, and the display updates instantly – without touching a single line of C or MicroPython?

That’s exactly what ASI Biont does. By connecting an ESP32 with a TFT LCD to the AI agent via MQTT, you get a dynamic, real‑time dashboard that changes on command. No reflashing. No manual coding. Just describe what you want in the chat and the AI handles the rest.

Why Connect a Display to an AI Agent?

Embedded displays are traditionally passive: they show pre‑programmed data. With an AI agent in the loop, the display becomes an active IoT endpoint. The AI can:
- Render live sensor data (temperature, humidity, pressure) from any connected source.
- Draw graphs – line charts, bar charts – based on historical trends.
- Push alerts – “Temperature exceeded 30°C” – with custom colors and fonts.
- Switch screens between different dashboards without reflashing.

All of this happens through a single MQTT topic, where the AI publishes display commands in a human‑readable format. The ESP32 reads those commands and draws on the screen using the TFT library.

Connection Method: MQTT via ESP32

ASI Biont supports multiple integration modes. For a TFT LCD, MQTT is the most practical because:
- Wireless – no physical cable between PC and display.
- Two‑way – the ESP32 can also send back acknowledgments or sensor readings.
- Scalable – one AI agent can control dozens of displays simultaneously.

The AI agent runs a Python script in ASI Biont’s sandbox (using execute_python) that connects to your MQTT broker (e.g., Mosquitto, HiveMQ) and publishes commands. The ESP32 runs MicroPython with a paho‑mqtt client that subscribes to the same topic and interprets the commands.

Alternative: If your setup lacks Wi‑Fi, you can use the Hardware Bridge (bridge.py) with a serial connection. The AI sends commands via industrial_command(protocol='serial://', ...) to a COM port, and the ESP32 reads them over UART. But MQTT is cleaner for most modern projects.

Real‑World Scenario: AI‑Powered Weather Dashboard

Imagine a small weather station: an ESP32 reads a DHT22 sensor (temperature & humidity) and an optional BMP280 (barometric pressure). Every minute it publishes readings to an MQTT topic (sensor/data). The ASI Biont AI agent subscribes to that topic, analyzes the data, and every 5 seconds publishes a display update to another topic (display/command).

The user’s workflow:
1. Wire the hardware (see diagram below).
2. Flash the ESP32 with the MicroPython firmware and upload the client code.
3. In the ASI Biont chat, tell the AI: “Connect to my MQTT broker at 192.168.1.100, subscribe to sensor/data, and every 5 seconds show the last temperature, humidity, and a small line graph of the last 10 readings on the TFT. Topic display/command.”
4. The AI writes the integration script inside the sandbox and runs it. No manual coding.

The display updates live – showing a sleek dashboard that changes its layout based on data or user requests.

Wiring Diagram (ESP32 + ILI9341 TFT)

Optional: Connect a touch controller (XPT2046) if using resistive touch – standard SPI pins.

MicroPython Code for the ESP32 (MQTT Listener)

The ESP32 firmware must include the ili9341 driver and umqtt.simple. Below is a minimal listener:

import network
import time
from machine import Pin, SPI
from ili9341 import ILI9341
from umqtt.simple import MQTTClient

# WiFi & MQTT config
SSID = "your_SSID"
PASS = "your_PASS"
BROKER = "192.168.1.100"
TOPIC = b"display/command"

# Display init
spi = SPI(2, baudrate=40000000, sck=Pin(18), mosi=Pin(23))
display = ILI9341(spi, cs=Pin(5), dc=Pin(19), rst=Pin(18))
display.fill(0)  # black

# WiFi connection
wlan = network.WLAN(network.STA_IF)
wlan.active(True)
wlan.connect(SSID, PASS)
while not wlan.isconnected():
    time.sleep(0.5)

# MQTT callback
def callback(topic, msg):
    # Expect simple text commands: "CLEAR", "TEXT x y color text", "LINE x1 y1 x2 y2 color", etc.
    cmd = msg.decode().strip()
    parts = cmd.split()
    if parts[0] == "CLEAR":
        display.fill(0)
    elif parts[0] == "TEXT":
        # TEXT 10 20 65535 "Hello"
        x = int(parts[1]); y = int(parts[2]); color = int(parts[3])
        text = ' '.join(parts[4:]).strip('"')
        display.text(text, x, y, color)
    elif parts[0] == "LINE":
        x1, y1, x2, y2, color = map(int, parts[1:6])
        display.line(x1, y1, x2, y2, color)
    # Add more commands as needed

client = MQTTClient("esp32_tft", BROKER)
client.set_callback(callback)
client.connect()
client.subscribe(TOPIC)
print("Waiting for commands...")
while True:
    client.wait_msg()  # blocking

AI‑Generated Integration Code (Sandbox Side)

In ASI Biont, the AI writes and runs a Python script using execute_python. Here’s an example that the AI might generate after the user describes the weather dashboard:

import paho.mqtt.client as mqtt
import json
import time

BROKER = "192.168.1.100"
# Sub topic for sensor data, pub topic for display commands
SUB_TOPIC = "sensor/data"
PUB_TOPIC = "display/command"

# Store last 10 temperature readings for graph
temp_history = []

def on_message(client, userdata, msg):
    global temp_history
    data = json.loads(msg.payload.decode())
    temp = data['temperature']
    hum = data['humidity']
    temp_history.append(temp)
    if len(temp_history) > 10:
        temp_history.pop(0)

    # Build display commands
    commands = []
    commands.append("CLEAR")
    commands.append(f"TEXT 10 20 65535 'Temp: {temp:.1f}°C'")
    commands.append(f"TEXT 10 50 65535 'Hum: {hum:.1f}%'")
    # Simple line graph: draw lines between points
    if len(temp_history) > 1:
        for i in range(1, len(temp_history)):
            x1 = 10 + i * 20
            y1 = 100 - int((temp_history[i-1] - 20) * 4)  # scale
            x2 = 10 + (i+1) * 20
            y2 = 100 - int((temp_history[i] - 20) * 4)
            commands.append(f"LINE {x1} {y1} {x2} {y2} 31")

    # Publish all commands as one message (separated by newline)
    client.publish(PUB_TOPIC, '\n'.join(commands))

client = mqtt.Client()
client.on_message = on_message
client.connect(BROKER, 1883, 60)
client.subscribe(SUB_TOPIC)
client.loop_forever()

The AI sets up the whole pipeline: it connects to the broker, subscribes to the sensor topic, parses the JSON, builds the display commands, and publishes them.

Benefits: No Manual Coding, 10× Faster Setup

• Zero firmware changes – the display logic lives in the AI sandbox, not on the ES P32.
• Instant updates – change what the display shows by simply chatting with the AI.
• Any device, any protocol – if you prefer serial, the AI can use the Hardware Bridge; if the display is on a Raspberry Pi, it uses SSH.
• Real‑time analytics – the AI can combine data from multiple sources and present it on one screen.

Conclusion

TFT LCDs have always needed manual programming for every new layout. With ASI Biont and an ESP32 + MQTT, you turn that static screen into an AI‑driven dashboard that updates in real time – without a single reflash. Whether you’re building a weather station, a production monitor, or a smart home panel, the AI agent writes the integration code for you in seconds.

Ready to give your display a brain? Try it today at asibiont.com – just describe your hardware in the chat, and watch the magic happen.