ImageView 导致 RecyclerView 中的缓慢滚动性能答案

【问题标题】：ImageView cause slow scroll performances in RecyclerViewImageView 导致 RecyclerView 中的缓慢滚动性能
【发布时间】：2016-07-21 15:27:38
【问题描述】：

我实际上是在使用 Xamarin.Android 开发一个应用程序，但我无法解决我的 RecyclerView 的性能问题。

问题来了：我有一个显示 Cardviews 的 RecyclerView，只有 4 个。每个 Cardview 都包含一个图像，我试图在 ImageView 中保持非常亮（65Ko）。这些图像是从 jpg 格式的 drawable res 文件夹中加载的。

卷轴太慢了！ 我尽我所能优化 Cardview 的布局，它在没有 Imageviews 的情况下运行完美。

我怎样才能使图像变得流畅？

这是我的 RecyclerView：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:local="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="centerCrop"
        android:src="@drawable/background" />
    <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            local:MvxBind="Visibility InvertedVisibility(IsError)">
    <MvvmCross.Droid.Support.V7.RecyclerView.MvxRecyclerView
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="56dp"
        android:layout_marginBottom="8dp"
        android:clipToPadding="false"
        local:MvxBind="ItemsSource BenchmarkWods; ItemClick WodSelectedCommand"
        local:MvxItemTemplate="@layout/listitem_benchmarkwod"/>
     </LinearLayout>

</FrameLayout>

这是我的 CardView 模板：

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:local="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card_view:cardElevation="4dp"
    android:translationZ="4dp"
    card_view:cardCornerRadius="2dp"
    card_view:cardPreventCornerOverlap="true"
    android:layout_marginTop="8dp"
    android:layout_marginLeft="8dp"
    android:layout_marginRight="8dp"
    card_view:cardBackgroundColor="#ffffff">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="140dp">
            <ImageView
                android:layout_width="300dp"
                android:layout_height="140dp"
                android:scaleType="centerCrop"
                android:src="@drawable/stock1_small" />
            <View
                android:layout_width="match_parent"
                android:layout_height="140dp"
                android:background="#80000000" />
            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="140dp"
                android:padding="8dp">
                <TextView
                    android:id="@+id/wod_date"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="some text"
                    android:textColor="#ffffff"
                    android:layout_alignParentTop="true"
                    android:layout_alignParentLeft="true" />
                <TextView
                    android:id="@+id/wod_time"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="some text"
                    android:textColor="#ffffff"
                    android:textSize="14sp"
                    android:textStyle="bold"
                    android:layout_alignParentTop="true"
                    android:layout_centerHorizontal="true"/>
                <TextView
                    android:id="@+id/wod_name"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="some text"
                    android:textColor="#ffffff"
                    android:textSize="24sp"
                    android:textStyle="bold"
                    android:layout_alignParentBottom="true"
                    android:layout_alignParentLeft="true"
                    local:MvxBind="Text Name"/>
            </RelativeLayout>
        </FrameLayout>
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#4CD964"
            android:paddingLeft="8dp"
            android:paddingRight="8dp"
            android:paddingTop="4dp"
            android:paddingBottom="4dp">
        <TextView
                android:id="@+id/wod_type"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="some text"
                android:textAllCaps="true"
                android:textColor="#ffffff"
                android:textSize="16sp"
                android:textStyle="bold"
                android:layout_alignParentLeft="true"
                local:MvxBind="Text Type" />
            <ImageView
                android:id="@+id/wod_type_icon"
                android:layout_width="24dp"
                android:layout_height="24dp"
                android:layout_alignParentRight="true"
                android:src="@drawable/ic_person_white_24dp" />
        </RelativeLayout>
        <TextView
            android:id="@+id/wod_goal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingTop="8dp"
            android:paddingLeft="8dp"
            android:text="some text"
            android:textAllCaps="true"
            android:textColor="#000000"
            android:textSize="18sp"
            android:textStyle="bold"
            local:MvxBind="Text MetconType" />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="8dp"
            android:textColor="#000000"
            android:textSize="16sp"
            android:singleLine="false"
            android:text="some text" />
    </LinearLayout>
</android.support.v7.widget.CardView>

如您所见，我已经尝试尽可能设置固定的宽度和高度，以防止设备处理过多。

另外，我有一个额外的问题要问你： CardView 高程根本不起作用。即使在浏览整个网络以寻求解决方案之后。如果你发现发生了什么，你就是我的超级英雄！

编辑：（已解决） 我所有的问题都是因为我的应用没有启用 GPU 加速。

它会导致滚动延迟、海拔问题和 GPU 过度绘制故障。

【问题讨论】：

请出示你的 RecyclerView 的实现代码。你还应该让你的 xml 更干净一点，recyclerview 中的嵌套布局不是一件好事
尽量让你的 xmls 保持扁平，我建议使用标签来分隔你的布局。你也可以发布你的java代码吗？因为您的代码实现也可能会影响性能。
这个问题背后没有特定的java代码。此外，我注意到通过删除活动的背景并将 match_parent 值放入活动中的线性布局，性能稍微好一些。

标签： android performance xamarin.android android-recyclerview android-cardview

【解决方案1】：

可能是“过度绘制背景”的问题，请在“开发者选项”中启用"Show overdraw areas"并检查屏幕上的过度绘制量。

【讨论】：

由于某些原因，此功能在我的应用程序上不起作用..可能是因为 xamarin 使用 JVM 来呈现应用程序

【解决方案2】：

我所有的问题都是因为我的应用没有启用 GPU 加速。

它会导致滚动延迟、海拔问题和 GPU 过度绘制故障。

【讨论】：

【解决方案3】：

如果您使用 GLIDE 库添加宽度和高度并检查您的图像大小

  Glide.with(context)
            .load(url)
            .thumbnail(0.1f)
            .centerCrop()
            .listener(new RequestListener<String, GlideDrawable>() {
                @Override
                public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource) {
                    holder.progressBar.setVisibility(View.GONE);


                    return false;
                }

                @Override
                public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
                     holder.progressBar.setVisibility(View.GONE);


                    return false;
                }
            })

            .override(630, 370)

            .into(holder.image_path);

【讨论】：