Monday, November 28, 2016

Image Loader

Universal Image Loader aims to provide a powerful, flexible and highly customizable instrument for image loading, caching and displaying. It provides a lot of configuration options and good control over the image loading and caching process.


 Steps to use universal image loader in your project.
  1. Crate a project in android studio.
  2. Open build.gradle(app).
  3. Add a dependancy (<project>/<app-module>/build.gradle)

    compile 'com.nostra13.universalimageloader:universal-image-loader:1.9.4'

    apply plugin: 'com.android.application'
    android {
        compileSdkVersion 25
        buildToolsVersion "25.0.0"
        defaultConfig {
            applicationId "com.pankaj.universal.imageloader"
            minSdkVersion 15
            targetSdkVersion 25
            versionCode 1
            versionName "1.0"
            testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
        }
        buildTypes {
            release {
                minifyEnabled false
                proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
            }
        }
    }
    dependencies {
        compile fileTree(dir: 'libs', include: ['*.jar'])
        androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', {
            exclude group: 'com.android.support', module: 'support-annotations'
        })
        compile 'com.android.support:appcompat-v7:25.0.0'
        compile 'com.android.support:design:25.0.0'
        testCompile 'junit:junit:4.12'
        compile 'com.nostra13.universalimageloader:universal-image-loader:1.9.4'
    }
    
    
    
    


    Click on Sync Now




     
  4.  Open manifest.xml and add a permission to it-

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

    <?xml version="1.0" encoding="utf-8"?>
    <manifest xmlns:android="http://schemas.android.com/apk/res/android"
        package="com.pankaj.universal.imageloader">
      
        <uses-permission android:name="android.permission.INTERNET" />
    
        <application
            android:allowBackup="true"
            android:icon="@mipmap/ic_launcher"
            android:label="@string/app_name"
            android:supportsRtl="true"
            android:theme="@style/AppTheme">
          
       <activity android:name=".MainActivity">
                <intent-filter>
                    <action android:name="android.intent.action.MAIN" />
                    <category android:name="android.intent.category.LAUNCHER" />
                </intent-filter>
            </activity>
    
            <activity
                android:name=".BaseActivity"
                android:label="@string/title_activity_base"
                android:theme="@style/AppTheme.NoActionBar"></activity>
        
     </application>
    
    </manifest>
    
    
    
    
     
  5. Open your base activity and initialize the loader configuration-
     
    package com.pankaj.universal.imageloader;
    
    import android.content.Context;
    import android.graphics.Bitmap;
    import android.os.Bundle;
    import android.support.v7.app.AppCompatActivity;
    import com.nostra13.universalimageloader.cache.disc.naming.Md5FileNameGenerator;
    import com.nostra13.universalimageloader.core.DisplayImageOptions;
    import com.nostra13.universalimageloader.core.ImageLoader;
    import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;
    import com.nostra13.universalimageloader.core.assist.QueueProcessingType;
    
    public class BaseActivity extends AppCompatActivity {
    
        public static DisplayImageOptions options;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            initializeAnimationForLoader(this);
        }
        
    private void initializeAnimationForLoader(Context context) {
            
            // This configuration tuning is custom. You can tune every option, you may tune some of them,
            // or you can create default configuration by
            //  ImageLoaderConfiguration.createDefault(this);
            // method.
          
            ImageLoaderConfiguration.Builder config = new ImageLoaderConfiguration.Builder(context);
            config.threadPriority(Thread.NORM_PRIORITY - 2);
            config.denyCacheImageMultipleSizesInMemory();
            config.diskCacheFileNameGenerator(new Md5FileNameGenerator());
            config.diskCacheSize(50 * 1024 * 1024); // 50 MiB
            config.tasksProcessingOrder(QueueProcessingType.LIFO);
            config.writeDebugLogs(); // Remove for release app
            // Initialize ImageLoader with configuration.
           
            ImageLoader.getInstance().init(config.build());
            options = new DisplayImageOptions.Builder()
                    .showImageForEmptyUri(R.drawable.logo)
                    .showImageOnFail(R.drawable.error)
                    .showImageOnLoading(R.drawable.wait)
                    .cacheInMemory(true)
                    .cacheOnDisk(true)
                    .considerExifParams(true)
                    .bitmapConfig(Bitmap.Config.RGB_565)
                    .build();
        }
    }
    
    
    
     

     
     
  6.  Update your main_activity.xml
    <?xml version="1.0" encoding="utf-8"?>
    
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/activity_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center_horizontal"
        android:orientation="vertical"
        tools:context="com.pankaj.universal.imageloader.MainActivity">
        
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:text="Image with blank url" />
       
        <ImageView
            android:id="@+id/ivImageView1"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_centerInParent="true"
            android:src="@mipmap/ic_launcher" />
       
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:text="Image with wrong url" />
        
        <ImageView
            android:id="@+id/ivImageView2"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_centerInParent="true"
            android:src="@mipmap/ic_launcher" />
       
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:text="Image with correct url" />
        
        <ImageView
            android:id="@+id/ivImageView3"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_centerInParent="true"
            android:src="@mipmap/ic_launcher" />
    </LinearLayout>
    
    
      
  7.  Update your MainActivity.JAVA

    package com.pankaj.universal.imageloader;
    import android.os.Bundle;
    import android.widget.ImageView;
    import com.nostra13.universalimageloader.core.ImageLoader;
    public class MainActivity extends BaseActivity {
        ImageView ivImageView1, ivImageView2, ivImageView3;
        ImageLoader imageLoader;
        private String imageUrl1 = "";
        private String imageUrl2 = "https://lh3.googleusercontent.com/-3DsjuYjPbRg/AAAAAAAAAAI/AAAAAAAAAoM/.jpg";
        private String imageUrl3 = "http://lh3.googleusercontent.com/-3DsjuYjPbRg/AAAAAAAAAAI/AAAAAAAAAoM/iNoq9r6Q7CA/s280-c/photo.jpg";
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            /*_____________________initializations_____________________________*/
            imageLoader = ImageLoader.getInstance();
            ivImageView1 = (ImageView) findViewById(R.id.ivImageView1);
            ivImageView2 = (ImageView) findViewById(R.id.ivImageView2);
            ivImageView3 = (ImageView) findViewById(R.id.ivImageView3);
            /*________________________Load Images___________________________*/
            imageLoader.displayImage(imageUrl1, ivImageView1,options);
            imageLoader.displayImage(imageUrl2, ivImageView2,options);
            imageLoader.displayImage(imageUrl3, ivImageView3,options);
        }
    }
    
    
    
  8. Supported URIs are-
    "http://site.com/image.png" // from Web
    "file:///mnt/sdcard/image.png" // from SD card
    "file:///mnt/sdcard/video.mp4" // from SD card (video thumbnail)
    "content://media/external/images/media/13" // from content provider
    "content://media/external/video/media/13" // from content provider (video thumbnail)
    "assets://image.png" // from assets
    "drawable://" + R.drawable.img // from drawables (non-9patch images)
  9.   Now all the setup for image loader is complete, Please run the application.

  10.  Now you will see first screen-



  11. After couples of seconds  this screen will update and will be showing like-






  12.  Good bye, Thanks to read this blog.




No comments:

Post a Comment