पिकासो में एनिमेटेड लोडिंग छवि


105

मेरे पास पिकासो में एक छवि लोड करने के लिए निम्न कोड है, छवि को डाउनलोड करते समय प्रदर्शित करने के लिए प्लेसहोल्डर के लिए एक ड्रॉबल का उपयोग करना। हालांकि मैं चाहता हूं कि एक एनिमेटेड कताई प्रगति पट्टी शैली स्पिनर है जो छवि लोड होने के दौरान और आसपास एनिमेट करता है, जैसे कि मैं अधिकांश पेशेवर ऐप्स में देखता हूं। पिकासो को इसका समर्थन नहीं लगता, केवल स्थिर छवि आरेखित करती है। क्या पिकासो के साथ काम करने का कोई तरीका है या मुझे कुछ अलग करना है?

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

जवाबों:


252

पिकासो प्लेसहोल्डर का उपयोग करके एक लोडिंग प्रगति एनीमेशन छवि कैसे प्राप्त करें:

मैंने इसे एक एनिमेटेड-रोटेट 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 );

32
@ काम यह शानदार काम करता है लेकिन बड़ी छवियों के लिए, यह खराब हो गया। क्या हम 32x32 पिक्सेल की संख्या तक इसकी चौड़ाई और ऊंचाई तय कर सकते हैं?
m3hdi

9
यह काम नहीं करता है, कोई एनीमेशन नहीं दिखाया गया है। बस एक सादी छवि
जो महेर

4
यह काम कर रहा है, लेकिन मुझे छोटे लोडर चाहिए, जैसे कि मेरा इमेजव्यू साइज लोडर नहीं है
गणपत कालिया

2
ठीक काम किया है, एनीमेशन कुछ मिलीसेकंड तक छोटा रहता है जब तक कि डाउनलोड की गई छवि दिखाई देने से पहले, यह अधिकतम हो जाती है और कुछ मिलीसेकंड तक फैल जाती है तब छवि दिखाई देती है। क्या कोई उपाय है?
छोटे कोडर

2
उपयोग romannurik.github.io/AndroidAssetStudio/index.html mdpi बनाने के लिए, HDPI, XHDPI, आदि ( "लॉन्चर आइकन जनरेटर" का चयन करें)
CoolMind

73

मैंने इमेज डाउनलोड और इसके बहुत सरल होने तक प्रगति संवाद को लागू किया। अपने 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

                }
            });
        }

का आनंद लें। :)


धन्यवाद .. इससे मुझे बहुत मदद मिली :)
ज़ोहैर

2
महान! अब तक का सबसे अच्छा समाधान, कई अलग-अलग संदर्भों में इस्तेमाल किया जा सकता है। :)
वीवीजेन

7
वास्तव में आपको कमजोर संदर्भों पर ध्यान देना चाहिए और कचरा संग्रहण से बचने के लिए इस तरह से कॉलबैक ऑब्जेक्ट की घोषणा करनी चाहिए (अन्यथा final Callback loadedCallback = new Callback() { @Override public void onSuccess() { // your code } @Override public void onError() { // your code } }; imageView.setTag(loadedCallback); Picasso.with(context).load(url).into(imageView, loadedCallback);
onSuccess

किसी को भी लिंगो द्वारा भ्रमित किया जाता है, एक प्रगति लोडर एक प्रगति खराब है
जो महेर

2
आप RoundedTransformation वर्ग को जोड़ने से चूक गए। यह वर्ग यहाँ है। gist.github.com/aprock/6213395
एमडी। सजदुल करीम

3

पिकासो दुर्भाग्य से एनिमेटेड प्लेसहोल्डर्स का समर्थन नहीं करता है।

एक तरह से आप इसके आसपास काम कर सकते हैं अपने ImageView को एक फ्रेमलेयआउट में एनिमेटेड ड्रिबल के नीचे रखें। इस तरह जब पिकासो छवि को लोड करता है तो यह एनिमेटेड प्लेसहोल्डर के शीर्ष पर लोड होगा, जिससे उपयोगकर्ता को इच्छित प्रभाव मिलेगा।

वैकल्पिक रूप से, आप छवि को लक्ष्य में लोड कर सकते हैं । तब आपके पास डिफ़ॉल्ट रूप से प्रगति पट्टी दिखाई देगी, और जब onBitmapLoaded विधि को बुलाया जाता है, तो आप इसे छिपा सकते हैं और छवि प्रदर्शित कर सकते हैं। आप इसका एक बुनियादी कार्यान्वयन यहां देख सकते हैं


3
पिकासो एनिमेटेड प्लेसहोल्डर्स का समर्थन करता है । आप एनीमेशन ड्रा करने योग्य फ़ाइल लिखते हैं (एनीमेशन में प्रत्येक छवि का प्रतिनिधित्व करने वाले कई मदों के साथ एनीमेशन सूची शामिल है)। आप उस फ़ाइल को एक नई एनिमेशनड्राइवेबल ऑब्जेक्ट में फीड करते हैं और फिर इसे पिकासो लोडर कंस्ट्रक्टर में प्लेसहोल्डर () में पास करते हैं।
ओड्म

1

बस नीचे की तरह 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.with(activity).load(url)
                    .apply(RequestOptions.centerInsideTransform())
                    .placeholder(R.drawable.progress_animation)
                    .into(imageview);

1

मुझे इस सवाल का जवाब मिल गया!

देखें: https://github.com/square/picasso/issues/427#issuecomment-26666463

@DBragion के उत्तर के अलावा, नीचे प्रयास करें।

अब हम ऊंचाई और चौड़ाई तय कर सकते हैं!

image_view.scaleType = ImageView.ScaleType.CENTER_INSIDE
picasso.load(your_path)
        .fit()
        .centerCrop()
        .noFade()
        .placeholder(R.drawable. progress_animation)
        .into(image_view)

मुझे लगता है कि दो प्रमुख बिंदु हैं।

  1. उपयोग noFade ()

  2. "CENTER_INSIDE" में image_view का पैमाना सेट करें


0

मैंने इसे निम्नलिखित तरीके से काम किया:

  1. एक ड्रॉबल बनाया (इंटरनेट पर कहीं पाया गया) और इसे रेस / ड्रॉबल में रखा:

    <?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. एडेप्टर में निम्न पैरामीटर्स के साथ टारगेट ऑब्जेक्ट जोड़ा गया, जहाँ पोस्टर और स्पिनर ImageView और प्रोग्रेसबेर के संदर्भ हैं:

    // ImageView पर प्रोग्रेसबार दिखाने / छिपाने के लिए लक्ष्य

    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. परिणाम ऐसा होगा कि लोडिंग पर - सर्कल घूम रहा है (इस स्क्रीनशॉट के लिए खेद है, लेकिन छवियां बहुत तेज़ी से दिखाई दे रही हैं): स्क्रीनशॉट


0

DBragion की तकनीक का उपयोग करने की कोशिश कर रहे किसी के लिए: सुनिश्चित करें कि आपके पास पिकासो का नवीनतम संस्करण है या फिर यह स्पिन नहीं करेगा। जब तक मैंने संस्करण 2.5.2 का उपयोग नहीं किया, मेरा काम नहीं हुआ।

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

6
यह कहा गया जवाब के तहत एक टिप्पणी होनी चाहिए
ओजोनुगवा जूड ओचलिफु जुएल

0

इस कड़ी में , जेक व्हार्टन ने कहा:

नहीं। हम सभी इमेज डिकोडिंग के लिए Android BitmapFactory का उपयोग करते हैं और इसमें कोई एनिमेटेड GIF सपोर्ट (दुख की बात) नहीं है।

तब आप नहीं कर सकते


हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.