Lag in ScrollView with a lot of ImageButton

Question

I'm an Android beginner and I'm building a SoundBoard app for fun with a ScrollView and a lot (44 for now) ImageButton side by side in 2 columns.

Here is what it looks like :

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="1dp"
        android:orientation="horizontal"
        android:weightSum="1">

        <ImageButton
            android:id="@+id/myImageButton1"
            android:tag="myTag1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginRight="1dp"
            android:layout_weight=".5"
            android:adjustViewBounds="true"
            android:background="@null"
            android:clickable="true"
            android:foreground="?attr/selectableItemBackgroundBorderless"
            android:onClick="onSoundButtonClick"
            android:scaleType="fitXY"
            android:src="@drawable/myImage1" />

        <ImageButton
            android:id="@+id/myImageButton2"
            android:tag="myTag2"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight=".5"
            android:adjustViewBounds="true"
            android:background="@null"
            android:clickable="true"
            android:foreground="?attr/selectableItemBackgroundBorderless"
            android:onClick="onSoundButtonClick"
            android:scaleType="fitXY"
            android:src="@drawable/myImage2" />
    </LinearLayout>

   // More LinearLayout below for ImageButton side by side

</LinearLayout>

When scrolling down fast I experience lags. I tried building the app with a RecyclerView but it didn't fixed the problem (I may have misused it). Each .jpg weigh between 20Ko and 30Ko for a total of 1.24Mo for 44 images.

Do you have any clue on how to fix this ?

Thanks !

use Picasso its a Imageloader Lib it will load images when needed ,, plus its works on Background Thread check out this link : https://www.simplifiedcoding.net/picasso-android-tutorial-picasso-image-loader-library/ — Itzik Samara, Mar 22 '17 at 18:14
@ItzikSamara I tried Picasso and it works like a charm ! But i can't find a way to play sound onClick on an item... There is nothing relating to it on internet, do you have any idea on how to do it ? — Ebolag, Mar 23 '17 at 16:20

score 0 · Answer 1 · edited May 23 '17 at 12:10

0

The problem may not be in your layout. It's on your adapter. you have some good practices to apply by google and in alternative you can apply lazy load to your resources, you can find in this topic.

This should help you to solve your problem.

edited May 23 '17 at 12:10

Community

1
1

answered Mar 22 '17 at 18:22

PedroHawk

622
5
19

Lag in ScrollView with a lot of ImageButton

1 Answers1