Android Picasso

Picasso adalah nama seorang desainer terkenal asal spanyol, saking terkenalnya beliau sampai-sampai dijadikan nama library.

Dengan menggunakan library picasso kita bisa me-load image dengan cepat, yang pertama kali kita lakukan adalah mendownload library picasso via gradle

compile 'com.squareup.picasso:picasso:2.5.2'

Kita akan memanggil gambar ini

sasuke

Sebelumnya kita buat layout terlebih dahulu

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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.viralandroid.picassoimageloaderlibrary.MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="16dp"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="130dp"
            android:background="#fff"
            android:elevation="4dp"
            android:orientation="horizontal"
            android:padding="5dp">

            <ImageView
                android:id="@+id/image1"
                android:layout_width="150dp"
                android:layout_height="120dp"
                android:scaleType="centerCrop"
                android:src="@drawable/header" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:orientation="vertical">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:lineSpacingExtra="-5dp"
                    android:text="Android Picasso Image Loader"
                    android:textSize="20sp"
                    android:textStyle="bold" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Load images in android using picasso image loader library. Best android image loader library"
                    android:textSize="14dp" />
            </LinearLayout>
        </LinearLayout>


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="130dp"
            android:layout_marginTop="16dp"
            android:background="#fff"
            android:elevation="4dp"
            android:orientation="horizontal"
            android:padding="5dp">

            <ImageView
                android:id="@+id/image2"
                android:layout_width="150dp"
                android:layout_height="120dp"
                android:scaleType="centerCrop"
                android:src="@drawable/header" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:orientation="vertical">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:lineSpacingExtra="-5dp"
                    android:text="Android Picasso Image Loader"
                    android:textSize="20sp"
                    android:textStyle="bold" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Load images in android using picasso image loader library. Best android image loader library"
                    android:textSize="14dp" />
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="130dp"
            android:layout_marginTop="16dp"
            android:background="#fff"
            android:elevation="4dp"
            android:orientation="horizontal"
            android:padding="5dp">

            <ImageView
                android:id="@+id/image3"
                android:layout_width="150dp"
                android:layout_height="120dp"
                android:scaleType="centerCrop"
                android:src="@drawable/header" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:orientation="vertical">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:lineSpacingExtra="-5dp"
                    android:text="Android Picasso Image Loader"
                    android:textSize="20sp"
                    android:textStyle="bold" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Load images in android using picasso image loader library. Best android image loader library"
                    android:textSize="14dp" />
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="130dp"
            android:layout_marginTop="16dp"
            android:background="#fff"
            android:elevation="4dp"
            android:orientation="horizontal"
            android:padding="5dp">

            <ImageView
                android:id="@+id/image4"
                android:layout_width="150dp"
                android:layout_height="120dp"
                android:scaleType="centerCrop"
                android:src="@drawable/header" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:orientation="vertical">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:lineSpacingExtra="-5dp"
                    android:text="Android Picasso Image Loader"
                    android:textSize="20sp"
                    android:textStyle="bold" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Load images in android using picasso image loader library. Best android image loader library"
                    android:textSize="14dp" />
            </LinearLayout>
        </LinearLayout>
    </LinearLayout>
</ScrollView>

Kemudian kita panggil gambar tersebut

String imageURL4 = "http://i.imgur.com/DvpvklR.png";
Picasso.with(this).load(imageURL4).resize(250, 200).into(image1);
Picasso.with(this).load(imageURL4).resize(250, 200).into(image2);
Picasso.with(this).load(imageURL4).resize(250, 200).into(image3);
Picasso.with(this).load(imageURL4).resize(250, 200).into(image4);

Dan jika berhasil maka tampilannya adalah sebagai berikut

screenshot_2016-09-11-04-32-26_id-co-passionit-picassotutorial

Kodingan lengkapnya ada disini bro, selamat menikmati.

Advertisements

1 Comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s