Android UI性能优化实战识别绘制中的性能问题

最新推荐文章于 2024-06-13 14:21:23 发布

2401_84160310

最新推荐文章于 2024-06-13 14:21:23 发布

阅读量238

点赞数 4

分类专栏：程序员文章标签： android ui 性能优化

本文链接：https://blog.csdn.net/2401_84160310/article/details/137617829

版权

程序员专栏收录该内容

30 篇文章 0 订阅

订阅专栏

android:layout_margin=“@dimen/avatar_layout_margin” />

<LinearLayout

android:layout_width=“match_parent”

android:layout_height=“wrap_content”

android:background=“@android:color/darker_gray”

android:orientation=“vertical”>

<RelativeLayout

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:background=“@android:color/white”

android:textColor=“#78A”

android:orientation=“horizontal”>

<TextView xmlns:android=“http://schemas.android.com/apk/res/android”

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_alignParentLeft=“true”

android:padding=“@dimen/narrow_space”

android:text=“@string/hello_world”

android:gravity=“bottom”

android:id=“@+id/id_chat_name” />

<TextView xmlns:android=“http://schemas.android.com/apk/res/android”

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_alignParentRight=“true”

android:textStyle=“italic”

android:text=“@string/hello_world”

android:padding=“@dimen/narrow_space”

android:id=“@+id/id_chat_date” />

<TextView xmlns:android=“http://schemas.android.com/apk/res/android”

android:layout_width=“match_parent”

android:layout_height=“match_parent”

android:padding=“@dimen/narrow_space”

android:background=“@android:color/white”

android:text=“@string/hello_world”

android:id=“@+id/id_chat_msg” />

Activity的代码

package com.zhy.performance_01_render;

import android.os.Bundle;

import android.os.PersistableBundle;

import android.support.annotation.Nullable;

import android.support.v7.app.AppCompatActivity;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.ArrayAdapter;

import android.widget.ImageView;

import android.widget.ListView;

import android.widget.TextView;

/**

Created by zhy on 15/4/29.

public class OverDrawActivity01 extends AppCompatActivity

{

private ListView mListView;

private LayoutInflater mInflater ;

@Override

protected void onCreate(@Nullable Bundle savedInstanceState)

{

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_overdraw_01);

mInflater = LayoutInflater.from(this);

mListView = (ListView) findViewById(R.id.id_listview_chats);

mListView.setAdapter(new ArrayAdapter(this, -1, Droid.generateDatas())

{

@Override

public View getView(int position, View convertView, ViewGroup parent)

{

ViewHolder holder = null ;

if(convertView == null)

{

convertView = mInflater.inflate(R.layout.chat_item,parent,false);

holder = new ViewHolder();

holder.icon = (ImageView) convertView.findViewById(R.id.id_chat_icon);

holder.name = (TextView) convertView.findViewById(R.id.id_chat_name);

holder.date = (TextView) convertView.findViewById(R.id.id_chat_date);

holder.msg = (TextView) convertView.findViewById(R.id.id_chat_msg);

convertView.setTag(holder);

}else

{

holder = (ViewHolder) convertView.getTag();

}

Droid droid = getItem(position);

holder.icon.setBackgroundColor(0x44ff0000);

holder.icon.setImageResource(droid.imageId);

holder.date.setText(droid.date);

holder.msg.setText(droid.msg);

holder.name.setText(droid.name);

return convertView;

}

class ViewHolder

{

ImageView icon;

TextView name;

TextView date;

TextView msg;

}

});

}

实体的代码

package com.zhy.performance_01_render;

import java.util.ArrayList;

import java.util.List;

public class Droid

{

public String name;

public int imageId;

public String date;

public String msg;

public Droid(String msg, String date, int imageId, String name)

{

this.msg = msg;

this.date = date;

this.imageId = imageId;

this.name = name;

}

public static List generateDatas()

{

List datas = new ArrayList();

datas.add(new Droid(“Lorem ipsum dolor sit amet, orci nullam cra”, “3分钟前”, -1, “alex”));

datas.add(new Droid(“Omnis aptent magnis suspendisse ipsum, semper egestas”, “12分钟前”, R.drawable.joanna, “john”));

datas.add(new Droid(“eu nibh, rhoncus wisi posuere lacus, ad erat egestas”, “17分钟前”, -1, “7heaven”));

datas.add(new Droid(“eu nibh, rhoncus wisi posuere lacus, ad erat egestas”, “33分钟前”, R.drawable.shailen, “Lseven”));

return datas;

}

现在的效果是：

注意，我们的需求是整体是Activity是个白色的背景。

开启Show GPU Overdraw以后：

对比上面的参照图，可以发现一个简单的ListView展示Item，竟然很多地方被过度绘制了4X 。那么，其实主要原因是由于该布局文件中存在很多不必要的背景，仔细看上述的布局文件，那么开始移除吧。

不必要的Background 1

我们主布局的文件已经是background为white了，那么可以移除ListView的白色背景

不必要的Background 2

Item布局中的LinearLayout的android:background="@android:color/darker_gray"

不必要的Background 3

Item布局中的RelativeLayout的android:background="@android:color/white"

不必要的Background 4

Item布局中id为id_msg的TextView的android:background="@android:color/white"

这四个不必要的背景也比较好找，那么移除后的效果是：

对比之前的是不是好多了~~~接下来还存在一些不必要的背景，你还能找到吗？

不必要的Background 5

这个背景比较难发现，主要需要看Adapter的getView的代码，上述代码你会发现，首先为每个icon设置了背景色（主要是当没有icon图的时候去显示），然后又设置了一个头像。那么就造成了overdraw，有头像的完全没必要去绘制背景，所有修改代码：

Droid droid = getItem(position);

if(droid.imageId ==-1)

{

holder.icon.setBackgroundColor(0x4400ff00);

holder.icon.setImageResource(android.R.color.transparent);

}else

{

holder.icon.setImageResource(droid.imageId);

holder.icon.setBackgroundResource(android.R.color.transparent);

}

ok，还有最后一个，这个也是非常容易被忽略的。

不必要的Background 6

记得我们之前说，我们的这个Activity要求背景色是白色，我们的确在layout中去设置了背景色白色，那么这里注意下，我们的Activity的布局最终会添加在DecorView中，这个View会中的背景是不是就没有必要了，所以我们希望调用mDecor.setWindowBackground(drawable);，那么可以在Activity调用getWindow().setBackgroundDrawable(null);。

setContentView(R.layout.activity_overdraw_01);

getWindow().setBackgroundDrawable(null);

ok，一个简单的listview显示item，我们一共找出了6个不必要的背景，现在再看最后的Show GPU Overdraw 与最初的比较。

ok，对比参照图，基本已经达到了最优的状态。

5、Overdraw 的处理方案二：clipRect的妙用

我们在自定义View的时候，经常会由于疏忽造成很多不必要的绘制，比如大家看下面这样的图：

多张卡片叠加，那么如果你是一张一张卡片从左到右的绘制，效果肯定没问题，但是叠加的区域肯定是过度绘制了。

并且material design对于界面设计的新的风格更容易造成上述的问题。那么有什么好的方法去改善呢？

答案是有的，android的Canvas对象给我们提供了很便利的方法clipRect就可以很好的去解决这类问题。

下面通过一个实例来展示，那么首先看一个效果图：

左边显示的时效果图，右边显示的是开启Show Override GPU之后的效果，可以看到，卡片叠加处明显的过度渲染了。 (ps:我对这个View添加了一个背景色~~仔细看下面的代码） * View代码

package com.zhy.performance_01_render;

import android.content.Context;

import android.graphics.Bitmap;

import android.graphics.BitmapFactory;

import android.graphics.Canvas;

import android.view.View;

/**

Created by zhy on 15/4/30.

public class CardView extends View

{

private Bitmap[] mCards = new Bitmap[3];

private int[] mImgId = new int[]{R.drawable.alex, R.drawable.chris, R.drawable.claire};

public CardView(Context context)

{

super(context);

Bitmap bm = null;

for (int i = 0; i < mCards.length; i++)

{

bm = BitmapFactory.decodeResource(getResources(), mImgId[i]);

mCards[i] = Bitmap.createScaledBitmap(bm, 400, 600, false);

}

setBackgroundColor(0xff00ff00);

}

@Override

protected void onDraw(Canvas canvas)

{

super.onDraw(canvas);

canvas.save();

canvas.translate(20, 120);

for (Bitmap bitmap : mCards)

{

canvas.translate(120, 0);

canvas.drawBitmap(bitmap, 0, 0, null);

}

canvas.restore();

}

Activity代码

/**

Created by zhy on 15/4/30.

public class OverDrawActivity02 extends AppCompatActivity

{

@Override

protected void onCreate(@Nullable Bundle savedInstanceState)

{

super.onCreate(savedInstanceState);

setContentView(new CardView(this));

}

那么大家可以考虑下如何去优化，其实很明显哈，我们上面已经说了使用cliprect方法，那么我们目标直指

自定义View的onDraw方法。

修改后的代码：

@Override

protected void onDraw(Canvas canvas)

{

super.onDraw(canvas);

canvas.save();

canvas.translate(20, 120);

for (int i = 0; i < mCards.length; i++)

{

canvas.translate(120, 0);

canvas.save();

if (i < mCards.length - 1)

{

canvas.clipRect(0, 0, 120, mCards[i].getHeight());

}

canvas.drawBitmap(mCards[i], 0, 0, null);

canvas.restore();

}

canvas.restore();

}

分析得出，除了最后一张需要完整的绘制，其他的都只需要绘制部分；所以我们在循环的时候，给i到n-1都添加了clipRect的代码。

最后的效果图：

可以看到，所有卡片变为了淡紫色，对比参照图，都是1X过度绘制，那么是因为我的View添加了一个

ff00ff00的背景，可以说明已经是最优了。

如果你按照上面的修改，会发现最终效果图不是淡紫色，而是青色（2X），那是为什么呢？因为你还忽略了

一个优化的地方，本View已经有了不透明的背景，完全可以移除Window的背景了，即在Activity中，添加getWindow().setBackgroundDrawable(null);代码。

好了，说完了Overdraw的检测与处理，那么还剩下一个layouts、invalidations过慢的问题，那么这类问题主要可能是你的XML层级过多导致的，当然也有很好的工具可以用来检测，那么就是Hierarchy Viewer。

6、减少不必要的层次：巧用Hierarchy Viewer

1、Hierarchy Viewer工具简介

Android SDK中包含这个工具，不过大家肯定也不陌生了~~~

那么就简单说一下它在哪，如何使用，以及真机无法使用该工具该怎么解决。

Hierarchy Viewer在哪？

本博客使用IDE为Android Studio，那么只需要按照下图步骤即可找到：

其他IDE的兄弟，找到这个肯定没问题，不过还是建议慢慢的转向AS。

如何使用？

一图胜千言：

关注下，所有框住的区域~~

无法连接真机调试怎么办？

如果你不存在这样的问题，直接跳过本节。

Android的官方文档中，有这么一句话：

出于安全考虑，Hierarchy Viewer只能连接Android开发版手机或是模拟器

看来的确是存在这样的问题了，并且网上也有一些解决方案，修改源码神马的，有兴趣去试试。

这里推荐一种解决方案：romainguy在github上有个项目ViewServer，可以下载下来导入到IDE中，里面有个ViewServer的类，类注释上也标注了用法，在你希望调试的Activity以下该三个方法中，添加几行代码：

public class MyActivity extends Activity {

public void onCreate(Bundle savedInstanceState) {

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数Android工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但对于培训机构动则几千的学费，着实压力不小。自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！

因此收集整理了一份《2024年Android移动开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点，真正体系化！

由于文件比较大，这里只是将部分目录大纲截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且后续会持续更新

如果你觉得这些内容对你有帮助，可以添加V获取：vip204888 （备注Android）

总结

【Android 详细知识点思维脑图（技能树）】

其实Android开发的知识点就那么多，面试问来问去还是那么点东西。所以面试没有其他的诀窍，只看你对这些知识点准备的充分程度。so，出去面试时先看看自己复习到了哪个阶段就好。

虽然 Android 没有前几年火热了，已经过去了会四大组件就能找到高薪职位的时代了。这只能说明 Android 中级以下的岗位饱和了，现在高级工程师还是比较缺少的，很多高级职位给的薪资真的特别高（钱多也不一定能找到合适的），所以努力让自己成为高级工程师才是最重要的。

这里附上上述的面试题相关的几十套字节跳动，京东，小米，腾讯、头条、阿里、美团等公司19年的面试题。把技术点整理成了视频和PDF（实际上比预期多花了不少精力），包含知识脉络 + 诸多细节。

由于篇幅有限，这里以图片的形式给大家展示一小部分。

网上学习 Android的资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。希望这份系统化的技术体系对大家有一个方向参考。

一个人可以走的很快，但一群人才能走的更远。不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎扫码加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

习笔记、源码讲义、实战项目、讲解视频，并且后续会持续更新**

如果你觉得这些内容对你有帮助，可以添加V获取：vip204888 （备注Android）
[外链图片转存中…(img-Byj2yrQ4-1712768799229)]

总结

【Android 详细知识点思维脑图（技能树）】

[外链图片转存中…(img-fQrGZXgR-1712768799229)]

这里附上上述的面试题相关的几十套字节跳动，京东，小米，腾讯、头条、阿里、美团等公司19年的面试题。把技术点整理成了视频和PDF（实际上比预期多花了不少精力），包含知识脉络 + 诸多细节。

由于篇幅有限，这里以图片的形式给大家展示一小部分。

[外链图片转存中…(img-QT6ceN1G-1712768799229)]

一个人可以走的很快，但一群人才能走的更远。不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎扫码加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！
[外链图片转存中…(img-Fw188YAG-1712768799230)]

2401_84160310

关注

4
点赞
踩
10

收藏

觉得还不错? 一键收藏
0
评论
Android UI性能优化实战识别绘制中的性能问题

Android SDK中包含这个工具，不过大家肯定也不陌生了~~~那么就简单说一下它在哪，如何使用，以及真机无法使用该工具该怎么解决。Hierarchy Viewer在哪？本博客使用IDE为Android Studio，那么只需要按照下图步骤即可找到：其他IDE的兄弟，找到这个肯定没问题，不过还是建议慢慢的转向AS。如何使用？一图胜千言：关注下，所有框住的区域~~无法连接真机调试怎么办？如果你不存在这样的问题，直接跳过本节。
复制链接

扫一扫