How to Lazy load URL image to google maps markers icon
Asked Answered
H

0

6

I am using google maps utility library demo code, and change to use Picasso for image load.

My question is as follow capture.

Picasso can't load the image and use the placeholder image

Picasso can't load the image and use the placeholder image

After zoom in and out, Refresh marker. Can load the image

After zoom in and out, Refresh marker. Can load the image.

My question same with this Google Map V2 Lazy loading of marker image But I cannot get help from the answer, I get stuck on Bitmap bitmap = thumbCache.get(url); I also try the Picasso onSuccess callback, but also get suck on it.

How to refresh the maker icon when download URL image finish? I can use another URL image loader library.

/**
 * Draws profile photos inside markers (using IconGenerator).
 * When there are multiple people in the cluster, draw multiple photos (using MultiDrawable).
 */
private class PersonRenderer extends DefaultClusterRenderer<Person> {
    private final IconGenerator mIconGenerator = new IconGenerator(getApplicationContext());
    private final IconGenerator mClusterIconGenerator = new IconGenerator(getApplicationContext());
    private final ImageView mImageView;
    private final ImageView mClusterImageView;
    private final int mDimension;

    public PersonRenderer() {
        super(getApplicationContext(), getMap(), mClusterManager);

        View multiProfile = getLayoutInflater().inflate(R.layout.multi_profile, null);
        mClusterIconGenerator.setContentView(multiProfile);
        mClusterImageView = (ImageView) multiProfile.findViewById(R.id.image);

        mImageView = new ImageView(getApplicationContext());
        mDimension = (int) getResources().getDimension(R.dimen.custom_profile_image);
        mImageView.setLayoutParams(new ViewGroup.LayoutParams(mDimension, mDimension));
        int padding = (int) getResources().getDimension(R.dimen.custom_profile_padding);
        mImageView.setPadding(padding, padding, padding, padding);
        mIconGenerator.setContentView(mImageView);
    }

    @Override
    protected void onBeforeClusterItemRendered(Person person, MarkerOptions markerOptions) {
        // Draw a single person.
        // Set the info window to show their name.

        Picasso.with(getApplicationContext())
                .load(person.profileUrl)
                .placeholder(R.drawable.ic_launcher)
                .error(R.drawable.ic_launcher)
                .resize(64, 64)
                .centerCrop()
                .into(mImageView);

        Bitmap icon = mIconGenerator.makeIcon();
        markerOptions.icon(BitmapDescriptorFactory.fromBitmap(icon)).title(person.name);
    }

    @Override
    protected void onBeforeClusterRendered(Cluster<Person> cluster, MarkerOptions markerOptions) {
        // Draw multiple people.
        // Note: this method runs on the UI thread. Don't spend too much time in here (like in this example).
        List<Drawable> profilePhotos = new ArrayList<Drawable>(Math.min(4, cluster.getSize()));
        int width = mDimension;
        int height = mDimension;

        for (Person p : cluster.getItems()) {
            // Draw 4 at most.
            if (profilePhotos.size() == 4) break;
            ImageView cImageView = new ImageView(getBaseContext());

            Picasso.with(getApplicationContext())
                    .load(p.profileUrl)
                    .placeholder(R.drawable.ic_launcher)
                    .error(R.drawable.ic_launcher)
                    .resize(64, 64)
                    .centerCrop()
                    .into(cImageView);

            Drawable drawable = cImageView.getDrawable();
            drawable.setBounds(0, 0, width, height);
            profilePhotos.add(drawable);

        }
        MultiDrawable multiDrawable = new MultiDrawable(profilePhotos);
        multiDrawable.setBounds(0, 0, width, height);

        mClusterImageView.setImageDrawable(multiDrawable);
        Bitmap icon = mClusterIconGenerator.makeIcon(String.valueOf(cluster.getSize()));
        markerOptions.icon(BitmapDescriptorFactory.fromBitmap(icon));
    }
Hibbert answered 14/2, 2017 at 9:14 Comment(1)
Have you got any solutionsVaillancourt

© 2022 - 2024 — McMap. All rights reserved.