WebP is a modern image format that provides superior lossless and lossy compression for images on the web. Details refer Google Developers - WebP.
WebP is supported starting from Android 4.0+ (reference: Android Developers - Supported Media Formats). This example modify from the post "Async load image from internet to ListView" to load WebP from internet and display in ListView. Once item clicked, use "Simplest way to open browser using CustomTabsIntent.Builder".
To use CustomTabsIntent.Builder in our app, To use CustomTabsIntent.Builder, edit app/build.gradle to add dependencies of compile 'com.android.support:customtabs:23.0.0'.
The WebP images load from the page Google Developers - WebP Image Galleries.
MainActivity.java
package com.blogspot.android_er.androidimage;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.net.Uri;
import android.os.AsyncTask;
import android.os.Bundle;
import android.support.customtabs.CustomTabsIntent;
import android.support.v7.app.AppCompatActivity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast;
import java.io.IOException;
import java.io.InputStream;
import java.lang.ref.WeakReference;
import java.net.HttpURLConnection;
import java.net.URL;
import java.net.URLConnection;
import java.util.ArrayList;
import java.util.Arrays;
public class MainActivity extends AppCompatActivity {
final static String src[] = {
"https://www.gstatic.com/webp/gallery3/1_webp_ll.webp",
"https://www.gstatic.com/webp/gallery3/1_webp_a.webp",
"https://www.gstatic.com/webp/gallery3/2_webp_ll.webp",
"https://www.gstatic.com/webp/gallery3/2_webp_a.webp",
"https://www.gstatic.com/webp/gallery3/3_webp_ll.webp",
"https://www.gstatic.com/webp/gallery3/3_webp_a.webp",
"https://www.gstatic.com/webp/gallery3/4_webp_ll.webp",
"https://www.gstatic.com/webp/gallery3/4_webp_a.webp",
"https://www.gstatic.com/webp/gallery3/5_webp_ll.webp",
"https://www.gstatic.com/webp/gallery3/5_webp_a.webp" };
ListView imageList;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageList = (ListView) findViewById(R.id.imagelist);
ArrayList<String> srcList = new ArrayList<String>(Arrays.asList(src));
imageList.setAdapter(new CustomListAdapter(this, srcList));
imageList.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
String imageSrc = src[position];
Toast.makeText(MainActivity.this,
imageSrc,
Toast.LENGTH_LONG).show();
Uri imageUri = Uri.parse(imageSrc);
new CustomTabsIntent.Builder()
.build()
.launchUrl(MainActivity.this, imageUri);
}
});
}
// ----------------------------------------------------
public class CustomListAdapter extends BaseAdapter {
private ArrayList<String> listData;
private LayoutInflater layoutInflater;
public CustomListAdapter(Context context, ArrayList<String> listData) {
this.listData = listData;
layoutInflater = LayoutInflater.from(context);
}
@Override
public int getCount() {
return listData.size();
}
@Override
public Object getItem(int position) {
return listData.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder;
if (convertView == null) {
convertView = layoutInflater.inflate(R.layout.row, null);
holder = new ViewHolder();
holder.icon = (ImageView)convertView.findViewById(R.id.icon);
holder.text = (TextView)convertView.findViewById(R.id.text);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
holder.text.setText(
String.valueOf(position) + "\n" + src[position]);
if (holder.icon != null) {
new BitmapWorkerTask(holder.icon).execute(listData.get(position));
}
return convertView;
}
class ViewHolder {
ImageView icon;
TextView text;
}
}
// ----------------------------------------------------
// Load bitmap in AsyncTask
// ref:
// http://developer.android.com/training/displaying-bitmaps/process-bitmap.html
class BitmapWorkerTask extends AsyncTask<String, Void, Bitmap> {
private final WeakReference<ImageView> imageViewReference;
private String imageUrl;
public BitmapWorkerTask(ImageView imageView) {
// Use a WeakReference to ensure the ImageView can be garbage
// collected
imageViewReference = new WeakReference<ImageView>(imageView);
}
// Decode image in background.
@Override
protected Bitmap doInBackground(String... params) {
imageUrl = params[0];
return LoadImage(imageUrl);
}
// Once complete, see if ImageView is still around and set bitmap.
@Override
protected void onPostExecute(Bitmap bitmap) {
if (imageViewReference != null && bitmap != null) {
final ImageView imageView = imageViewReference.get();
if (imageView != null) {
imageView.setImageBitmap(bitmap);
}
}
}
private Bitmap LoadImage(String URL) {
Bitmap bitmap = null;
InputStream in = null;
try {
in = OpenHttpConnection(URL);
bitmap = BitmapFactory.decodeStream(in);
in.close();
} catch (IOException e1) {
}
return bitmap;
}
private InputStream OpenHttpConnection(String strURL)
throws IOException {
InputStream inputStream = null;
URL url = new URL(strURL);
URLConnection conn = url.openConnection();
try {
HttpURLConnection httpConn = (HttpURLConnection) conn;
httpConn.setRequestMethod("GET");
httpConn.connect();
if (httpConn.getResponseCode() == HttpURLConnection.HTTP_OK) {
inputStream = httpConn.getInputStream();
}
} catch (Exception ex) {
}
return inputStream;
}
}
}
layout/row.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
layout/activity_main.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:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp"
android:orientation="vertical"
tools:context="com.blogspot.android_er.androidimage.MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:autoLink="web"
android:text="http://android-er.blogspot.com/"
android:textStyle="bold" />
<ListView
android:id="@+id/imagelist"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
uses-permission of "android.permission.INTERNET" is needed in AndroidManifest.xml
Download the files
.
