第一次在这个论坛发帖子，这篇帖子是很久在隔壁论坛发的了，请各位大神多多指教 
原帖：https://bbs.hassbian.com/thread-8505-1-1.html
ESPHome的优点反正就一个字稳并且也能和HA实时同步数据，发现之前没买的SSD1306 OLED的显示屏一直在盒子里没有用，翻了一下ESPHome的文档发现可以接入这块屏幕，于是试了一下效果还可以。
首先看一下效果!
硬件准备：
ESP8266开发板
SSD1306 128x64（四针和七针的显示屏都一样可以）
软件：
ESPHome
一、ESPHome的安装我就不过多描述了请参照官方的教程进行安装，也可以参考下面这两篇教程
ESPHome 介绍及安装教程
ESPHome刷机教程
二、接线
GND->GND
VCC->VCC
SAD->D1
SCL->D2
三、SSD1306部分的配置：
time: #时间
- platform: homeassistant
timezone: Asia/Shanghai
id: time1
font: #字体
- file: 'font.ttf'
id: font1
size: 18 #字体大小
glyphs: 信息余额温度湿时间电费水卡室内状态元显示器!"%()+,-_.:°0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz
- file: 'font.ttf'
id: font2
size: 47
- file: 'font.ttf'
id: font3
size: 30
glyphs: 工作中已关闭打开启
- file: 'font.ttf'
id: font4
size: 20
glyphs: 你坏
image: #图片
- file: "1.jpg"
id: jpg
resize: 54x46
i2c: #i2c总线
sda: D1
scl: D2
scan: False
display:
- platform: ssd1306_i2c
model: "SSD1306 128x64"
address: 0x3C
id: my_display
pages:
- id: page1 #第一页（显示余额）
lambda: |-
it.printf(64, 0, id(font1), TextAlign::TOP_CENTER, "信息");
if (id(dianfei).has_state()) {
it.printf(0, 20, id(font1), TextAlign::TOP_LEFT, "电费余额: %.1f", id(dianfei).state);
}
if (id(zk).has_state()) {
it.printf(0, 60, id(font1), TextAlign::BASELINE_LEFT, "水卡余额: %.2f", id(zk).state);
}
- id: page2 #第二页（显示温湿度）
lambda: |-
it.printf(64, 0, id(font1), TextAlign::TOP_CENTER, "信息");
if (id(wendu).has_state()) {
it.printf(0, 20, id(font1), TextAlign::TOP_LEFT, "室内温度: %.0f°C", id(wendu).state);
}
if (id(shidu).has_state()) {
it.printf(0, 60, id(font1), TextAlign::BASELINE_LEFT, "室内湿度: %.0f%%", id(shidu).state);
}
- id: page3 #第三页（显示时间）
lambda: |-
it.printf(64, 0, id(font1), TextAlign::TOP_CENTER, "时间");
it.strftime(64, 15, id(font2), TextAlign::CENTER_HORIZONTAL, "%H:%M", id(time1).now());
- id: page4 #第四页（显示显示器状态）
lambda: |-
it.printf(64, 0, id(font1), TextAlign::TOP_CENTER, "显示器状态");
if (id(statetest).has_state()) {
it.printf(64, 30, id(font3), TextAlign::CENTER_HORIZONTAL, "%s", id(statetest).state.c_str());
}
it.rectangle(15, 29, 97, 35); #画矩形
- id: page5 #第五页
lambda: |-
it.printf(35, 30, id(font4), TextAlign::CENTER_HORIZONTAL, "你坏坏");
it.image(70, 22, id(jpg)); #显示图片
interval:
- interval: 30s #每30秒循环翻页
then:
- display.page.show_next: my_display
- component.update: my_display
sensor: #从使用的HA实例中导入状态传感器
- platform: homeassistant
id: dianfei
entity_id: sensor.balance
internal: true
- platform: homeassistant
id: zk
entity_id: sensor.zk
internal: true
- platform: homeassistant
id: wendu
entity_id: sensor.tem
internal: true
- platform: homeassistant
id: shidu
entity_id: sensor.hum
internal: true
text_sensor: #从使用的HA实例中导入文本传感器
- platform: homeassistant
id: statetest
entity_id: sensor.computer_state
internal: true
on_value: #自动化，当有新的新值时触发时显示第四页
then:
- display.page.show: page4 #显示指定页
复制代码
字体文件和图片文件必须放在.yaml所在目录，导入HA传感器到ESPHome必须改成自己HA里面的传感器，其实接入这边并不困难，主要是显示渲染这块，我一开始用官方的实例直接来接入显示渲染，结果过发现并不能显示，于是我仔细看了一下文档发现是它其实是通过坐标的形式顶点的，x始终代表横坐标轴（宽度），y始终代表纵坐标（高度），默认情况下ESPHome会将文本左上方对齐，比如说上面第一页中的：
it.printf(64,0,id(font1),TextAlign::TOP_CENTER, “信息”);
这个64, 0,这个点就在横坐标64纵坐标0的位置开始显示（我的屏幕是128x64的，也就是顶部居中的位置），
id(font1)
这是调用上面font字体的id编号（包括字体的大小和内容），
TextAlign::TOP_CENTER
这是文本对齐方式（顶部居中），
“信息”
这是需要显示的内容，这里需要注意的是如果你要显示中文的话你必须在上面的字体设置glyphs:中加入你需要显示的中文，否者是无法显示中文的，一直开始没有仔细看文档还以为不支持显示中文，后来才知道是可以的，只不过之前没有定义glyphs：
关于%7.2f的解释：
% -启动格式
7 -表示该数字将右对齐，并且如果结果少于7个字符，则在左侧用空格填充
.2-将小数点四舍五入到小数点2后的数字
f -告诉printf参数的数据类型的说明符
画形状：
it.rectangle(15, 29, 97, 35); 这是画一个矩形
在（15，29）的位置画一个宽97高35的矩形
其他形状参考官方例子
所需字体文件(论坛限制了文件大小，只能转载了)
https://bbs.hassbian.com/forum.php?mod=attachment&aid=MTkwNzF8N2YwNjU1MzJ8MTYwMTg5MTU2Mnw2ODM5fDg1MDU%3D