एंड्रॉइड: पिकासो के साथ परिपत्र छवि बनाएं


108

सवाल पूछा गया था और पिकासो के बहुत ही संस्करण के लिए एक वादा किया गया था जिसका मैं उपयोग कर रहा हूं: मैं पिकासो का उपयोग करके ImageView को एक परिपत्र बिटमैप कैसे भेजूं? मैं पिकासो के लिए नया हूं और केवल एक चीज जिसका मैंने उपयोग किया है

Picasso.with(context).load(url).resize(w, h).into(imageview);

मुझे पहले से ही https://gist.github.com/julianshen/5829333 मिल चुका है, लेकिन मुझे यकीन नहीं है कि इसे गैर-अजीब तरीके से ऊपर की रेखा के साथ कैसे जोड़ा जाए।


आपके द्वारा दिया गया लिंक आपके अपने प्रश्न का उत्तर देने के लिए पर्याप्त था। और आपको केवल Picasso.with (गतिविधि) .load (mayorShipImageLink) .transform (नया CircleTransform ())। (ImageView) लागू करने की आवश्यकता थी;
लागोस

जवाबों:


286

उपलब्ध होने से पहले ही शोध कर लें। किसी भी तरह, इस लिंक का पालन करें और इसे कैसे उपयोग करें, यह जानने के लिए ध्यान से पढ़ें।

इसे इस्तेमाल करे:

import com.squareup.picasso.Transformation;

public class CircleTransform implements Transformation {
    @Override
    public Bitmap transform(Bitmap source) {
        int size = Math.min(source.getWidth(), source.getHeight());

        int x = (source.getWidth() - size) / 2;
        int y = (source.getHeight() - size) / 2;

        Bitmap squaredBitmap = Bitmap.createBitmap(source, x, y, size, size);
        if (squaredBitmap != source) {
            source.recycle();
        }

        Bitmap bitmap = Bitmap.createBitmap(size, size, source.getConfig());

        Canvas canvas = new Canvas(bitmap);
        Paint paint = new Paint();
        BitmapShader shader = new BitmapShader(squaredBitmap,
                Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
        paint.setShader(shader);
        paint.setAntiAlias(true);

        float r = size / 2f;
        canvas.drawCircle(r, r, r, paint);

        squaredBitmap.recycle();
        return bitmap;
    }

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

तो बस इसे लागू करें:

Picasso.with(activity).load(mayorShipImageLink).transform(new CircleTransform()).into(ImageView);

@ anirudh-sharma इन आयातों को जोड़ना सुनिश्चित करें: android.graphics.Bitmap आयात करें; आयात android.graphics.BitmapShader; आयात android.graphics.Canvas; आयात android.graphics.Paint; आयात com.squareup.picasso.Transformation;
एजी

1
@all: यदि आप gif चित्रों पर एक शून्य सूचक अपवाद प्राप्त करते हैं, तो इसे देखें
Cerlin

कोटलिन में एक आकर्षण की तरह काम करता है। मौजूदा एपीआई के लिए एक परिवर्तन, BitmapShader.TileMode.CLAMPअब और तेज नहीं है, मैंने जवाब अपडेट किया है
sud007

काम नहीं करता! संभावित घातक सिग्नल 6 (SIGBART) , जिसका अर्थ है कि बिटमैप .recycle () वास्तव में मेमोरी से रिफ्रेंस निकाल रहा है और signal 6 (SIGABRT), code -6 (SI_TKILL), fault addr -------- 11-12 00:03:47.941 29091 29091 F DEBUG : Abort message: 'Error, cannot access an invalid/free'd bitmap here!'-> एबॉर्ट संदेश: 'त्रुटि, एक अवैध / फ्री बिट बिटमैप तक नहीं पहुंच सकता है! क्योंकि यह कचरा है जो स्मृति से एकत्र किया जाता है। bitmap.recycleपुराने Android उपकरणों के लिए उपयोग किया जाता है, जो मुझे समझ में आता है।
हारून हजेम

47

यहाँ कुछ है जो support-v4 पुस्तकालय द्वारा प्रदान किया गया है ! RoundedBitmapDrawable में देखें । अपना रोल करने की कोई आवश्यकता नहीं है:

Picasso.with(context).load(url)
                        .resize(w, h)
                        .into(myImageView, new Callback() {
                            @Override
                            public void onSuccess() {
                                Bitmap imageBitmap = ((BitmapDrawable) myImageView.getDrawable()).getBitmap();
                                RoundedBitmapDrawable imageDrawable = RoundedBitmapDrawableFactory.create(getResources(), imageBitmap);
                                imageDrawable.setCircular(true);
                                imageDrawable.setCornerRadius(Math.max(imageBitmap.getWidth(), imageBitmap.getHeight()) / 2.0f);
                                myImageView.setImageDrawable(imageDrawable);
                            }
                            @Override
                            public void onError() {
                                myImageView.setImageResource(R.drawable.default_image);
                            }
                        });

नोट: पिकासो के पास एक .transform (कस्टमट्रांसफॉर्मेशन) कॉल भी है जिसे आप सैद्धांतिक रूप से उपयोग कर सकते हैं, हालांकि, मेरे पास इसके बारे में समस्या थी। यह ऊपर काम करता है। सौभाग्य!


यह पूरी तरह से चौकोर छवि के लिए काम करेगा। किसी भी छवि के लिए कोने के दायरे में Math.min का उपयोग करें। imageDrawable.setCornerRadius (Math.min (imageBitmap.getWidth) (, imageBitmap.getHeight ()) / 2.0f);
Xplosive

हम OnSuccess () में अलग धागा नहीं बनाते, क्योंकि मूल बिटमैप से गोल बिटमैप बनाने के लिए यह लंबा काम हो सकता है?
हसदेव

17

एक अन्य विकल्प जो मुझे मिला वह था यह पुस्तकालय। यह स्टैंडअलोन, या पिकासो के साथ मिलकर काम करता है। मैंने पिकासो मार्ग को चुना, जैसे नीचे:

https://github.com/vinc3m1/RoundedImageView

Transformation transformation = new RoundedTransformationBuilder()
          .borderColor(Color.BLACK)
          .borderWidthDp(3)
          .cornerRadiusDp(30)
          .oval(false)
          .build();

Picasso.with(context)
    .load(url)
    .fit()
    .transform(transformation)
    .into(imageView);

मेरे लिए काम किया!


12

पिकासो के लिए एक परिवर्तन पुस्तकालय है।

बस जोड़ निर्भरता जोड़ें

implementation 'jp.wasabeef:picasso-transformations:2.2.1'

अंत इसका उपयोग करें

Picasso.with(context)
       .load(url)
       .resize(w, h)
       .transform(new CropCircleTransformation())
       .into(imageview);

विकी: पिकासो ट्रांसफॉर्मेशन


यह वास्तव में इस सवाल का सही जवाब है, यह कैसे आया है कि इतने कम वोट हैं ..
डीडीसिपिल

10

मैंने ऊपर दिए गए सभी समाधानों की कोशिश की है, लेकिन उनमें से कोई भी मुझे क्रॉप पिक्चरिंग के बिना सर्कल ट्रांसफ़ॉर्म नहीं देता है..तो समाधान केवल उसी चौड़ाई और ऊँचाई वाली छवियों के लिए काम करेगा।

प्रथम ------

Picasso.with(getActivity())
            .load(url)
            .error(R.drawable.image2)
            .placeholder(R.drawable.ic_drawer)
            .resize(200, 200)
            .transform(new ImageTrans_CircleTransform())
            .into(imageView1);

फिर ऐसा करें --------

import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Shader.TileMode;

import com.squareup.picasso.Transformation;
public class ImageTrans_CircleTransform implements Transformation {
 @Override
    public Bitmap transform(Bitmap source) {
 if (source == null || source.isRecycled()) {
                return null;
            }

            final int width = source.getWidth() + borderwidth;
            final int height = source.getHeight() + borderwidth;

            Bitmap canvasBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
            BitmapShader shader = new BitmapShader(source, TileMode.CLAMP, TileMode.CLAMP);
            Paint paint = new Paint();
            paint.setAntiAlias(true);
            paint.setShader(shader);

            Canvas canvas = new Canvas(canvasBitmap);
            float radius = width > height ? ((float) height) / 2f : ((float) width) / 2f;
            canvas.drawCircle(width / 2, height / 2, radius, paint);

            //border code
            paint.setShader(null);
            paint.setStyle(Paint.Style.STROKE);
            paint.setColor(bordercolor);
            paint.setStrokeWidth(borderwidth);
            canvas.drawCircle(width / 2, height / 2, radius - borderwidth / 2, paint);
            //--------------------------------------

            if (canvasBitmap != source) {
                source.recycle();
            }

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

8

इस लाइब्रेरी का उपयोग एक गोलाकार चित्र बनाने के लिए करें। एक वृताकार ImageView बनाने के लिए, इस CircularImageView लाइब्रेरी को अपनी परियोजना में जोड़ें और अपने लेआउट XML में CircularImageView जोड़ें

<com.pkmmte.view.CircularImageView
        android:layout_width="250dp"
        android:layout_height="250dp"
        android:src="@drawable/image"
        app:border_color="#EEEEEE"
        app:border_width="4dp"
        app:shadow="true" />`

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


2

नीचे दिए गए कोड के साथ टाइप Layer- सूची के xml को शामिल करें

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@+id/shape_status">
        <shape android:shape="oval">
            <solid android:color="@android:color/black"/>
        </shape>
    </item>
<item android:drawable="@drawable/ic_status_content"/></layer-list>

फिर android.src में अपने ImageView के लिए xml का उपयोग करें

 <ImageView
            android:id="@+id/iconStatus"
            android:layout_width="55dp"
            android:layout_height="55dp"
            android:layout_gravity="right"
            android:src="@drawable/ic_circle_status"
            android:layout_alignParentTop="true"
            android:layout_alignParentEnd="true"/>


0

यह वर्तमान पिकासो 3 स्नैपशॉट के साथ काम कर रहा है:

class CircleTransformation : Transformation {

  override fun transform(source: RequestHandler.Result): RequestHandler.Result {
    if (source.bitmap == null) {
      return source
    }

    var bitmap: Bitmap

    // since we cant transform hardware bitmaps create a software copy first
    if (VERSION.SDK_INT >= VERSION_CODES.O && source.bitmap!!.config == Config.HARDWARE) {
      val softwareCopy = source.bitmap!!.copy(Config.ARGB_8888, true)
      if (softwareCopy == null) {
        return source
      } else {
        bitmap = softwareCopy
        source.bitmap!!.recycle()
      }
    } else {
      bitmap = source.bitmap!!
    }

    var size = bitmap.width
    // if bitmap is non-square first create square one
    if (size != bitmap.height) {
      var sizeX = size
      var sizeY = bitmap.height
      size = Math.min(sizeY, sizeX)
      sizeX = (sizeX - size) / 2
      sizeY = (sizeY - size) / 2

      val squareSource = Bitmap.createBitmap(bitmap, sizeX, sizeY, size, size)
      bitmap.recycle()
      bitmap = squareSource
    }

    val circleBitmap = Bitmap.createBitmap(size, size, Config.ARGB_8888)
    val canvas = Canvas(circleBitmap)
    val paint = Paint()
    val shader = BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP)

    paint.shader = shader
    paint.isAntiAlias = true
    val centerAndRadius = size / 2f
    canvas.drawCircle(centerAndRadius, centerAndRadius, centerAndRadius, paint)

    bitmap.recycle()
    return RequestHandler.Result(circleBitmap, source.loadedFrom, source.exifRotation)
  }

  override fun key(): String {
    return "circleTransformation()"
  }
}

पिकासो 3 gist: https://gist.github.com/G00fY2/f3fbc468570024930c1fd9eb4cec85a1


0

यहाँ मेरे लिए पिकासो v2.71828 के साथ काम किया गया है

class CircleTransform : Transformation {
override fun transform(source: Bitmap?): Bitmap? {
    if (source == null) {
        return source
    }

    var bitmap: Bitmap

    // since we cant transform hardware bitmaps create a software copy first
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O && source.config == Bitmap.Config.HARDWARE) {
        val softwareCopy = source.copy(Bitmap.Config.ARGB_8888, true)
        if (softwareCopy == null) {
            return source
        } else {
            bitmap = softwareCopy
            source.recycle()
        }
    } else {
        bitmap = source
    }

    var size = bitmap.width
    // if bitmap is non-square first create square one
    if (size != bitmap.height) {
        var sizeX = size
        var sizeY = bitmap.height
        size = Math.min(sizeY, sizeX)
        sizeX = (sizeX - size) / 2
        sizeY = (sizeY - size) / 2

        val squareSource = Bitmap.createBitmap(bitmap, sizeX, sizeY, size, size)
        bitmap.recycle()
        bitmap = squareSource
    }

    val circleBitmap = Bitmap.createBitmap(size, size, Bitmap.Config.ARGB_8888)
    val canvas = Canvas(circleBitmap)
    val paint = Paint()
    val shader = BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP)

    paint.shader = shader
    paint.isAntiAlias = true
    val centerAndRadius = size / 2f
    canvas.drawCircle(centerAndRadius, centerAndRadius, centerAndRadius, paint)

    bitmap.recycle()
    return circleBitmap
}


override fun key(): String {
    return "circleTransformation()"
}

}

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