轉(zhuǎn)載請(qǐng)標(biāo)注出處：http://www.lxweimin.com/p/7bf306c09c7e
先推薦一篇很不錯(cuò)的關(guān)于DisplayList構(gòu)建的文章 Android N中UI硬件渲染（hwui）的HWUI_NEW_OPS(基于Android 7.1)
看得出來(lái)作者對(duì)于硬件加速這塊研究的很透徹， 對(duì)于一些概念性的東西解釋的很到位，強(qiáng)烈建議大家去拜讀一下。
而本文以具體的例子(MyView繪制)來(lái)解釋DisplayList的構(gòu)建過(guò)程，相信會(huì)更加直觀, 更易理解DisplayList相關(guān)的代碼與概念。
一、前言
1.1 代碼環(huán)境
本文就是一個(gè)很簡(jiǎn)單的Android sample，onCreate里去inflate activity_main.xml
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
...
}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="@+id/sample_text"
android:layout_width="match_parent"
android:layout_height="60dp"
android:gravity="center"
android:textSize="20sp"
android:text="Hello World!" />
<cc.bobby.debugapp.MyView
android:layout_width="match_parent"
android:layout_height="100dp" />
</LinearLayout>
而MyView也就是override了 onDraw函數(shù)，這個(gè)見(jiàn)第二節(jié)。
最終的整個(gè)View圖大致如下所示
1.2 updateRootDisplayList的遞歸調(diào)用過(guò)程
基于1.1的View Hierarchy的代碼調(diào)用過(guò)程如下所示
二、MyView的回調(diào) onDraw
MyView的onDraw(Canvas canvas)回調(diào)函數(shù)允許開(kāi)發(fā)者在已經(jīng)獲得的Canvas上繪制了， 這些繪制就是直接在顯示設(shè)備上畫(huà)圖了么？ 當(dāng)然不是，實(shí)際上它僅僅是將繪制命令保存到 DisplayList 里面。
來(lái)看下自定義的 MyView中的 onDraw函數(shù)
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
mPaint.setColor(Color.RED);
canvas.drawCircle(100, 100, 100, mPaint); //繪制一個(gè)圓，圓心(100, 100), 半徑100
canvas.save();
canvas.translate(250, 0); //坐標(biāo)系向右移動(dòng)250
mPaint.setColor(Color.GRAY);
canvas.drawRect(0, 0, 200, 200, mPaint); //在新的坐標(biāo)系中畫(huà)一個(gè)200x200的正方形
mPaint.setColor(Color.YELLOW);
Path path = new Path();
path.moveTo(500, 0);
path.lineTo(700, 0);
path.lineTo(500, 200);
path.close();
canvas.drawPath(path, mPaint); //在新的坐標(biāo)系中畫(huà)一個(gè)三角形
canvas.restore();
}
最終繪制出來(lái)的圖如下MyView所示，一個(gè)圓，一個(gè)正方形，一個(gè)三角形
那這些繪制命令是怎么保存到DisplayList中的呢？
如圖所示，RenderNode在繪制時(shí)會(huì)創(chuàng)建一個(gè)DisplayListCanvas,而對(duì)應(yīng)于Native的是一個(gè)RecordingCanvas(這個(gè)HWUI_NEW_OPS宏已經(jīng)被默認(rèn)為true了), 這個(gè)RecordingCanvas會(huì)將后續(xù)的繪制命令保存到DisplayList當(dāng)中， 其中
- mSnapshot: 表示當(dāng)前的快照，用來(lái)記錄當(dāng)前繪制的坐標(biāo)系
- mFirstSnapshot: 一個(gè)初始快照，保存初始化的一些值
注意: 一個(gè)RenderNode可以有多個(gè)Snapshot, 這取決于程序調(diào)用 canvas.save的個(gè)數(shù)，所有的Snapshot通過(guò)單鏈表(*previous)組織起來(lái)，表頭由 mSnapshot 指定。
2.1 沒(méi)有Canvas.save
正常情況下，如果沒(méi)有 canvas.save， 所有的繪制都是在mSnapshot中進(jìn)行
如 MyView 中的 drawCircle
mPaint.setColor(Color.RED);
canvas.drawCircle(getPivotX(), getPivotY(), getHeight()/2, mPaint);
drawCircle在Native層的調(diào)用過(guò)程如下
void RecordingCanvas::drawCircle(float x, float y, float radius, const SkPaint& paint) {
if (radius <= 0) return;
drawOval(x - radius, y - radius, x + radius, y + radius, paint);
}
void RecordingCanvas::drawOval(float left, float top, float right, float bottom, const SkPaint& paint) {
addOp(alloc().create_trivial<OvalOp>(
Rect(left, top, right, bottom),
*(mState.currentSnapshot()->transform),
getRecordedClip(),
refPaint(&paint)));
}
mState.currentSnapshot() 即 mSnapshot，Snapshot中的transform是一個(gè)Matrix4的矩陣類，它主要保存當(dāng)前Snapshot中的 translate/rotate/scale等值， 其實(shí)就是坐標(biāo)系的值。
drawCircle在MyView的(100, 100)位置畫(huà)一個(gè)半徑為100的圓圈， 它在RecordingCanvas中表示如下,
2.2 有canvas.save的情況
接著看下onDraw后面的繪制
canvas.save();
canvas.translate(250, 0); //坐標(biāo)系向右移動(dòng)250
mPaint.setColor(Color.GRAY);
canvas.drawRect(0, 0, 200, 200, mPaint); //在新的坐標(biāo)系中畫(huà)一個(gè)200x200的正方形
mPaint.setColor(Color.YELLOW);
Path path = new Path();
path.moveTo(500, 0);
path.lineTo(700, 0);
path.lineTo(500, 200);
path.close();
canvas.drawPath(path, mPaint); //在新的坐標(biāo)系中畫(huà)一個(gè)三角形
canvas.restore();
canvas.save()在Native中使用一個(gè)新Snapshot_2來(lái)保存后續(xù)的繪制，因?yàn)閏anvas可能會(huì)有一些translate/scale又或者是rotate的操作， 而這些操作又會(huì)導(dǎo)致坐標(biāo)系的改變，如果直接在當(dāng)前Snapshot_1中繪制，一旦坐標(biāo)系變了，那可能會(huì)對(duì)后續(xù)的繪制命令造成意料之外的結(jié)果。
接下來(lái)我們來(lái)看下canvas.save的實(shí)現(xiàn)
public int save() {
return native_save(mNativeCanvasWrapper, MATRIX_SAVE_FLAG | CLIP_SAVE_FLAG);
}
native_save中第二個(gè)參數(shù)指明是否將當(dāng)前的Snapshot_1中的Matrix/clip相關(guān)信息保存到新的Snapshot_2中，即是否是基于當(dāng)前坐標(biāo)系繪制。而 native_save最終會(huì)調(diào)用CanvasState的saveSnapshot
int CanvasState::saveSnapshot(int flags) {
mSnapshot = allocSnapshot(mSnapshot, flags);
return mSaveCount++;
}
Snapshot* CanvasState::allocSnapshot(Snapshot* previous, int savecount) {
void* memory;
if (mSnapshotPool) {
memory = mSnapshotPool;
mSnapshotPool = mSnapshotPool->previous;
mSnapshotPoolCount--;
} else {
memory = malloc(sizeof(Snapshot));
}
return new (memory) Snapshot(previous, savecount);
}
mSnapshotPool是一個(gè)Snapshot的內(nèi)存沲子，因?yàn)镴ava層的DisplayListCanvas是臨時(shí)繪制，最終都會(huì)回收掉，同樣native的RecordingCanvas一樣，因此為了避免重復(fù)的申請(qǐng)/釋放內(nèi)存，索性就不釋放，只需重置一下就好， 而Snapshot在一個(gè)Canvas的個(gè)數(shù)取決于canvas.save的調(diào)用次數(shù), 盡管對(duì)調(diào)用次數(shù)沒(méi)有限制，但是防止內(nèi)存被消耗完，與save對(duì)應(yīng)的restore會(huì)釋放掉多于10個(gè)以上的Snapshot，即一個(gè)RecordingCanvas最多保存10個(gè)Snapshot內(nèi)存, 并儲(chǔ)存在 mSnapshotPool內(nèi)存沲子里。
最終的RecordingCanvas繪制后的類圖如下所示
注意: 事實(shí)上 canvas.restore會(huì)將 Snapshot_2回收到 mSnapshotPool中，為了方便，這里就不再刻意畫(huà)出來(lái)。
從圖中可以看出來(lái)，對(duì)坐標(biāo)系的變換比如translate會(huì)直接操作Snapshot的transform所指向的Matrix4, 而繪制命令(由RecordedOp表示)如 drawRect/drawPath會(huì)保存到DisplayList的ops vector中,
DisplayList中的chunk表示一組RecordedOp, 它用于記錄一組RecordedOp在ops中的位置區(qū)域，如圖中所示 chunk的beginOpIndex=0, endOpIndex=3, 表示ops[0], ops[1], ops[2]是一組InOder的繪制命令。
在Java層與Chunk相關(guān)的兩個(gè)函數(shù)被設(shè)置成了hide, 即開(kāi)發(fā)者不能直接調(diào)用
insertInorderBarrier()
insertReorderBarrier()
而這兩個(gè)函數(shù)最終會(huì)影響 RecordingCanvas mDeferredBarrierType，最終影響addOp這個(gè)函數(shù)
以上是MyView在canvas里繪制過(guò)程， 下面來(lái)看下DisplayList是怎樣保存到MyView的RenderNode中的
三、MyView保存DisplayList到RenderNode中
MyView的繪制過(guò)程
MyView.draw(canvas_LinearLayout_2, ViewGroup parent, long drawingTime) //MyView開(kāi)始draw, 注意此時(shí)傳進(jìn)來(lái)還是canvas_LinearLayout_2
MyView.updateDisplayListIfDirty //生成canvas_MyView(1200x100)
draw(canvas_MyView) //MyView開(kāi)始draw 此時(shí)的canvas: canvas_MyView
drawBackground(canvas_MyView) //不討論這個(gè)
onDraw(canvas_MyView) //回調(diào)MyView的onDraw
onDrawForeground(canvas_MyView) //略過(guò)
MyView.mRenderNode.end(canvas_MyView) //MyView的結(jié)束recording display list
canvas_LinearLayout_2.drawRenderNode(MyView.mRenderNode) //將MyView的DisplayList加入到LinearLayout_2的DisplayList中
MyView在updateDisplayListIfDirty函數(shù)中會(huì)去獲得一張Canvas，用來(lái)記錄繪制命令
public RenderNode updateDisplayListIfDirty() {
...
final DisplayListCanvas canvas = renderNode.start(width, height);
...
}
onDraw過(guò)程請(qǐng)參考第一節(jié)
現(xiàn)在來(lái)看下 MyView.mRenderNode.end(canvas_MyView)
public void end(DisplayListCanvas canvas) {
long displayList = canvas.finishRecording();
nSetDisplayList(mNativeRenderNode, displayList);
canvas.recycle(); //將Java層中的canvas回收到sPool中
mValid = true; //mValid=true表示RenderNode中DisplayList已經(jīng)有效了
}
canvas.finishRecording()函數(shù)會(huì)直接返回native中RecordingCanvas所指示的DisplayList地址
然后通過(guò) nSetDisplayList將DisplayList保存到Native的RenderNode的mStagingDisplayList中, 如下圖所示
四、LinearLayout_2保存MyView的DisplayList
第二節(jié)僅僅是將DisplayList保存到MyView的RenderNode中了，擴(kuò)展到一般性，即每個(gè)View都有自己的RenderNode, DisplayList, 各個(gè)View之間有沒(méi)有聯(lián)系? 如果有，那它們是怎樣聯(lián)系起來(lái)的呢？
接下來(lái)看第二節(jié)開(kāi)始的最后那塊代碼,
canvas_LinearLayout_2.drawRenderNode(MyView.mRenderNode)
canvas_LinearLayout_2即是LinearLayout_2的canvas, 而MyView又是LinearLayout_2的一個(gè)子view, 它們之間通過(guò)DisplayListCanvas的drawRenderNode 有了相關(guān)聯(lián)系，
public void drawRenderNode(RenderNode renderNode) {
nDrawRenderNode(mNativeCanvasWrapper, renderNode.getNativeDisplayList());
//mNativeCanvasWrapper指向LinearLayout_2對(duì)應(yīng)的native canvas,
//renderNode是MyView的RenderNode, 這里獲得的renderNode對(duì)應(yīng)jni中的RenderNode地址
}
nDrawRenderNode最終后調(diào)用到j(luò)ni android_view_DisplayListCanvas_drawRenderNode
static void android_view_DisplayListCanvas_drawRenderNode(JNIEnv* env,
jobject clazz, jlong canvasPtr, jlong renderNodePtr) {
Canvas* canvas = reinterpret_cast<Canvas*>(canvasPtr); // LinearLayout_2的canvas
RenderNode* renderNode = reinterpret_cast<RenderNode*>(renderNodePtr); //MyView的RenderNode
canvas->drawRenderNode(renderNode);
}
接著來(lái)看下drawRenderNode()
void RecordingCanvas::drawRenderNode(RenderNode* renderNode) {
auto&& stagingProps = renderNode->stagingProperties();
RenderNodeOp* op = alloc().create_trivial<RenderNodeOp>(
Rect(stagingProps.getWidth(), stagingProps.getHeight()),
*(mState.currentSnapshot()->transform),
getRecordedClip(),
renderNode);
int opIndex = addOp(op); //加入到DisplayList的ops中
if (CC_LIKELY(opIndex >= 0)) {
int childIndex = mDisplayList->addChild(op); //加入到 DisplayList的chirldren中，
// update the chunk's child indices
DisplayList::Chunk& chunk = mDisplayList->chunks.back();
chunk.endChildIndex = childIndex + 1;
if (renderNode->stagingProperties().isProjectionReceiver()) {
// use staging property, since recording on UI thread
mDisplayList->projectionReceiveIndex = opIndex;
}
}
}
由代碼可見(jiàn)，drawRenderNode會(huì)將子View的RenderNode封裝進(jìn)一個(gè)RenderNodeOp插入到ops中，作為一個(gè)繪制命令，這個(gè)繪制命令的意思是繪制整個(gè)子View, 而非普通的 OvalOp, RectOp。最后也將它插入到 children中，表示是子View(并不是說(shuō)children里保存的僅僅是子View, 像繪制背景這樣的也會(huì)保存到 children, 為了簡(jiǎn)單，就認(rèn)為children保存的是子View的RenderNode吧).
最后LinearLayout_2繪制完TextView和MyView的UML圖如下所示, 這樣子，父View與子View的DisplayList就構(gòu)建起聯(lián)系了。
五、DisplayList的樹(shù)形圖
private void updateRootDisplayList(View view, HardwareDrawCallbacks callbacks) {
updateViewTreeDisplayList(view); //此處View是DecorView, 更新View Tree的DisplayList
if (mRootNodeNeedsUpdate || !mRootNode.isValid()) {
DisplayListCanvas canvas = mRootNode.start(mSurfaceWidth, mSurfaceHeight);
try {
final int saveCount = canvas.save();
canvas.translate(mInsetLeft, mInsetTop);
callbacks.onHardwarePreDraw(canvas);
canvas.insertReorderBarrier();
canvas.drawRenderNode(view.updateDisplayListIfDirty());
canvas.insertInorderBarrier();
callbacks.onHardwarePostDraw(canvas);
canvas.restoreToCount(saveCount);
mRootNodeNeedsUpdate = false;
} finally {
mRootNode.end(canvas);
}
}
}
updateViewTreeDisplayList更新了整個(gè)UI的樹(shù)形DisplayList, 此時(shí)整個(gè)RenderNode頭是DecorView, 而在updateViewTreeDisplayList后面的代碼中又會(huì)將DecorView的RenderNode也就是DisplayList保存到ThreadedRenderer的的RootRenderNode中。
至此整個(gè)UI的DisplayList樹(shù)形圖就畫(huà)完了，盜用Android N中UI硬件渲染（hwui）的HWUI_NEW_OPS(基于Android 7.1)中的圖
