User interface 闪烁插入符号通常是如何实现的？

我正在尝试实现一个跨平台的UI库，它尽可能少地占用系统资源。我正在考虑使用我自己的软件渲染器或opengl

对于固定控件，一切都很好，我只能在需要时重新喷漆。然而，在实现动画时，尤其是动画闪烁插入符号，如升华文本中的“阶段”插入符号，我看不到平衡资源使用和性能的简单方法

对于闪烁的插入符号，需要非常频繁地重新绘制插入符号（我想至少每秒15-20次）。一方面，软件渲染器支持部分重画，但速度太慢，不实用（对于较大的重画区域，速度为3-4 fps，例如1000x800，这使得无法实现动画）。另一方面，据我所知，opengl不支持部分重画，这意味着整个屏幕需要以15-20 fps的速度不断渲染

所以我的问题是：

插入符号通常是如何在各种UI系统中实现的

有没有办法让opengl只渲染屏幕的一部分？

• 我知道glViewport可以渲染部分屏幕，但由于双缓冲或其他原因，屏幕的其余部分没有保持原样。这样，我仍然需要再次渲染整个屏幕

---

首先你需要问问自己。 我真的需要部分重画屏幕吗

OpenGL或者更好的说法是GPU可以轻松地绘制数千个三角形。所以，在你开始摆弄屏幕的部分重画之前，你应该做个基准测试，看看它是否值得研究

然而，这并不意味着你必须无休止地重新绘制屏幕。您仍然可以在发生更改时重新绘制它

因此，如果光标每500毫秒闪烁一次，则每500毫秒重新绘制一次。如果动画正在运行，则在播放该动画时（或每次动画进行需要重新绘制的更改时）继续重新绘制

这就是Chrome、Firefox等的功能。如果打开开发人员工具（F12）并转到时间线选项卡，可以看到这一点

请看下面的屏幕截图。时间线的第一行显示Chrome重画窗口的频率

• 第一部分显示了大量的连续重画。这是因为我在页面上滚动
• 最后一节显示了每隔500毫秒的一次重画。这是文本框中的光标闪烁

在新选项卡中打开图像，以更好地查看正在发生的事情

请注意，它并不能说明Chrome是完全重画窗口还是只重画了部分窗口。它只是显示重画的频率。（如果你想看到重绘的区域，那么Firefox和Chrome都有“显示绘制矩形”。）

通过双缓冲和部分重绘来避免此问题。然后可以改为绘制帧缓冲区对象。现在你可以想用多少就用多少。如果你有各种静态的东西，只有一些动态的东西。然后可以有多个帧缓冲区对象，只绘制一次静态内容，并持续更新包含动态内容的帧缓冲区

然而（我再怎么强调也不过分）基准测试，并检查是否需要这样做。拥有两个帧缓冲区对象可能比总是重画所有内容更昂贵。与将所有矩形打包在单个缓冲区中形成对比的是，每个矩形都有一个缓冲区

最后，我们举一个例子。NanoGUI不断地重新绘制屏幕。 不只是不断重画屏幕的问题是，现在你需要一个系统来发布重画。现在，在标签上调用

setText（）

，需要回调并告诉窗口重新绘制。现在，如果添加标签的父面板不可见怎么办？然后，

setText（）

刚刚对屏幕进行了冗余重画

---

我想说的一点是，如果你有一个系统可以重新绘制屏幕。那么这可能更容易出错。因此，除非持续重画是一个问题，否则这绝对是一个更为理想的起点。

如果你每秒画15-20次，人眼无法感知变化。这就是为什么15-20 fps是期望帧速率的基础。闪烁的插入符号应该以0.3-0.6 fps的速度绘制。好吧，如果你看升华文本的插入符号，你会注意到它实际上是平滑的动画，所以我猜这需要比没有动画时更高的fps。