Sử dụng thư viện load ảnh Picasso trong lập trình Android

Picasso là thư viện load ảnh dùng trong lập trình Android, đây là thư viện khá dễ sử dụng. Trong bài này mình sẽ hướng dẫn các bạn sử dụng thư viện này.

1. Thêm thư viện Picasso vào project
Trong file build.gradle (Module: app) ở dependencies ta thêm vào dòng sau:

dependencies {
    
    compile 'com.squareup.picasso:picasso:2.5.2'
    
}

Sau đó build lại ứng dụng để thư viện được add vào project.

2. Load ảnh từ URL
Mình bắt đầu tạo 1 project mới có tên là DemoPicasso, trong file activity_main.xml mình tạo 1 ImageView và đặt id cho nó như sau:

<?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.example.trung.demopicasso.MainActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_centerInParent="true"
        android:layout_width="300dp"
        android:layout_height="300dp" />
</RelativeLayout>

Xin quyền truy cập Internet cho ứng dụng trong file AndroidManifest.xml:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.trung.demopicasso">
<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>
    </application>

</manifest>

File MainActivity.java có nội dung như sau:

package com.example.trung.demopicasso;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;

import com.squareup.picasso.Picasso;

public class MainActivity extends AppCompatActivity {
    ImageView imageView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // Ánh xạ ImageView từ layout sang
        imageView = (ImageView) findViewById(R.id.imageView);

        //Gọi hàm load ảnh từ URL
        loadImageFromURL();
    }

    private void loadImageFromURL(){
        //Khai báo URL của ảnh muốn load ra ImageView
        String URL = "http://2.bp.blogspot.com/-sHfwl600qEg" +
                "/VlwOgYg62BI/AAAAAAAAQwY/JhcY4pkJjgk/" +
                "s1600/Zoro-roronoa-zoro-21911836-283-283.jpg";

        //Load ảnh từ URL ra ImageView
        Picasso.with(this).load(URL).into(imageView);
    }
}

Trong hàm OnCreate mình ánh xạ ImageView từ layout sang và gọi hàm loadImageFromURL để load ảnh ra ImageView.

Trong hàm loadImageFromURL mình khai báo 1 String URL để chứa đường dẫn của hình ảnh mình muốn load ra ImageView. Sau đó gọi câu lệnh của Picasso để load hình ảnh ra ImageView. Cú pháp chung của câu lệnh như sau:

Picasso.with(context).load(link-anh).into(image-View);

Trong hàm with() bạn truyền vào Context, nếu đứng ở Activity thì có thể truyền vào từ khóa this, nếu đứng ở Fragment thì bạn phải truyền vào một biến Context hay truyền vào hàm getContext(). Ở hàm load(), truyền vào đường dẫn của ảnh, hàm into() truyền vào cái ImageView mà bạn muốn load ảnh.

Bạn chạy project lên, dưới đây là kết quả của mình:

3. Load ảnh từ drawable
Trong thư mục drawable các bạn copy 1 ảnh bất kỳ vào đó

 Sau đó thay đổi nội dung file MainActivity.java như dưới đây:

package com.example.trung.demopicasso;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;

import com.squareup.picasso.Picasso;

public class MainActivity extends AppCompatActivity {
    ImageView imageView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // Ánh xạ ImageView từ layout sang
        imageView = (ImageView) findViewById(R.id.imageView);

        //Gọi hàm load ảnh từ URL
        //loadImageFromURL();
        
        //Gọi hàm load ảnh từ Drawable
        loadImageFromDrawable();
    }

    private void loadImageFromURL(){
        //Khai báo URL của ảnh muốn load ra ImageView
        String URL = "http://2.bp.blogspot.com/-sHfwl600qEg" +
                "/VlwOgYg62BI/AAAAAAAAQwY/JhcY4pkJjgk/" +
                "s1600/Zoro-roronoa-zoro-21911836-283-283.jpg";

        //Load ảnh từ URL ra ImageView
        Picasso.with(this).load(URL).into(imageView);
       
    }
    
    private void loadImageFromDrawable(){
        //Load ảnh từ drawable
        Picasso.with(this).load(R.drawable.avata_bay_mau).into(imageView);
    }
}

Trong file MainActivity mình có chỉnh sửa như sau:
- Mình viết thêm hàm loadImageFromDrawable(), trong hàm loadImageFromDrawable() mình viết lại câu lệnh load ảnh cho ImageView. Trong hàm load(), thay vì truyền vào URL như hàm loadImageFromURL() thì mình truyền vào ảnh trong drawable.
- Ở hàm onCreate() mình gọi hàm loadImageFromDrawable() thay cho hàm loadImageFromURL().
Các bạn chạy project để xem kết quả:

Ngoài ra Picasso còn hỗ trợ load ảnh từ file,asset,... cú pháp như sau:

Picasso.with(context).load("file:///android_asset/DvpvklR.png").into(imageView2);
Picasso.with(context).load(new File(...)).into(imageView3);

Trong nội dung bài viết mình chỉ demo phần load ảnh từ URL, load ảnh từ drawable, còn phần load từ file, asset thì các bạn có thể tự tìm hiểu thêm. Dưới đây là project demo của mình, các bạn có thể download về để tham khảo.

• DOWNLOAD

Có vấn đề gì các bạn có thể comment ở bên dưới, mình sẽ phản hồi nhanh nhất có thể.