經常閃爍的插入符號如何實現？

Question

我正試圖實現一個儘可能少佔用系統資源的跨平臺UI庫。我正在考慮使用我自己的軟件渲染器或opengl。

對於靜止控制一切都很好，我只能在需要時重新繪製。但是，在實現動畫時，特別是在崇高文本中使用'階段'插入符號的動畫閃爍插頁時，我沒有看到簡單的方法來平衡資源使用情況和性能。

對於一個閃爍的插入符號，它需要非常頻繁地重新繪製插入符號（至少每秒15-20次，我猜）。一方面，軟件渲染器支持部分重繪，但實際速度太慢（對於大型重繪區域爲3-4fps，例如1000x800，這使得無法實現動畫）。另一方面，據我所知，opengl並不支持部分重繪，這意味着整個屏幕需要不斷地以15-20fps的速度渲染。

所以我的問題是：

1. 如何插入符號通常在不同的UI系統中實現？
2. 有什麼辦法讓opengl渲染到只有一部分屏幕？
   • 我知道glViewport使渲染成爲屏幕的一部分，但由於雙緩衝或其他東西，屏幕的其餘部分不會保持原樣。這樣我仍然需要再次渲染整個屏幕。

Answer 1

首先你需要問自己。 我真的需要部分重畫屏幕嗎？

OpenGL或更好的表示，GPU可以輕鬆繪製成千上萬個三角形。所以在你開始擺弄部分重畫屏幕之前，你應該改用基準，看看它是否值得研究。

但這並不意味着您必須無限次地重畫屏幕。發生更改時仍然可以重新繪製它。

因此，如果每500毫秒閃爍一次光標，則每500毫秒重繪一次。如果您正在運行動畫，則在該動畫正在播放時（或每次動畫進行需要重繪的更改時），都會不斷重繪。

這就是Chrome所做的。如果您打開開發工具（F12）並轉到時間軸選項卡，就可以看到這一點。

看看下面的截圖。時間軸的第一行顯示Chrome重新繪製窗口的頻率。

• 第一部分顯示了很多不斷重繪。 這是因爲我在頁面上滾動。
• 最後一節顯示每隔500毫秒重新繪製一次。 這是光標在文本框中閃爍。

打開一個新標籤的形象，更好地看到發生了什麼事情。

注意，它並沒有告訴瀏覽器是否完全重繪窗口或只是它的一部分。它只是顯示重繪的頻率。

爲了規避雙緩衝和部分重繪的問題。然後你可以畫一個framebuffer對象。現在，您可以儘可能多地使用glScissor()。如果你有各種靜態的東西，只有少數動態的東西。然後，您可以有多個幀緩衝區對象，並且只繪製靜態內容一次，並不斷更新包含動態內容的幀緩衝區。

然而（我不能強調這個足夠的）基準，並檢查是否這是甚至需要。擁有兩個幀緩衝區對象可能比僅僅重繪所有內容更昂貴。對於每個矩形都有一個緩衝區，與將單個緩衝區中的所有矩形進行打包相反。

最後舉一個例子，我們來看看NanoGUI (a minimalistic GUI library for OpenGL)。 NanoGUI不斷重新繪製屏幕。 問題而不是只是不斷重畫屏幕是，現在你需要一個系統發出重繪。現在在標籤上調用setText()需要回調並告訴窗口重繪。現在如果添加標籤的父面板不可見？然後setText()剛剛發出冗餘重畫的畫面。

我試圖做的一點是，如果你有一個發出重畫屏幕的系統。那麼這可能更容易出錯。因此，除非持續重繪是一個問題，否則這絕對是一個更優的起點。