文章目錄

• 一、 GPU 過度繪制優(yōu)化總結(jié)
• 二、 CPU 渲染過程
• 三、 CPU 渲染性能調(diào)試工具 Layout Inspector
• 四、 Layout Inspector 組件樹 DecorView 分析
• 五、 實際的界面 UI 布局組件層級分析

一、 GPU 過度繪制優(yōu)化總結(jié)

---

前兩篇博客回顧 :

【Android 性能優(yōu)化】布局渲染優(yōu)化 ( 過渡繪制 | 自定義控件過渡繪制 | 布局文件層次深 | GPU 過渡繪制調(diào)試工具 | 背景過度繪制 ) 講解的是布局文背景設(shè)置 , 導(dǎo)致的 GPU 渲染過程中過度繪制 , 如何調(diào)試 GPU 渲染 , 主題背景與布局背景設(shè)置造成的過度繪制 , 及推薦處理方案 , 刪除主題背景 ;

【Android 性能優(yōu)化】布局渲染優(yōu)化 ( 過渡繪制 | 背景設(shè)置產(chǎn)生的過度繪制 | Android 系統(tǒng)的渲染優(yōu)化 | 自定義布局渲染優(yōu)化 ) 博客中講解了布局文件中的背景如何處理 , 自定義組件在 GPU 渲染過程中過度繪制如何進(jìn)行處理 ; 還有 Android 系統(tǒng)針對 CPU 傳遞數(shù)據(jù)到 GPU 進(jìn)行的優(yōu)化 ;

耗時操作總結(jié) :

在 【Android 性能優(yōu)化】布局渲染優(yōu)化 ( CPU 與 GPU 架構(gòu)分析 | 安卓布局顯示流程 | 視覺與幀率分析 | 渲染超時卡頓分析 | 渲染過程與優(yōu)化 ) 博客中分析了圖像渲染的 16 毫秒過程中

• CPU 渲染
• CPU 傳遞數(shù)據(jù)到 GPU
• GPU 渲染

是三大耗時操作 , 之前的兩篇博客針對 GPU 渲染中的過度繪制 , 如何調(diào)試 , 如何優(yōu)化 , 進(jìn)行了簡要介紹 ; CPU 傳遞數(shù)據(jù)到 GPU 過程是 Android 自己優(yōu)化的 , 不需要開發(fā)者干預(yù) ;

本篇博客開始針對 CPU 渲染過程進(jìn)行詳細(xì)講解 , CPU 渲染優(yōu)化 , 主要是提升 CPU 渲染的速度 , 即減少布局的嵌套 ;

上述優(yōu)化過程中 , 需求是第一位的 , 不能為了優(yōu)化而優(yōu)化 , 假如需求就是這種要求 , 那只能盡最大可能進(jìn)行 GPU 渲染優(yōu)化 , 不要盲目追求 $0$ 區(qū)域過度繪制 ;

二、 CPU 渲染過程

---

CPU 渲染過程 , 就是將 UI 組件轉(zhuǎn)換成多維向量圖像 ( 多邊形或紋理數(shù)據(jù) ) ;

CPU 渲染過程細(xì)節(jié) : UI 組件 -> 紋理 流程 , 根據(jù)該組件的位置 , 大小 , 形狀 , 顏色 等生成紋理數(shù)據(jù) ;

① 加載內(nèi)存 : 將 UI 組件加載到內(nèi)存中 ;

② 調(diào)用 UI 組件的 invalidate 方法 ;

③ 測量 : 調(diào)用 onMeasure 方法 , 測量布局組件 ;

④ 擺放 : 調(diào)用 onLayout 方法 , 擺放組件 ;

⑤ 圖像轉(zhuǎn)換 : 將測量擺放好的圖像 , 展示出來 , 轉(zhuǎn)為多維向量圖像 , 傳遞給 GPU ;

三、 CPU 渲染性能調(diào)試工具 Layout Inspector

---

在之前調(diào)試 GPU 渲染新能時 , 使用了手機開發(fā)者模式下的 “調(diào)試 GPU 過度繪制” 工具 , CPU 渲染使用下面介紹的 “Layout Inspector” 工具 ;

老版本的 Android Studio 中還可以使用 Hierarchy Viewer 工具 , 新版本的 Android Studio 已不支持該工具 , 使用 Layout Inspector 替代 ;

CPU 渲染性能調(diào)試工具 :

① 工具選擇 : 優(yōu)化 CPU 渲染情況 , 需要先知道 CPU 渲染的當(dāng)前性能 , 原來使用的是 Hierarchy Viewer 工具 ( 目前已不支持 ) , 現(xiàn)在使用 Layout Inspector 工具 ;

② 打開 Layout Inspector 工具 : 在 Android Studio 中 , 點擊菜單欄 “Tool” , 選擇 “Layout Inspector” 工具 , 即可打開該工具 ;

③ 選擇進(jìn)程 : 在彈出的 “Choose Process” 對話框中 , 選擇要分析的 UI 布局所在的進(jìn)程 ;

④ Layout Inspector 工具截圖 :

⑤ 左側(cè) View Tree 組件樹視圖 : 這是組件樹視圖 , 該視圖中可以清晰看到布局的層級 ;

四、 Layout Inspector 組件樹 DecorView 分析

---

手機界面窗口 : DecorView 是手機界面布局中的根布局 , 代表了手機屏幕窗口 ;

① 界面內(nèi)容 : LinearLayout 代表了顯示的內(nèi)容 ;

② 導(dǎo)航欄 : id/navigationBarBackground 代表了底部的 回退鍵 , Home 鍵 , 菜單鍵 按鈕的導(dǎo)航欄布局 ;

③ 狀態(tài)欄 : id/statusBarBackground 代表了狀態(tài)欄布局 ;

五、 實際的界面 UI 布局組件層級分析

---

1 . Layout Inspector 中查看實際的 UI 布局層次 : 圖中藍(lán)色被選中的部分是開發(fā)者定義的布局組件 , 其它都是系統(tǒng)自動生成的 ;

2 . UI 布局代碼 : 該布局使用了約束布局 , 只嵌套了 $1$ 層

<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"><TextViewandroid:id="@+id/sample_text"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Hello World!"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toLeftOf="parent"app:layout_constraintRight_toRightOf="parent"app:layout_constraintTop_toTopOf="parent" /><!-- 預(yù)覽 Camera 采集的圖像數(shù)據(jù) --><SurfaceViewandroid:id="@+id/surfaceView"android:layout_width="match_parent"android:layout_height="match_parent" /><TextViewandroid:id="@+id/textViewUrl"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="#FFFFFF"android:text="推流地址 : "android:padding="5dip"android:gravity="center"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toLeftOf="parent"app:layout_constraintRight_toRightOf="parent"app:layout_constraintTop_toTopOf="parent"app:layout_constraintVertical_bias="0"/><Buttonandroid:id="@+id/button_play"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="開始推流"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toLeftOf="parent"app:layout_constraintRight_toRightOf="parent"app:layout_constraintTop_toTopOf="parent"app:layout_constraintVertical_bias="1"/></androidx.constraintlayout.widget.ConstraintLayout>

總結(jié)

以上是生活随笔為你收集整理的【Android 性能优化】布局渲染优化 ( GPU 过度绘制优化总结 | CPU 渲染过程 | Layout Inspector 工具 | View Tree 分析 | 布局组件层级分析 )的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。