作业——在线学习Android课程之第十三周（视图优化案例）

下载bug项目：https://github.com/lzyzsd/AndroidUIPorblems，请注意打开开发者选项中的ShowOverDraw选项，查看都有哪些过度绘制区域，并作出优化。

一、工具介绍

1、如何打开ShowOverDraw

打开开发者选项，选中“Debug GPU overdraw”

选择“Show overdraw areas”

2、如何打开Profile GPU rendering

打开开发者选项，选中“Profile GPU rendering”

选择“On screen as bars”

二、案例分析

1、MainActivity界面

原图：

打开ShowOverDraw后显示

在setContentView()后添加

getWindow().setBackgroundDrawable(null);

结果：

查看activity_main.xml代码，发现背景”#2e2e2e”无实际意义，”This is test”层级复杂，改为如下

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="20dp">
    <!--android:background="#2e2e2e"-->

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"/>

    <!--<LinearLayout-->
        <!--android:layout_width="0dp"-->
        <!--android:layout_weight="1"-->
        <!--android:layout_height="match_parent"-->
        <!--android:background="#6c6c6c">-->
        <!--<TextView-->
            <!--android:layout_width="wrap_content"-->
            <!--android:layout_height="wrap_content"-->
            <!--android:layout_gravity="center_vertical"-->
            <!--android:textSize="20sp"-->
            <!--android:text="This is test"/>-->
    <!--</LinearLayout>-->

    <TextView
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:background="#6c6c6c"
        android:gravity="center_vertical"
        android:textSize="20sp"
        android:text="This is test"/>

</LinearLayout>

结果：

2、OverDrawViewActivity界面

原图

打开ShowOverDraw后显示

在setContentView()后添加

getWindow().setBackgroundDrawable(null);

结果：

查看OverDrawView代码，发现重复绘制，修改如下：

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    int width = getWidth();
    int height = getHeight();

    mPaint.setColor(Color.GRAY);
//        canvas.drawRect(0, 0, width, height, mPaint);
        canvas.drawRect(0, 0, width, height/4, mPaint);

        mPaint.setColor(Color.CYAN);
//        canvas.drawRect(0, height/4, width, height, mPaint);
        canvas.drawRect(0, height/4, width, height/3, mPaint);

        mPaint.setColor(Color.DKGRAY);
//        canvas.drawRect(0, height/3, width, height, mPaint);
        canvas.drawRect(0, height/3, width, height/2, mPaint);


        mPaint.setColor(Color.LTGRAY);
//        canvas.drawRect(0, height/2, width, height, mPaint);
        canvas.drawRect(0, height/2, width, height, mPaint);
    }

结果：

3、BusyOnDrawViewActivity界面

原图

打开ShowOverDraw后显示：

就“ShowOverDraw”方面不用修改。

鉴于题目仅要求“请注意打开开发者选项中的ShowOverDraw选项，查看都有哪些过度绘制区域，并作出优化。”，且“Profile GPU rendering”显示不全，故在此“解决过程”中不列出“Profile GPU rendering”方面的解决思路，仅在上交作业中完成修改。