Android: Picasso - Web 画像をロードするためのライブラリ

目次

1. ピカソの紹介とその利点

2.ピカソの使い方

1. 依存関係を追加します。

2. ピカソの一般的な手法:

1. 画像をロードします。

 2.画像​​表示:

 3.画像処理:

4. 画像のプレースホルダーとエラー処理:

5. キャッシュ制御: 

6. キャッシュをクリアします。 

Picasso ライブラリの一般的なメソッドの呼び出し例:

1. 画像をロードして ImageView に表示します。

 2.画像​​処理:

3. プレースホルダーとエラー画像を設定します。 

4. キャッシュ制御: 

 5. カスタム画像コンバーター:

 3. ピカソの使用例

主な活動 : 

アクティビティメイン: 

 操作結果:

1. ピカソの紹介とその利点

        Picasso は、Android 用の強力で使いやすい画像の読み込みおよび表示ライブラリです。Square によって開発され、開発者が画像をより簡単に処理および表示できるようにするための多くの機能とオプションを提供します。

Picasso ライブラリの主な機能と利点の一部を次に示します。

1. 使いやすさ: Picasso はシンプルで直感的な API を提供し、画像の読み込みと表示を非常に簡単にします。ネットワークまたはローカルの画像をロードして表示するには、数行のコードしか必要としません。

2. 画像のダウンロードとキャッシュを自動的に管理: Picasso は画像のダウンロードとキャッシュを自動的に処理するため、手動で管理する必要がありません。必要に応じて画像を自動的にロードしてキャッシュし、次のリクエストでキャッシュから画像を取得することで、パフォーマンスを向上させ、データ使用量を節約します。

3. 強力な画像処理機能: Picasso は、さまざまな表示ニーズを満たすために、トリミング、回転、拡大縮小などのさまざまな一般的な画像処理操作をサポートしています。画像サイズは ImageView のサイズに応じて自動的に調整でき、カスタマイズされた画像変換操作のための柔軟なインターフェイスが提供されます。

4. エラー処理とプレースホルダー: Picasso では、読み込み中にエラー処理とプレースホルダー画像を設定できます。画像の読み込みに失敗した場合は、エラー画像を表示するか、代わりにプレースホルダー画像を使用するように指定して、ユーザー エクスペリエンスを向上させることができます。

5. リクエストの優先度とタグ付け: Picasso では、各画像リクエストの優先度を設定でき、リクエストのキャンセルと一時停止をサポートします。タグを使用してさまざまな画像リクエストを管理および識別し、その後の操作や処理を容易にすることができます。

6. メモリとディスクのキャッシュ: Picasso は、読み込まれた画像をメモリとディスクに自動的にキャッシュして、パフォーマンスを向上させ、ネットワーク データの消費を削減します。LRU (最も最近使用されていない) アルゴリズムを使用してメモリ キャッシュとディスク キャッシュを管理し、イメージの繰り返しダウンロードを回避します。

7. デバッグとログ: Picasso は、開発者が開発プロセス中に問題を見つけて解決できるようにするためのデバッグ機能と詳細なログを提供します。デバッグ フラグをオンにしてイメージのロード ソースを表示したり、詳細なログ情報を出力して各イメージ リクエストのステータスとイベントを表示したりできます。

2.ピカソの使い方

1. 依存関係を追加します。

implementation 'com.squareup.picasso:picasso:2.71828'

2. ピカソの一般的な手法:

1. 画像をロードします。

  • load(String path): 指定されたパス (ローカル ファイル パスまたはネットワーク URL) から画像を読み込みます。
  • load(File file):ファイルから画像を読み込みます。
  • load(Uri uri): Uri から画像を読み込みます。
  • load(int resourceId): リソースIDから画像を読み込みます。

 2.画像​​表示:

  • into(ImageView imageView): 指定された ImageView に画像を表示します。
  • into(Target target): 画像をカスタム Target オブジェクトに表示します。これは、画像に対するさらなる操作に使用できます。
  • into(BitmapTarget target): 画像をカスタム BitmapTarget オブジェクトに表示すると、Bitmap オブジェクトを取得してさらに処理できます。

 3.画像処理:

  • resize(int width, int height):画像サイズを調整します。
  • centerCrop(): ImageView の寸法に合わせて画像を中央でトリミングします。
  • fit(): 画像が ImageView の寸法に完全に収まるように、画像を比例的に拡大縮小します。
  • rotate(float degrees):画像を指定した角度だけ回転します。
  • transform(Transformation transformation):カスタム画像コンバーターを適用します。

4. 画像のプレースホルダーとエラー処理:

  • placeholder(int resourceId):画像がロードされる前に表示されるプレースホルダー。
  • error(int resourceId): 画像の読み込みに失敗すると、エラー プレースホルダーが表示されます。

5. キャッシュ制御: 

  • memoryPolicy(MemoryPolicy memoryPolicy):メモリキャッシュポリシーを設定します。
  • networkPolicy(NetworkPolicy networkPolicy):ネットワークキャッシュポリシーを設定します。

6. キャッシュをクリアします。 

  • invalidate(String path): 指定されたパスの画像キャッシュを無効にします。
  • clearMemory(): メモリキャッシュをクリアします。
  • clearDiskCache(): ディスクキャッシュをクリアします。

Picasso ライブラリの一般的なメソッドの呼び出し例:

1. 画像をロードして ImageView に表示します。

ImageView imageView = findViewById(R.id.imageView);
// 使用Picasso加载网络图片
String imageUrl = "https://img-home.csdnimg.cn/images/20201124032511.png";        

Picasso.get().load(imageUrl).into(imageView);

 2.画像​​処理:

  • 画像のサイズを変更します。
Picasso.get().load(imageUrl)
            .resize(200, 200)
            .into(imageView);
  • 画像の中央を切り抜きます。
Picasso.get().load(imageUrl)
            .centerCrop()
            .into(imageView);
  • 画像を回転します。
Picasso.get().load(imageUrl)
            .rotate(90)
            .into(imageView);

3. プレースホルダーとエラー画像を設定します。 

Picasso.get().load(imageUrl)
            .placeholder(R.drawable.placeholder_image)
            .error(R.drawable.error_image)
            .into(imageView);

4. キャッシュ制御: 

  • メモリキャッシュを無効にします。
Picasso.get().load(imageUrl)
            .memoryPolicy(MemoryPolicy.NO_CACHE)
            .into(imageView);
  • ディスクキャッシュをクリアします。
Picasso.get().clearDiskCache();

 5. カスタム画像コンバーター:

Transformation transformation = new Transformation() {
    @Override
    public Bitmap transform(Bitmap source) {
        // 在此处对图像进行自定义转换
        return transformedBitmap;
    }

    @Override
    public String key() {
        return "customTransformation";
    }
};

Picasso.get().load(imageUrl)
            .transform(transformation)
            .into(imageView);

 3.ピカソの使用例

主な活動 : 

package com.example.picassodemo;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

import android.os.Bundle;
import android.provider.ContactsContract;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import androidx.appcompat.app.AppCompatActivity;
import com.squareup.picasso.Picasso;

public class MainActivity extends AppCompatActivity {

    private ImageView imageView;
    private Button load,rotate;
    String imageUrl = "https://img-home.csdnimg.cn/images/20201124032511.png"; // 替换为实际的图片URL

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

        // 获取ImageView控件的引用
        imageView = findViewById(R.id.image_view);
        load = findViewById(R.id.load);
        rotate =findViewById(R.id.rotate);
        rotate.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Picasso.get().load(imageUrl).rotate(90).fit().into(imageView);
            }
        });
        load.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // 使用Picasso加载网络图片
                Picasso.get().load(imageUrl).placeholder(R.drawable.img).error(R.drawable.ic_launcher_background).fit().into(imageView);
            }
        });

    }
}

アクティビティメイン: 

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">


    <ImageView
        android:id="@+id/image_view"
        android:layout_width="200dp"
        android:layout_height="200dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.482"
        tools:srcCompat="@tools:sample/avatars" />

    <Button
        android:id="@+id/load"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="加载图片"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/image_view"
        app:layout_constraintVertical_bias="0.193" />

    <Button
        android:id="@+id/rotate"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="旋转图片"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.796" />

</androidx.constraintlayout.widget.ConstraintLayout>

 操作結果:

Android アイコン ライブラリ: iconfont-Alibaba ベクター アイコン ライブラリ

おすすめ

転載: blog.csdn.net/A125679880/article/details/131797932