web-dev-qa-db-ja.com

ピカソのアニメーション読み込み画像

画像のダウンロード中にプレースホルダーを表示するためのドロアブルを使用して、ピカソに画像をロードする次のコードがあります。私が欲しいのは、ほとんどのプロのアプリで見られるように、画像がロードされている間、あちこちで動くアニメーションの回転プログレスバースタイルのスピナーです。ピカソはこれをサポートしていないようで、静止画像のドローアブルのみをサポートしているようです。それをピカソで動作させる方法はありますか、それとも何か別のことをしなければなりませんか？

Picasso.with(context).load(url)             
                    .placeholder(R.drawable.loading)
                    .error(R.drawable.image_download_error)
                    .into(view);
androidpicasso
101
NZJames

Picassoプレースホルダーを使用して読み込み進行状況アニメーションイメージを作成する方法：

アニメーション化された回転xmlオブジェクトを使用して、これを簡単に解決しました。

手順：

progress_image.png

progress_image.png

/ res/drawable/progress_animation.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">

<item Android:gravity="center">
    <animated-rotate xmlns:Android="http://schemas.Android.com/apk/res/Android"
        Android:drawable="@drawable/progress_image"
        Android:pivotX="50%"
        Android:pivotY="50%" />
    </item>
</layer-list>

ピカソの読み込み：

Picasso.with( context )
        .load( your_path )
        .error( R.drawable.ic_error )
        .placeholder( R.drawable.progress_animation )
        .into( image_view );
235
DBragion

イメージのダウンロードまでの進行状況ダイアログを実装しましたが、非常に簡単です。 ImageViewを相対的なレイアウトにして、同じ画像ビューにプログレスローダーを配置します。以下のコードを適用し、進行状況ダイアログの可視性のみを処理します。

holder.loader.setVisibility(View.VISIBLE);
            holder.imageView.setVisibility(View.VISIBLE);
         final ProgressBar progressView = holder.loader;
            Picasso.with(context)
            .load(image_url)
            .transform(new RoundedTransformation(15, 0))
            .fit()
            .into(holder.imageView, new Callback() {
                @Override
                public void onSuccess() {
                    progressView.setVisibility(View.GONE);
                }

                @Override
                public void onError() {
                    // TODO Auto-generated method stub

                }
            });
        }

楽しい。 :)

67
Akanksha Rathore

残念ながら、ピカソはアニメーション化されたプレースホルダーをサポートしていません。

この問題を回避する1つの方法は、ImageViewをFrameLayoutに配置し、その下にアニメーション化されたドロウアブルを配置することです。これにより、Picassoが画像を読み込むときに、アニメーション化されたプレースホルダーの上部に読み込まれ、ユーザーに意図した効果が与えられます。

または、イメージを Target にロードすることもできます。その後、デフォルトで進行状況バーが表示され、onBitmapLoadedメソッドが呼び出されたときに非表示にして画像を表示できます。これの基本的な実装を見ることができます here

3
Michael

DBragionのテクニックを使おうとする人のために：Picassoの最新バージョンを持っていることを確認してください。私はバージョン2.5.2を使用するまで機能しませんでした。

compile 'com.squareup.picasso:picasso:2.5.2'
0
Jesse Abruzzo

私はそれを次のように動作させました：

  1. （インターネット上のどこかにある）ドロアブルを作成し、res/drawableに入れます：

    <?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:fromDegrees="90"
Android:pivotX="50%"
Android:pivotY="50%"
Android:toDegrees="360">

<shape
    Android:innerRadiusRatio="3"
    Android:shape="ring"
    Android:thicknessRatio="7.0">

    <gradient
        Android:angle="0"
        Android:centerColor="#007DD6"
        Android:endColor="#007DD6"
        Android:startColor="#007DD6"
        Android:type="sweep"
        Android:useLevel="false" />
</shape>

  2. GridViewの私のアイテムにProgressBar要素を追加しました：

    <ProgressBar
    Android:id="@+id/movie_item_spinner"
    Android:layout_width="@dimen/poster_width"
    Android:layout_height="@dimen/poster_height"
    Android:progressDrawable="@drawable/circular_progress_bar"/>

  3. Adapterでは、以下のパラメーターを持つターゲットオブジェクトが追加されました。ポスターとスピナーはImageViewとProgressBarへの参照です。

    // ImageViewでProgressBarを表示/非表示にするターゲット

    final Target target = new Target() {

        @Override
        public void onPrepareLoad(Drawable drawable) {
            poster.setBackgroundResource(R.color.white);
            spinner.setVisibility(View.VISIBLE);
        }

        @Override
        public void onBitmapLoaded(Bitmap photo, Picasso.LoadedFrom from) {
            poster.setBackgroundDrawable(new BitmapDrawable(photo));
            spinner.setVisibility(View.GONE);
        }

        @Override
        public void onBitmapFailed(Drawable drawable) {
            poster.setBackgroundResource(R.color.white);
        }
    };

  4. 読み込み時の結果は次のようになります-円が回転しています（このスクリーンショットでは申し訳ありませんが、画像の表示が速すぎます）： ScreenShot

0
Dmytro Karataiev

この中で リンク 、ジェイク・ウォートンは言った：

いや。すべての画像デコードにAndroid BitmapFactoryを使用しますが、アニメーションGIFのサポートはありません（残念ながら）。

それではできません

0
Radesh

以下のように、DBragionの回答に図形属性を追加するだけで、魅力のように機能します。ハッピーコーディング。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item>

        <shape
            Android:shape="rectangle">

            <size
                Android:width="200dp"
                Android:height="200dp"/>

            <solid
                Android:color="#00FFFFFF"/>
        </shape>
    </item>

    <item Android:gravity="center">
        <animated-rotate xmlns:Android="http://schemas.Android.com/apk/res/Android"
            Android:drawable="@drawable/spinner"
            Android:pivotX="50%"
            Android:pivotY="50%" />
    </item>
</layer-list>

Glideも使用できます。

Glide.with(activity).load(url)
                    .apply(RequestOptions.centerInsideTransform())
                    .placeholder(R.drawable.progress_animation)
                    .into(imageview);
0
Tushar Lathiya

この質問に対する答えを見つけました！

参照： https://github.com/square/picasso/issues/427#issuecomment-26627625

@DBragionの回答に加えて、以下を試してください。

これで高さと幅を修正できます！

image_view.scaleType = ImageView.ScaleType.CENTER_INSIDE

picasso.load(your_path)
        .fit()
        .centerCrop()
        .noFade()
        .placeholder(R.drawable. progress_animation)
        .into(image_view)

2つの重要なポイントがあると思います。

  1. noFade（）を使用します

  2. image_viewのscaleTypeを「CENTER_INSIDE」に設定します

0
Yusuke Yonehara

Picasso PlaceHolderを使用するだけです

  Picasso.get()
        .load(datas[position].artist?.image)
        .placeholder(R.drawable.music_image)
        .error(R.drawable.music_image)
        .into(holder.cardViewImage)
0
Exel Staderlin