GridView Bildskalierung verlangsamt die App auf Fragmentwechsel

Question

Ich habe eine App, die drei Freagments hat. Einer der Fragments hat eine GridView zum Anzeigen von Bildern.

Ich habe this Tutorial hier auf YouTube & gefolgt getan alles dort erwähnt entsprechend.

Folgenden sehen Sie die XML enthält die GridView:

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:layout_marginLeft="5dp" 
    android:layout_marginRight="5dp" 
    android:padding="10dp" 
    android:layout_marginTop="25dp" 
    android:orientation="vertical" 
    android:scrollbars="vertical" 
    android:background="@drawable/new_card_form" 
    tools:context=".activities.fragments.NetBankingFragment"> 

    <GridView 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:id="@+id/gridView" 
     android:numColumns="2" 
     android:columnWidth="60dp" 
     android:verticalSpacing="10dp" 
     android:horizontalSpacing="10dp" 
     android:gravity="center"> 
    </GridView> 


</RelativeLayout> 

Unten ist die Java-Datei NetBankingFragment.java, dass die Bilder alle erzeugt:

import android.content.Context; 
import android.graphics.Color; 
import android.graphics.ColorMatrix; 
import android.graphics.ColorMatrixColorFilter; 
import android.graphics.PorterDuff; 
import android.graphics.drawable.Drawable; 
import android.net.Uri; 
import android.os.Bundle; 
import android.provider.Telephony; 
import android.support.v4.app.Fragment; 
import android.support.v4.content.res.ResourcesCompat; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.BaseAdapter; 
import android.widget.Button; 
import android.widget.GridView; 
import android.widget.ImageButton; 
import android.widget.ImageView; 
import android.widget.Spinner; 

import org.json.JSONArray; 


/** 
* A simple {@link Fragment} subclass. 
* Activities that contain this fragment must implement the 
* {@link NetBankingFragment.OnFragmentInteractionListener} interface 
* to handle interaction events. 
* Use the {@link NetBankingFragment#newInstance} factory method to 
* create an instance of this fragment. 
*/ 
public class NetBankingFragment extends Fragment implements FormFragmentBehaviour { 
    private int index; 

    private View FragView; 
    private GridView gridView; 
    private Integer[] photos = {R.drawable.sbilogo, R.drawable.axisbank, R.drawable.citilogo, R.drawable.hdfclogo}; 



    private OnFragmentInteractionListener mListener; 

    /** 
    * Factory for our Fragment. 
    * */ 
    public static NetBankingFragment newInstance(int index) { 
     Bundle fragmentArgs = new Bundle(); 
     fragmentArgs.putInt("index", index); 

     NetBankingFragment fragment = new NetBankingFragment(); 
     fragment.setArguments(fragmentArgs); 

     return fragment; 
    } 

    @Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 

     this.index = getArguments().getInt("index"); 
    } 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
          Bundle savedInstanceState) { 
     // Inflate the layout for this fragment 
     FragView = inflater.inflate(R.layout.fragment_net_banking, container, false); 
     gridView = (GridView) FragView.findViewById(R.id.gridView); 
     gridView.setAdapter(new ImageAdapter(FragView.getContext())); 

     return FragView; 




    } 



    public void setgray(ImageView imageView) 
    { 
     final ColorMatrix gray = new ColorMatrix(); 
     gray.setSaturation(0); 

     final ColorMatrixColorFilter filter = new ColorMatrixColorFilter(gray); 
     imageView.setColorFilter(filter); 
    } 





    @Override 
    public void onActivityCreated(Bundle savedInstanceState) { 
     super.onActivityCreated(savedInstanceState); 


    } 

    @Override 
    public void onDetach() { 
     super.onDetach(); 
     mListener = null; 
    } 

    @Override 
    public boolean validate() { 
     return false; 
    } 

    @Override 
    public void clearErrors() { 

    } 

    /** 
    * This will show the various banks that are available after fetching from the EC backend.s 
    * */ 
    public void showBanks(JSONArray banks) { 

    } 

    /** 
    * This interface must be implemented by activities that contain this 
    * fragment to allow an interaction in this fragment to be communicated 
    * to the activity and potentially other fragments contained in that 
    * activity. 
    * <p/> 
    * See the Android Training lesson <a href= 
    * "http://developer.android.com/training/basics/fragments/communicating.html" 
    * >Communicating with Other Fragments</a> for more information. 
    */ 
    public interface OnFragmentInteractionListener { 
     // TODO: Update argument type and name 
     void onFragmentInteraction(Uri uri); 
    } 

    //To Generate the buttons for Banks 
    public void grayout() 
    { 
     //setgray(sbilogo); 
     //setgray(axislogo); 
     //setgray(citilogo); 
     //setgray(hdfclogo); 
    } 


    public void setParticularGray(ImageView imgView) 
    { 
     grayout(); 

     final ColorMatrix color = new ColorMatrix(); 
     color.setSaturation(1); 

     final ColorMatrixColorFilter filter = new ColorMatrixColorFilter(color); 
     imgView.setColorFilter(filter); 
    } 

    public class ImageAdapter extends BaseAdapter implements Runnable{ 

     private Context mContext; 

     public ImageAdapter(Context context) 
     { 
      mContext = context; 
     } 


     @Override 
     public int getCount() { 
      return photos.length; 
     } 

     @Override 
     public Object getItem(int position) { 
      return null; 
     } 

     @Override 
     public long getItemId(int position) { 
      return 0; 
     } 

     @Override 
     public View getView(final int position, View convertView, ViewGroup parent) { 

      ImageView imgView = new ImageView(mContext); 
      imgView.setLayoutParams(new GridView.LayoutParams(100, 100)); 
      imgView.setScaleType(ImageView.ScaleType.CENTER_CROP); 
      imgView.setPadding(5,5,5,5); 
      imgView.setImageResource(photos[position]); 

      return imgView; 


     } 

     @Override 
     public void run() { 

     } 
    } 
} 

Problem liegt in nur zwei Zeilen des Codes

imgView.setLayoutParams(new GridView.LayoutParams(100, 100)); 
imgView.setScaleType(ImageView.ScaleType.CENTER_CROP); 

Wenn ich sie nicht verwenden, erhalte ich eine fast glatte Fragment

Aber wie dieses Scrollen, wenn ich sie verwenden & fit in meinem Bildschirm zu skalieren, bekomme ich diese

Sie können sehen, wie viel es hinkt. Aber im Video-Tutorial ist es nie zurückgeblieben. Liegt es daran, dass ich verwende? Gibt es einen Workaround dafür?

Answer 1

Laut Dokumenten verwendet ListView die Ansicht, um die Leistung zu verbessern. Was Sie getan haben, ist, dass für jedes Objekt ein Bild erstellt wird, anstatt es erneut zu verwenden.

Eine bessere Lösung ist die Verwendung eines ViewHolder-Musters. Beispiel: Optimizing your ListView with ViewHolder pattern

Halten Sie auch Ihre Bilddateigrößen niedrig. Und überlegen Sie sich, eine Bildladebibliothek für die beste Leistung zu verwenden.