让整块屏幕亮出一种颜色

你好，我是吴老师。

这份是给你自己读的——不用等我讲，你一段一段往下看，看到让你停下来的地方，就照着做一遍。看不懂的整段复制给 AI，加一句"请一次只解释一个概念，讲完问我一个小问题"。

读完之后，你应该能：说出屏幕有多少像素、整屏换一次颜色要送多少数据；解释灯和屏幕的颜色格式、亮度控制有什么不同；亲手测出"刷整屏比刷半屏慢几倍"；自己设计一套单键换色规则。

用时：60–90 分钟。准备：板子、数据线、已经接入板卡 Skill 的 WorkBuddy。

一、今天只做一件事，但带着一个问题

上一课的反应力挑战里，你的屏幕上显示过"用时 438 毫秒"这样的字——那时候我只让你用屏幕看结果，没解释屏幕怎么工作的。今天补上。

先把话说清楚：**今天不做界面、不做按钮、不碰触摸。**整节课只做一件事——让整块屏幕变成一种颜色。

这听起来太简单了？可是我要你带着一个问题做实验：

一颗 RGB 灯能变红色，一块屏幕也能变红色——它们用的是同一套办法吗？

做完今天的实验，你的答案大概会改变。

二、第一步永远是查资料

屏幕最容易出错：不同板子的引脚、驱动、方向都不一样，凭印象猜，轻则花屏，重则一片黑。

我是小学生，正在学习这块 ESP32-S3 触摸屏板。
请先读取 esp32s3-touchboard-hardware-dev Skill，确认：
1. 屏幕型号和使用的显示库；
2. 屏幕的宽度、高度和显示方向，请说清哪个是横向、哪个是纵向；
3. 项目中已经验证过的"整屏填充颜色"示例在哪个文件；
4. BOOT 按钮实际连接的 GPIO。
只检查和解释，不改代码、不烧录，用容易懂的话告诉我。

把 AI 的回答抄进这张表（并要求它给出文件路径）：

这几行数据是后面所有屏幕课的地基——第 5 课讲坐标时我们还要用它们。

三、第一次让屏幕变红

请新建一个最简单的屏幕颜色实验：
开机后把整块屏幕填充为低亮度的红色，并保持不变。
使用项目中已经验证的屏幕初始化方法和显示库。
不要加入触摸、界面控件、WiFi 或串口功能。
请编译并烧录，烧录前先检查目标端口，保留旧示例。

烧录后仔细检查，回答三个问题：

1. 是不是每个角落都变红了？有一条边没填满吗？
2. 屏幕是竖着的，还是横着的？
3. 有没有花纹、条纹，或一半亮一半暗？

如果方向不对或花屏，把真实现象告诉 AI，请它先查资料再改，不要反复瞎试。

四、按 BOOT 换颜色

把上一课的按钮加进来：

请在刚才的屏幕颜色程序中加入 BOOT 按键：
每按下一次，整屏按红、绿、蓝、黄、紫、黑的顺序切换。
每次按下只切换一次，按住不重复切换，请做按键消抖。
屏幕只显示纯色，不加入文字和触摸控件。
请在代码中写中文注释，编译烧录前核对目标端口。

**先预测，再动手。**把表填完再去按按钮：

第 7 次是故意多问的：六种颜色走完后，屏幕会停在黑色不动，还是回到红色？先说出预测再按。

再按住不放三秒试试。消抖做好了应该只切换一次；如果程序写的是"按着就切换"，这 3 秒里颜色会疯狂乱跳——这就是上一课 A/B 版本的区别，现在换到屏幕上了。

五、灯和屏幕，一样的地方只有一句

它们唯一的相同点，第 1 课你已经亲手验证过：颜色都可以看成红、绿、蓝三种光混出来的——红+绿=黄，三个都没有=黑（不发光）。

这一句就够了。今天重点看不一样的地方，第一个不一样大得有点吓人。

六、第一个不一样：换一次颜色，要传多少数据？

数一数。

给一颗 RGB 灯换颜色：三个数，红多少、绿多少、蓝多少，每个占 1 个字节：

1 + 1 + 1 = 3 个字节

给整块屏幕换颜色：每一个像素的颜色都得送到。屏幕有多少个像素？

横向 240 个 × 纵向 320 个 = 76,800 个像素

每个像素占 2 个字节（为什么是 2 个，下一节讲）：

76,800 × 2 = 153,600 字节 ≈ 150 KB

把它们放在一起：

**5 万倍。**你没看错。你按一下按钮，屏幕"唰"地变个颜色，背后是主控刚送出 15 万个数字；而那颗小灯变个色只要 3 个。

这个比喻要修正一处：抄书可以慢慢抄，屏幕却必须在很短时间内传完，否则你会看见画面"刷"过去。所以主控不是慢慢送，而是用 SPI 这条通道飞快地送。

亲手测一测：让板子当秒表

数字是算出来的，还要能被看见。让板子自己计时：

请做一个测量实验，帮我比较"刷整屏"和"刷半屏"谁更慢：
1. 先在屏幕上方显示"准备测量"；
2. 记录开始时刻，然后整屏填充红色、蓝色交替，一共 100 次；
3. 记录结束时刻，在屏幕上显示"整屏 100 次：____ 毫秒"；
4. 按下 BOOT 后，只填充屏幕上半部分（一半的高度），同样交替 100 次，
   在屏幕上显示"半屏 100 次：____ 毫秒"。
请用中文注释，保留旧程序，烧录前核对端口。

先预测：整屏用的时间大约是半屏的几倍？写下来再烧录。

半屏像素只有一半，送的数据正好是一半。结果接近 2 倍的话，前面算的 15 万个字节就被你亲手验证了一次。差得远也别急——想一想：这 100 次里，除了"送数据"，还有没有别的事也在花时间？

七、第二个不一样：同样是红色，数字却不一样

给灯写 (40, 0, 0)，给屏幕也写 (40, 0, 0)，行吗？

RGB 灯：每个通道 1 个字节，0–255，三个通道共 3 个字节。

屏幕为了省数据，用另一种打包办法，叫 RGB565：

5 + 6 + 5 = 16 位，正好 2 个字节——这就是为什么一个像素只占 2 个字节，而不是 3 个。

代价是：屏幕能表示的颜色比灯少，红色只有 32 档。绿色多给一位，是因为人的眼睛对绿色更敏感。

让 AI 用实验给你看：

请在屏幕上做一个颜色对比实验：
上半屏用红色分量 40，下半屏用红色分量 80，
其余通道都是 0，两种颜色之间留一条黑色分隔线。
再在程序里打印这两种颜色在屏幕库里实际对应的数值是多少。
请用中文注释解释 RGB565 是怎么把三个数装进两个字节的。
一次讲一点，讲完问我一个问题，等我回答。

这里你会认识一个新名字：tft.color565(红, 绿, 蓝)——把 0–255 的三个数，转换成屏幕认识的 2 字节数字的小工具。今天只认它这个名字，不学写法。

顺便记住：**"255 是最大值"只对灯成立。**屏幕上红色最多 32 档。不要想当然地把一个设备上的数字搬到另一个设备用。

八、第三个不一样：屏幕的亮度有两个开关

这是今天最值得想的地方。

灯要变暗，只有一个办法：把颜色数值调小。

屏幕要变暗，有两个办法：

1. 把像素的颜色数值调小——让每个小窗子透过的光少一点；
2. 把背光调暗——把屏幕后面那片白光本身调暗。

屏幕的像素自己不发光，它像无数个小窗帘，只能控制屏幕后面那片白光透过来多少。这块板的背光接在 GPIO45，可以用 PWM 调节。

做个有点反直觉的实验：

请做一个背光对比实验：
按 BOOT 切换三种状态：
状态 1：屏幕填红色，背光最亮；
状态 2：屏幕填红色，背光调到一半；
状态 3：屏幕填红色，背光关闭。
每次按下只切换一次，请做消抖。屏幕上显示当前是状态几和背光数值。

先猜：状态 3 里，像素还是红的，但背光关了——你会看到什么？

答案大概是：屏幕变得很暗，甚至接近全黑——可程序里的像素明明还是红的。

这说明：屏幕上的"暗/亮"不只是像素颜色的事。这也是为什么手机可以"内容不变、只把亮度拉低"，而一颗 RGB 灯做不到这种分开控制。

九、像素到底是什么

前面一直说"像素"，现在正式认识它：

**像素就是画面里的一个小点。**我们这块屏幕有 76,800 个像素，是那颗 RGB 灯（1 个"点"）的七万多倍。

整屏变红，不是屏幕上有个叫"红色"的开关，而是程序把这 76,800 个小点一个一个都设成了红色。

和手机比一比：

手机像素是我们的三十多倍，所以需要更快的通道；我们这块屏小、速度要求低，用 SPI 就够了。区别在数量、发光方式和速度——用红绿蓝组成颜色这点，大家是一样的。

十、动手做

任务 1：整屏变红 + BOOT 换色

完成第三、四节。记录表填完整，特别是第 7 次的答案。

任务 2：刷屏计时实验

完成第六节。拿到两个毫秒数后，和预测对一对，再想想：除了送数据，还有什么在花时间？

任务 3：背光对比实验

完成第八节。重点记录状态 3 的观感——像素是红的，屏幕却几乎是黑的。你能不能用一句话给同学解释这个现象？

挑战：我的单键彩色屏

自己设计一套颜色顺序，把空补上：

我想做一个"____"作品。
BOOT 每按一次，屏幕依次显示：____、____、____、____。
每次只切换一次，按住不重复切换；屏幕只显示整屏纯色。
请先把颜色顺序写成表格，让我检查后再编译烧录。

几个方向参考：

完成后只改一个条件再验证：比如顺序不变，只把"按一次走一步"改成"按两次走一步"。先预测，再试。

十一、亮度上限和故障自查

**本课数值上限是 80，不是 255。**为什么？一颗灯发光面积很小，整块屏幕面积是它的成千上万倍，同样的数值，屏幕晃眼得多。（第 1 课灯的上限是 40；屏幕面积大，放宽到 80。）不要把整屏白光开到最大长时间盯着看——觉得刺眼就调回 40，保护眼睛比做完实验重要。

遇到问题先自查：

向 AI 描述时记住格式："我想让屏幕____，实际却是____。我按了____次 BOOT……"。"屏幕是黑的"是观察，"程序没烧进去"是推测——推测要用实验验证。

十二、自检小测

先自己想，再点开对答案。

十三、还想玩点什么

只有一种颜色、一个按钮，能做的事其实不少：

想做"屏幕上有按钮、能点能滑"的同学，请把想法记下来——那是界面，要用一套叫 LVGL 的工具，我们放到第二章专门学。今天只把"屏幕怎么显示颜色"弄明白——这恰恰是后面所有画面的地基。

下一课，我们给板子装一根"电话线"：让沉默的板子开口说话，也听懂你说的话。

本课的配套资源

本节配套的演示程序源码与可烧录固件，已整合到课程页面底部的「配套资源 · 在线烧录」区——插上你的 ESP32-S3 触摸屏板（Chrome / Edge 浏览器），点「在线烧录」即可直接写入，无需安装软件。

给 AI 的第一句话（每次新开对话都先说这句）：

请使用课程的 esp32s3-touchboard-hardware-dev Skill，
我现在做第 3 课（屏幕颜色），需要你帮我____。
改动前先说清依据的项目文件路径，烧录前先运行 arduino-cli board list 确认端口。