Monday, 7 November 2016

Tutorial Android : Image Rounded Corner & Fetch Image From Url

Monday, 7 November 2016
Yepp, untuk yang kedua kalinya gue mau Save Code diblog ini dan sekalian share buat potongan code yang sangat dibutuhkan pada waktu yang tidak tepat, jadi begini tadi pagi gue lanjut bikin apps kan yaa, nah kebetulan dimockup ada request buat nampilin Image tapi diujung ujung'nya ada Rounded Corner, nah awalnya gue bikin tuh pake NetworkImageView + Volley  which is itu berhasil, tapi di NetworkImageView + Volley gue gak bisa bikin Rounded Corner karena gue gak tau gmna caranya supaya pada saat processing Loading Image, dan hasilnya bisa jadi Rounded Corner. Jadi gue coba ngakalin deh gimana caranya bisa dapetin Image dari URL dan bikin Image jadi Rounded Corner, dan akhirnya gue bikin pake ImageView , Oke gw tuntun dari :

1. Jangan lupa tambahin ini dulu di AndroidManifest.xml buat permission penggunaan Internet.

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

2. Nah lanjut buat file image_layout.xml dan langsung aja Copy & Paste code dibawah ini :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical" android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:paddingLeft="10dp"
    android:paddingRight="10dp">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:adjustViewBounds="true"/>
</RelativeLayout>

3. Nah yang ketiga nih bikin ActivityMain.java ini juga langsung di Copy & Paste Aja :

package com.bye.project;

/**
 * Created by webster on 11/7/16.
 */
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.os.StrictMode;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

import com.android.volley.VolleyError;
import com.android.volley.toolbox.ImageLoader;
import com.android.volley.toolbox.NetworkImageView;
import com.bye.project.config.CustomVolleyRequestQueue;
import com.bye.project.helper.CircularNetworkImageView;
import com.bye.project.helper.Configure;
import com.bye.project.helper.RoundedImageView;

import java.io.IOException;
import java.io.InputStream;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.URL;
import java.net.URLConnection;


public class ActivityMain extends Fragment {
    private ImageView mNetworkImageView;
    View view;

    @Nullable
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        view = inflater.inflate(R.layout.image_layout,null);
        mNetworkImageView = (ImageView) view.findViewById(R.id.networkImageView);

        final String url = "http://1.bp.blogspot.com/-E8TXiry45Cs/VcBgPAb1ukI/AAAAAAABS3g/o9vf7l6WVxU/s1600/Dan-Mumford-This-Is-The-End-Print-Right-Side-2015.jpg";

        if (android.os.Build.VERSION.SDK_INT > 9)
        {
            StrictMode.ThreadPolicy policy = new StrictMode.ThreadPolicy.Builder().permitAll().build();
            StrictMode.setThreadPolicy(policy);
        }

        try {
            Bitmap bitmap = BitmapFactory.decodeStream((InputStream)new URL(url).getContent());
            mNetworkImageView.setImageBitmap(Configure.getRoundedCornerBitmap(bitmap, 20));
        } catch (MalformedURLException e) {
            e.printStackTrace();
        } catch (IOException e) {
            e.printStackTrace();
        }
        return view;

    }

}

4. Nah buat yang ini bikin file Configure.java dan didalem file adalah isi dari function buat Rounded Corner , dimana function ini akan dipanggil di dalem class ActivityMain.java langsung sikat aja lah nih, dengan cara yang sama Copy & Paste :D

package com.bye.project.helper;

import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.RectF;
import android.util.Log;

import java.io.IOException;
import java.io.InputStream;
import java.net.HttpURLConnection;
import java.net.URL;

/**
 * Created by webster on 9/3/16.
 */
public class Configure {

    public static Bitmap getCircleBitmap(Bitmap bitmap) {
        final Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),bitmap.getHeight(), Bitmap.Config.ARGB_8888);
        final Canvas canvas = new Canvas(output);

        final int color = Color.RED;
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
        final RectF rectF = new RectF(rect);

        paint.setAntiAlias(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(color);
        canvas.drawOval(rectF, paint);

        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
        canvas.drawBitmap(bitmap, rect, rect, paint);

        bitmap.recycle();

        return output;
    }

    public static Bitmap getRoundedCornerBitmap(Bitmap bitmap,int roundPixelSize) {
        final Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
        final Canvas canvas = new Canvas(output);
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
        final RectF rectF = new RectF(rect);
        final float roundPx = roundPixelSize;
        paint.setAntiAlias(true);
        canvas.drawRoundRect(rectF,roundPx,roundPx, paint);
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
        canvas.drawBitmap(bitmap, rect, rect, paint);
        bitmap.recycle();
        return output;
    }

    public static Bitmap getBitmapFromURL(String src) {
        try {
            URL urlConnection = new URL(src.toString());
            HttpURLConnection connection = (HttpURLConnection) urlConnection.openConnection();
            connection.setDoInput(true);
            connection.connect();
            InputStream input = connection.getInputStream();
            Bitmap myBitmap = BitmapFactory.decodeStream(input);
            Log.e("Bitmap","returned");
            return myBitmap;
        } catch (IOException e) {
            e.printStackTrace();
            Log.e("Exception",e.getMessage());
            return null;
        }
    }

}

Kalo ada yang kurang jelas, ditanyakan aja langsung di komentar yaa, jangan sungkan buat ninggalin jejak klo emang butuh hehehhe..


No comments:

Post a Comment

Bye Webster | Kebanggaan dari keburukan diri sendiri adalah penyesalan yang belum saatnya ! © 2016