Thursday, 23 June 2016

Android load image from remote resource or internet: using glide

Hi guys, today i'm gonna show you how to load an image from a remote resource (server) or a url

Project Structure:



1. Create a new android project, name it Glide

2. Import library glide:
// Glide library
compile group: 'com.github.bumptech.glide', name: 'glide', version: '3.7.0'

* Get the InternetConnection.java class here.

3. Go to the activity_main.xml and add an imageview and a button, make sure your code looks like this one:

<?xml version="1.0" encoding="utf-8"?>
<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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.androidmastermind.glide.MainActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:src="@mipmap/ic_launcher"
        android:minHeight="250dp" />

    <Button
        android:id="@+id/loadImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:text="Load Image From Internet" />

</RelativeLayout>

4. Instanciate the imageview and the button in the MainActivity.java,
- Before loading the image, will first check if there's internet connection, this is to prevent our app from force closing if there  is no internet while fetching the image.
 Make sure your MainActivity.java code looks like this one.

package com.androidmastermind.glide;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.Toast;

import com.bumptech.glide.Glide;
import com.bumptech.glide.load.engine.DiskCacheStrategy;

public class MainActivity extends AppCompatActivity {

    String url = "https://lh3.googleusercontent.com/-KGMeXERHAF0/VfaszovhC4I/
AAAAAAAACZU/ZQOWAuKtguo/w530-h795-p-rw-v1/15%2B-%2B1";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final ImageView imageView = (ImageView) findViewById(R.id.imageView);
        Button buttonLoadImage = (Button) findViewById(R.id.loadImage);

        assert buttonLoadImage != null;
        buttonLoadImage.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                if (new InternetConnection(getBaseContext()).isInternetAvailable()) {

                    assert imageView != null;
                    Glide.with(getBaseContext())
                            .load(url)
                            .asBitmap()
                            .thumbnail(0.5f)
                            .placeholder(R.mipmap.ic_launcher)
                            .error(android.R.drawable.stat_notify_error)
                            .diskCacheStrategy(DiskCacheStrategy.ALL)
                            .into(imageView);

                } else {
                    Toast.makeText(getBaseContext(), "Check your internet connectivity",
 Toast.LENGTH_LONG).show();
                }

            }
        });

    }
}

5. Add the internet and write external permissions in the AndroidManifest.xml file, 

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.androidmastermind.glide">

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

    <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>
    </application>

</manifest>

6. Deploy the app in genymotion.

i) Before loading the image


ii) After loading the image


That's all, pretty straight forward, and less coding.
* Glide loads the original photo quality and in a faster way



Related Posts:

  • Android GMaps Current Location Using Fused Location ApiThis is one of my best codes, to get user's current location using Googles Fused Location Api, coz it's accurate and it's faster in terms of acquiring location. For this tutorial, the codes should ran in any device, even abo… Read More
  • Android login: using volley, php, mysql, pdo Today you gonna learn how to create a login activity that uses volley for request. Click here If you want more information about volley library. To begin with, will first create a back-end using PHP and my SQL. I'm using w… Read More
  • Genymotion: Set a location in Running EmulatorHae there, this is probably one of the simplest things i get to do while running a project that requires location. By default, a running genymotion virtual device location is disabled and it's usually preset at latitude =65.9… Read More
  • Android Google Maps: Show current LocationToday im gonna show you how to create an android app that shows your current location on the map Project Structure: Procedure: 1. To start with, Create an new android project, Go to start 'start a new project' from the … Read More
  • Android Google Maps With Nearyby Places Show User Current Location and Load Nearby Places (within 5km radius) using Volley. Today im gonna show you how to show current location and load nearby places in android. Previously had some trouble with other google places… Read More

3 comments: