提高可绘制图像效率的最佳方法?

Question

我仍在学习如何构建Android应用程序，我在设计中遇到的一个问题是如何一次显示多个图像，而不会崩溃和/或滞后。我见过很多人建议你使用LazyLoaders，或者换掉我的工作方式，但我想知道我的特定设计的最佳方法是什么，因为它相对复杂。

设计大致如下：标题，带有文本和个人资料图片。然后，一个水平滚动部分，里面有 3 张卡片。每张卡片包含 9 张照片的网格视图(因此，3 张卡片包含 27 张图像。除此之外，下面还有几张图片。

我已经更新了我的可绘制对象，使其尽可能低分辨率，而不会使应用程序看起来很垃圾，但我仍在为滞后而苦苦挣扎。有没有办法让卡片(以及随后的图像)在被拉入焦点后加载，或者有更好的加载图像的方法，而不是使用我的可绘制对象？

下面是 XML 的外观：

<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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:theme="@style/WaveTheme"
android:layout_height="?attr/actionBarSize"
android:background="@color/wave_drawer_background"
android:textColor="@color/wave_drawer_primary_text"
android:titleTextColor="@color/wave_drawer_primary_text"
android:subtitleTextColor="@color/wave_drawer_primary_text"
android:elevation="4dp" />
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="275dp"
android:background="#EEE"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="#EEE"
android:orientation="horizontal">
<LinearLayout
android:layout_width="300dp"
android:layout_height="75dp"
android:layout_marginTop="5dp"
android:background="#EEE"
android:orientation="vertical">
<LinearLayout
android:layout_width="300dp"
android:layout_gravity="center_vertical"
android:layout_marginTop="5dp"
android:layout_height="55dp"
android:layout_marginRight="5dp"
android:orientation="vertical"
>
<android.support.v7.widget.AppCompatTextView
android:layout_width="match_parent"
android:id="@+id/dashDate"
android:text="@string/currentDate"
android:paddingLeft="15dp"
android:paddingTop="0dp"
android:layout_marginTop="5dp"
android:textSize="12dp"
fontPath="fonts/Montserrat-SemiBold.otf"
android:textAllCaps="true"
android:textColor="#9e9e9e"
android:layout_height="15dp" />
<android.support.v7.widget.AppCompatTextView
android:layout_width="match_parent"
android:text="FOR YOU"
android:paddingLeft="15dp"
android:textSize="30dp"
android:includeFontPadding="false"
fontPath="fonts/Montserrat-Bold.otf"
android:textAllCaps="true"
android:textColor="#000"
android:layout_height="40dp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="75dp"
android:layout_gravity="right"
android:background="#EEE"
android:layout_marginTop="5dp"
android:orientation="horizontal"
android:layout_marginRight="20dp">
<LinearLayout
android:layout_width="35dp"
android:layout_gravity="center_vertical"
android:layout_height="35dp"
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
>
<de.hdodenhof.circleimageview.CircleImageView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/profile_image"
android:layout_width="35dp"
android:layout_height="35dp"
android:src="@drawable/temp_profile"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent">
<HorizontalScrollView
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="330dp"
android:layout_height="180dp"
android:orientation="vertical"
android:layout_marginLeft="10dp"
android:background="@drawable/layout_bg">
<GridLayout
android:layout_width="310dp"
android:layout_height="100dp"
android:orientation="horizontal"
android:columnCount="3"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="15dp"
>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="5dip"
android:src="@drawable/topcharts"
android:layout_height="100dp"
android:padding="1dp"
android:scaleType="centerCrop"
android:layout_width="125dp"/>
<GridLayout
android:orientation="vertical">
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/zedd"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/symphony"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
</GridLayout>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="5dip"
android:src="@drawable/calvinharris"
android:layout_height="100dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="125dp"/>
</GridLayout>
<GridLayout
android:layout_width="310dp"
android:layout_height="50dp"
android:orientation="horizontal"
android:columnCount="5"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/imtheone"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/littlemix2"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/kygo2"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/gallawaygirl"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/runup"
android:layout_height="50dp"
android:padding="1dp"
android:scaleType="centerCrop"
android:layout_width="62.5dp"/>
</GridLayout>
</LinearLayout>
<LinearLayout
android:layout_width="330dp"
android:layout_height="180dp"
android:orientation="vertical"
android:layout_marginLeft="10dp"
android:background="@drawable/layout_bg">
<GridLayout
android:layout_width="310dp"
android:layout_height="100dp"
android:orientation="horizontal"
android:columnCount="3"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="15dp"
>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="5dip"
android:src="@drawable/oldbutgoldnew"
android:layout_height="100dp"
android:padding="1dp"
android:scaleType="centerCrop"
android:layout_width="145dp"/>
<GridLayout
android:orientation="vertical">
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/derulo"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/jordan"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
</GridLayout>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="5dip"
android:src="@drawable/beyonce"
android:layout_height="100dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="105dp"/>
</GridLayout>
<GridLayout
android:layout_width="310dp"
android:layout_height="50dp"
android:orientation="horizontal"
android:columnCount="5"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/mama"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/ruby"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/slim"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/spice"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/viva"
android:layout_height="50dp"
android:padding="1dp"
android:scaleType="centerCrop"
android:layout_width="62.5dp"/>
</GridLayout>
</LinearLayout>
<LinearLayout
android:layout_width="330dp"
android:layout_height="180dp"
android:orientation="vertical"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="@drawable/layout_bg">
<GridLayout
android:layout_width="310dp"
android:layout_height="100dp"
android:orientation="horizontal"
android:columnCount="3"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="15dp"
>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="5dip"
android:src="@drawable/bedtime"
android:layout_height="100dp"
android:padding="1dp"
android:scaleType="centerCrop"
android:layout_width="125dp"/>
<GridLayout
android:orientation="vertical">
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/zedd"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/symphony"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
</GridLayout>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="5dip"
android:src="@drawable/calvinharris"
android:layout_height="100dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="125dp"/>
</GridLayout>
<GridLayout
android:layout_width="310dp"
android:layout_height="50dp"
android:orientation="horizontal"
android:columnCount="5"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/imtheone"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/littlemix2"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/kygo2"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/gallawaygirl"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:padding="1dp"
android:layout_width="62.5dp"/>
<com.makeramen.roundedimageview.RoundedImageView
app:riv_corner_radius="3dip"
android:src="@drawable/runup"
android:layout_height="50dp"
android:padding="1dp"
android:scaleType="centerCrop"
android:layout_width="62.5dp"/>
</GridLayout>

</LinearLayout>
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
</LinearLayout>

XML从那里继续，但以上是导致问题的原因。

PS，请说出相对简单的答案，因为我正在即时学习所有这些内容，并且只正确编写了大约 2 周的 Java！

Answer 1

恐怕你的问题太宽泛而无法得到实际答案，但这里有一些注意事项：

1) 减少布局层次结构的深度，相互嵌套的视图越多，UI 将(呈指数级)变慢。为什么？在这里阅读

2)使用库加载图像，例如毕加索或滑翔

3)实例化所有这些视图可能效率低下，因为在任何给定时间都只有少量视图可见，请尽可能尝试使用RecyclerView。

Answer 2

这是流畅加载图像的方法之一。也可用于加载jpg格式。 它还可用于减少要有效显示的高分辨率图像。

https://developer.android.com/topic/performance/graphics/load-bitmap.html