這是我做一個十萬點實時刷新的圖表控件遇到的問題,做過高性能圖表的伙伴大概都知道,此時需要關閉命中測試的功能,無論是控件的還是 Drawing 的,否則計算命中測試的耗時將會讓主線程卡住。為了解決此問題,有多個可以選擇的方法,在此控件,我選擇的是采用 VisualBrush 的方法。將 DrawingVisual 繪制到 VisualBrush 里面,再將 VisualBrush 作為貼圖給矩形使用,這樣的優勢在於可以在命中測試的時候,只處理矩形。矩形命中測試的耗時可以忽略。但是在一些 4k 加百分之 200 的 DPI 縮放設備上,看不到某些 GlyphRun 的內容,本文記錄此問題和對應的解決方法
前置要求:
- 4k 分辨率屏幕
- 百分之兩百 DPI 縮放
- 使用 GlyphRun 直接或間接
- 繪制到 VisualBrush 中
在 WPF 的底層文本繪制都是采用 GlyphRun 繪制,因此可以認定為影響為全部文本,以及對應的文本控件
現象:
有某些文本內容不繪制渲染出來,看不見某些文本內容,但是在相同的 DrawingContext 里面的其他繪制內容,如線條或圖片等都可以正常繪制出來
以上的現象包括:
- 在某些設備上,暫時未找到具體影響因素
- 某些文本內容不可見,而不是全部文本內容
- 對整個控件進行 RenderTransform 之后可以讓某些文本可見
- 對界面進行刷新,可以讓文本可見
- 對界面進行偶數次刷新,文本不可見
開始之前先回答一下為什么會在圖表控件里面,將 DrawingContext 的內容放入到 VisualBrush 中。如上文所述,這是因為 DrawingContext 對象是從 DrawingVisual 里面獲取的,而 DrawingVisual 的 RenderOpen 返回的是一個帶 RenderData 收集器的 DrawingContext 對象,也就是說此對象還遠遠不是最終被執行 DirectX 渲染的對象,僅僅是收集繪制內容,放入到 RenderData 里面。后續還有在執行默認命中測試的時候,取 RenderData 里面的內容進行計算渲染邊距以及命中測試。總之,如果將 DrawingVisual 加入到視覺樹里面,那么將會因為存在命中測試等邏輯導致需要執行很多邏輯而降低性能
為了提升性能,提升性能的其中一個方法是減少 CPU 工作量,也就是減少計算邏輯量。此時將 DrawingVisual 放入到 VisualBrush 中,作為 Brush 給一個矩形做填充,這樣的優勢在於進行命中測試的時候,默認是無視圖層的,只會對矩形進行命中測試。剛好矩形命中測試的耗時是基本可以被忽略的,因此也就能極大提升了性能
需要說明的是,默認是可以無視命中測試給 DrawingVisual 帶來的性能損耗,因為計算速度還是非常快的。但是在圖表控件里面,架不住點的數量很多,盡管命中測試性能足夠高,然而點的數量足夠多也可以拖住性能
如下是將 DrawingVisual 繪制到 VisualBrush 上,再將 VisualBrush 貼到矩形上的方法,也就是我的圖表控件的核心繪制邏輯
private DrawingVisual CreateVisual()
{
var dv = new DrawingVisual();
_visualBase = dv;
var drawingContext = dv.RenderOpen();
// 繪制點
DrawPoints(drawingContext);
// 繪制線
DrawLine(drawingContext);
// 繪制文本
DrawGlyphRun(drawingContext);
drawingContext.Close();
var ret = new DrawingVisual();
using (var dw = ret.RenderOpen())
{
var visualBrush = new VisualBrush(dv)
{
Stretch = Stretch.None,
};
dw.DrawRectangle(visualBrush, null, dv.ContentBounds);
_visualBrush = visualBrush;
}
return ret;
//return dv;
}
將繪制點和繪制線的 DrawingVisual 也就是上文的 dv 創建出來 drawingContext 用來做實際的圖表內容繪制收集。而將 dv 作為 VisualBrush 的輸入,接着新建一個叫 ret 的 DrawingVisual 對象,在這里面重新繪制出矩形然后用 VisualBrush 做貼圖
這樣做的優勢在於可以利用到 WPF 無視貼圖的命中測試的特性,而提升性能
但是帶來的問題就是存在某些 GlyphRun 的文本不繪制,在相同的 drawingContext 繪制的點和線是可見的,只有文本看不到
其中最優解決方法是干掉 VisualBrush 而是換成 DrawingBrush 作為貼圖,更改之后代碼如下
private DrawingVisual CreateTextVisual()
{
// var dv = new DrawingVisual();
var dv = new DrawingGroup();
_visualBase = dv;
var drawingContext = dv.Open();
// 繪制點
DrawPoints(drawingContext);
// 繪制線
DrawLine(drawingContext);
// 繪制文本
DrawGlyphRun(drawingContext);
drawingContext.Close();
var ret = new DrawingVisual();
using (var dw = ret.RenderOpen())
{
// var visualBrush = new VisualBrush(dv)
_drawingBrush = new DrawingBrush(dv);
dw.DrawRectangle(_drawingBrush, null, dv.Bounds);
}
return ret;
//return dv;
}
如上面代碼,將 dv 的類型從 DrawingVisual 換成 DrawingGroup 類型,將后續的貼圖從 VisualBrush 換成 DrawingBrush 類型。這樣就能修復某些文本不顯示的問題
為什么 VisualBrush 會讓某些文本不更新臟就不顯示?和 VisualBrush 的機制有關,在 VisualBrush 里面,要求先將內容渲染為 Bitmap 位圖再作為某個元素的貼圖層,執行順序上需要有些復雜。而為什么如此復雜的邏輯會挖坑?表示我追蹤了代碼也沒有發現更本質的問題,而且此問題只有在我的此圖表控件才有偶爾復現,在能復現的設備上,每次都能用相同的圖表數據進行復現。在能復現的設備上,如果變更了圖表的內容,也許就又不復現了
如果將我的圖表控件放在 demo 上跑,那也不會有啥鍋。我也不知道是不是我的應用層挖的坑。因為我的應用層也充滿了各個逗比加詭異的邏輯,因此我也不好說是不是某個有趣的邏輯的鍋。此問題只有在使用特定的圖表內容(很復雜)再加上放入到我的某個特定的應用里面才能復現,要調試 WPF 層的話,必須加入到我的應用層才能開始調試此問題。因此預計我也不會繼續往底層調試,告訴大家具體的原因