畫出 View 的層級 3D 圖和樹形圖來分析層級關(guān)系

HierarchyLayout 介紹

HierarchyLayout是一個自定義的ViewGroup工具,用于分析視圖的層級關(guān)系锤灿,并畫出層級樹的結(jié)構(gòu)圖和可交互的3D 層級View:

HiearchyLayout的靜態(tài)圖兼耀,實際是可隨手勢改變 3D 形態(tài)的絮短。

hierarchyView.jpeg
hierarchyViewNode.jpeg
hierarchyNode.jpeg

查看工程地址 github 點我填抬,更多經(jīng)典自定義 ViewGroup集合

使用方法

HierarchyLayout 只有一個文件翻默,使用很簡便臼婆,只需要把它當(dāng)作一個普通的LinearLayout根布局就可以抒痒。可用 xml 根布局颁褂,也可用new 構(gòu)造動態(tài)添加都行故响。
例如 Activity 或 Fragment 的根布局使用:

<?xml version="1.0" encoding="utf-8"?>
<com.rexy.widgets.group.HierarchyLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:gravity="center_horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    //這里是其它xml 容器或 View .
</com.rexy.widgets.group.HierarchyLayout>

運行后就會出現(xiàn)一個層級分析界面,頂部是概要信息颁独,層級顯示最大層級數(shù)彩届,和平均層級數(shù),結(jié)點顯示所有的結(jié)點總數(shù)和 ViewGroup 型及 View 型的數(shù)目誓酒,測繪顯示的是最近一次measure layout draw 的時間樟蠕。

注意 HierarchyLayout 只能分析出它自身結(jié)點及其包含的直接或間接子結(jié)點的層級關(guān)系,若將它安裝在 Activity 的DecorView下就可分析出整個 Window 的層級信息靠柑。

實現(xiàn)原理分三部

  1. 作為根布局在onLayout 后 立即遞歸分析所有包含的子View信息寨辩,如結(jié)點類型,相對HierarchyLayout的層數(shù)歼冰,位置捣染,父親和孩子等依賴關(guān)系 并構(gòu)造一個完整的樹結(jié)構(gòu)記錄。
  2. 畫樹需要根據(jù)每層所在位置和葉子數(shù)計算權(quán)重 來決定每個結(jié)點在視圖上畫出的位置坐標(biāo)并畫圓停巷,每個結(jié)點連接父結(jié)點畫線就構(gòu)成樹耍攘。
  3. 畫3D層級圖形就是在第一部基礎(chǔ)上,一層一層的計算偏移量并用view.draw(canvas)來畫某一個結(jié)點畔勤。所有 View 都是相對HierarchyLayout的位置蕾各,通過getLocationInWindow獲取相對 Window 位置來決定 canvas需要平移的相對距離。
    再結(jié)合手勢計算x 軸庆揪,y軸的旋轉(zhuǎn)度式曲,通過canvas.rotate(x,y,0).

以上只是簡要的原理,具體還涉及隱藏下一層的 View缸榛,不然會畫重吝羞,詳細(xì)請看源碼 僅一個類。

最后感謝大家關(guān)注和多提建議或是issue内颗,如果很感興趣請 star 和 follower . 完整工程地址更多經(jīng)典自定義 ViewGroup集合

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末钧排,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子均澳,更是在濱河造成了極大的恐慌恨溜,老刑警劉巖,帶你破解...
    沈念sama閱讀 222,807評論 6 518
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件找前,死亡現(xiàn)場離奇詭異糟袁,居然都是意外死亡,警方通過查閱死者的電腦和手機躺盛,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,284評論 3 399
  • 文/潘曉璐 我一進店門项戴,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人槽惫,你說我怎么就攤上這事周叮。” “怎么了躯枢?”我有些...
    開封第一講書人閱讀 169,589評論 0 363
  • 文/不壞的土叔 我叫張陵则吟,是天一觀的道長。 經(jīng)常有香客問我锄蹂,道長氓仲,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 60,188評論 1 300
  • 正文 為了忘掉前任得糜,我火速辦了婚禮敬扛,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘朝抖。我一直安慰自己啥箭,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 69,185評論 6 398
  • 文/花漫 我一把揭開白布治宣。 她就那樣靜靜地躺著急侥,像睡著了一般砌滞。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上坏怪,一...
    開封第一講書人閱讀 52,785評論 1 314
  • 那天贝润,我揣著相機與錄音,去河邊找鬼铝宵。 笑死打掘,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的鹏秋。 我是一名探鬼主播尊蚁,決...
    沈念sama閱讀 41,220評論 3 423
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼侣夷!你這毒婦竟也來了横朋?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 40,167評論 0 277
  • 序言:老撾萬榮一對情侶失蹤惜纸,失蹤者是張志新(化名)和其女友劉穎叶撒,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體耐版,經(jīng)...
    沈念sama閱讀 46,698評論 1 320
  • 正文 獨居荒郊野嶺守林人離奇死亡祠够,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,767評論 3 343
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了粪牲。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片古瓤。...
    茶點故事閱讀 40,912評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖腺阳,靈堂內(nèi)的尸體忽然破棺而出落君,到底是詐尸還是另有隱情,我是刑警寧澤亭引,帶...
    沈念sama閱讀 36,572評論 5 351
  • 正文 年R本政府宣布绎速,位于F島的核電站,受9級特大地震影響焙蚓,放射性物質(zhì)發(fā)生泄漏纹冤。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 42,254評論 3 336
  • 文/蒙蒙 一购公、第九天 我趴在偏房一處隱蔽的房頂上張望萌京。 院中可真熱鬧,春花似錦宏浩、人聲如沸知残。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,746評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽求妹。三九已至乏盐,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間制恍,已是汗流浹背丑勤。 一陣腳步聲響...
    開封第一講書人閱讀 33,859評論 1 274
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留吧趣,地道東北人。 一個月前我還...
    沈念sama閱讀 49,359評論 3 379
  • 正文 我出身青樓耙厚,卻偏偏與公主長得像强挫,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子薛躬,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,922評論 2 361

推薦閱讀更多精彩內(nèi)容