Blog

  • Fresco Library Android

    Fresco is an amazing and powerful library for displaying images, webPs & animated GIFs in Android. Fresco supports Android 2.3(Gingerbread) and later versions.

     

    For Images Fresco can load it from network, local storage or local resources. To save data and CPU, it has three levels of cache; one in internal storage and two in memory.

    Animated GIFs and webPs can be challenging for apps where each frame is a large bitmap, and each animation is a series of frames. Fresco takes care of loading and disposing of frames and managing thier memory. 

     

    Trying to simultaneously load multiple GIFs using Fresco in the single window might cause performance issue.

    Below is the Demo android app making use of Fresco library to load animated GIFs and static image from the internet.

     

    FrescoDemoApp

     

    Instruction and code for the FrecoDemoApp:

    Step 1: Create a new Android project

    Step 2: Adding depencencies in the build.gradle file

    dependencies {
      // your app's other dependencies
      compile 'com.facebook.fresco:fresco:0.11.0'
    
    // If your app supports Android versions before Ice Cream Sandwich (API level 14)
      compile 'com.facebook.fresco:animated-base-support:0.11.0'
    
      // For animated GIF support
      compile 'com.facebook.fresco:animated-gif:0.11.0'
    }
    

    Step 3: Adding permission in AndroidManifest.xml

    <uses-permission android:name="android.permission.INTERNET"/>

    Step 4: Freso Initialization 

    public class MainActivity extends AppCompatActivity {
    	@Override
    	public void onCreate() {
    		super.onCreate();
    		Fresco.initialize(this);
    	}
    }
     

    Below is the App Code:

    Layout- activity_main.xml:

    <LinearLayout 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"
        tools:context="com.bsalponia.flashlight.frescodemoapp.MainActivity">

        <android.support.v7.widget.RecyclerView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/recyclerView">

        </android.support.v7.widget.RecyclerView>
    </LinearLayout>

    Layout- custom_view.xml:

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">
                    <com.facebook.drawee.view.SimpleDraweeView
                        android:id="@+id/draweeViewOne"
                        android:layout_width="350dp"
                        android:layout_height="200dp"
                        android:layout_marginTop="30dp"
                        android:layout_marginBottom="10dp"
                        android:layout_marginLeft="5dp"/>
                    
                    <com.facebook.drawee.view.SimpleDraweeView
                        android:id="@+id/draweeViewTwo"
                        android:layout_width="350dp"
                        android:layout_height="200dp"
                        android:layout_marginLeft="5dp"/>

            </LinearLayout>
    </LinearLayout>

    MainActivity.java:

    import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    import android.support.v7.widget.LinearLayoutManager;
    import android.support.v7.widget.RecyclerView;
    import com.facebook.drawee.backends.pipeline.Fresco;
    import java.util.ArrayList;
    import java.util.List;
    
    public class MainActivity extends AppCompatActivity {
    
        private RecyclerView recyclerView;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            //fresco initialization
            Fresco.initialize(this);
            setContentView(R.layout.activity_main);
    
            recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
            RecyclerView.LayoutManager layoutManager = new LinearLayoutManager(getApplicationContext());
            recyclerView.setLayoutManager(layoutManager);
    
            myArrayList();
    
        }
        public void myArrayList() {
    
            List mArrayListOne = new ArrayList<>();
            ListmArrayListTwo = new ArrayList<>();
    
    
            String uriStringOne = "http://25.media.tumblr.com/tumblr_mdaws9x5671r3tn9do1_500.gif";
            String uriStringTwo = "http://www.dvdtalk.com/reviews/images/reviews/196/full/1435728071_1.jpg";
    
            for (int i = 0; i < 13; i++) {
    
                mArrayListOne.add(i, uriStringOne);
                mArrayListTwo.add(i, uriStringTwo);
    
                RecyclerViewAdapter recyclerViewAdapter = new RecyclerViewAdapter(mArrayListOne, mArrayListTwo);
    
                recyclerView.setAdapter(recyclerViewAdapter);
    
            }
        }
    }
    

    RecyclerViewAdapter.java:

    public class RecyclerViewAdapter extends RecyclerView.Adapter {
    
    
        ListmArrayListOne;
        List mArrayListTwo;
    
        public RecyclerViewAdapter(List mArrayListOne, ListmArrayListTwo) {
    
            this.mArrayListOne= mArrayListOne;
            this.mArrayListTwo= mArrayListTwo;
    
        }
    
        public static class MyViewHolder extends RecyclerView.ViewHolder{
    
            public SimpleDraweeView simpleDraweeViewOne, simpleDraweeViewTwo;
    
            public MyViewHolder(View itemView) {
                super(itemView);
    
                simpleDraweeViewOne= (SimpleDraweeView) itemView.findViewById(R.id.draweeViewOne);
                simpleDraweeViewTwo= (SimpleDraweeView) itemView.findViewById(R.id.draweeViewTwo);
    
            }
        }
        public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    
            View view= LayoutInflater.from(parent.getContext()).inflate(R.layout.custom_view, parent, false);
    
    
            MyViewHolder myViewHolder= new MyViewHolder(view);
    
            return myViewHolder;
    
        }
    
        @Override
        public void onBindViewHolder(MyViewHolder holder, int position) {
    
            Uri uriOne= Uri.parse(mArrayListOne.get(position));
            Uri uriTwo= Uri.parse(mArrayListTwo.get(position));
    
            DraweeController controllerOne = Fresco.newDraweeControllerBuilder()
                    .setUri(uriOne)
                    .setAutoPlayAnimations(true)
            .build();
    
            holder.simpleDraweeViewOne.setController(controllerOne);
            holder.simpleDraweeViewTwo.setImageURI(uriTwo);
    
        }
        @Override
        public int getItemCount() {
            return mArrayListOne.size();
        }
    }
    

    Thanks

Tags: android , Fresco

View All PostsLeave a Comment
comments powered by Disqus

Mobile Applications

Video Content

Bigdata & NoSQL

SaaS Applications

Miscellaneous

Archives


Alexa Certified Site Stats for www.oodlestechnologies.com