布局嵌套分析之Layout Inspector工具的使用

时间:2024-03-21 11:44:02

                           Layout Inspector工具的使用

如果还是直接看xml文件来看布局嵌套层数的话有必要看一下本文,使用Layout Inspector工具查看布局嵌套。

使用Layout Inspector工具的步骤:

1、打开方式:通过file > settings > key map 搜索Layout Inspector如下图

布局嵌套分析之Layout Inspector工具的使用

个人设置了一个快捷键方便后期使用。

2、布局文件:看下面xml文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".main.view.MainActivity">
 
    <TextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center"
        android:text="Layout Inspector工具的使用"
        android:textColor="#fff" />
 
    <TextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center_vertical"
        android:paddingLeft="20dp"
        android:text="这是第一层"
        android:textColor="#fff" />
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
 
        <TextView
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:gravity="center_vertical"
            android:paddingLeft="40dp"
            android:text="这是第二层"
            android:textColor="#fff" />
 
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
 
            <TextView
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:gravity="center_vertical"
                android:paddingLeft="60dp"
                android:text="这是第三层"
                android:textColor="#fff" />
 
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">
 
                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="50dp"
                    android:gravity="center_vertical"
                    android:paddingLeft="80dp"
                    android:text="这是第四层"
                    android:textColor="#fff" />
 
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical">
 
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="50dp"
                        android:gravity="center_vertical"
                        android:paddingLeft="100dp"
                        android:text="这是第五层"
                        android:textColor="#fff" />
 
                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:src="@mipmap/ic_launcher" />
 
                </LinearLayout>
 
            </LinearLayout>
        </LinearLayout>
    </LinearLayout>
 
</LinearLayout>

这是一个五层嵌套的布局如下图

布局嵌套分析之Layout Inspector工具的使用

3、使用Layout Inspector工具:查看布局嵌套需要先把工程运行起来,本文使用的是真机调试。没有运行工程打开工具图1,图2为工程正常运行状态。点击ok键查看布局嵌套层级图3。

布局嵌套分析之Layout Inspector工具的使用布局嵌套分析之Layout Inspector工具的使用布局嵌套分析之Layout Inspector工具的使用

因为时间关系Layout Inspector工具使用就简单介绍到这里。谢谢大家