George Hilliard
George Hilliard

Reputation: 15962

Adding buttons to an ImageView

In my app I have an ImageView that is filled in by Picasso:

Picasso.with(context).load("http://example.com/logo.png").into(imageView);

This works fine. However, I would like to add a button to the top corner of each ImageView. Obviously, this means making my own reusable instance of some kind.

I'm confused as to the best way to approach it. Ideally I would like to create a subclass of ImageView to preserve the above syntax and semantics. ("This is an ImageView plus a bit.") However, the XML required to make this sort of structure requires a RelativeLayout or FrameLayout as its root, and I can't point that at an ImageView subclass.

How could I effectively create such a subclass?

Upvotes: 0

Views: 118

Answers (1)

DagW
DagW

Reputation: 955

Ok, since ImageView is not a viewgroup you cant add a button into a subclass of imageview.

I would solve this by instead creating a view which would be a subclass of a viewgroup ex. Frame/Realtive/etc-Layout.

It would contain the ImageView and Button, and a method getImageView().

Then your picasso call would be: Picasso.with(context).load("http://example.com/logo.png").into(mCustomView.getImageView());

---Edit---

OK Since I was on my mobile writing i could not give an example. This would give you a reuseable view, that also can be inflated programmatically. You will have to create an XML layout file to be inflated by your custom class.

public class MyCustomImageView extends FrameLayout {
    private ImageView mImageView;
    private Button mButton;
    private Context mContext;

    public MyCustomImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.mContext = context;
        LayoutInflater layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        View view = layoutInflater.inflate(R.layout.custom_imageview, this);
        mImageView = (ImageView) view.findViewById(R.id.iv_imgv);
        mButton = (Button) view.findViewById(R.id.b_btn);

        //mImageView.setOnClickListener( new OnClickListener(){...} );
        //mButton.setOnClickListener( new OnClickListener(){...} );
    }

    //Return image view for image loading etc.
    public ImageView getImageView(){
        return this.mImageView;
    }

    //Add onClickListener for the button
    public void setButtonOnClickListener(inListener){
        mButton.setOnClickListener(inListener);
    }

    //If you want you can simulate this to be an image view
    // Ex..
    public void setImageDrawable(Drawable drawable){
        iv.setImageDrawable(drawable);
    }
}

This can be inflated from XML layouts;

    <com.example.packagename.customview.MyCustomImageView  ... />

Or programmatically;

    MyCustomImageView customview = new MyCustomImageView(context);
    custom.setImageDrawable(drawable);
    custom.setButtonOnclickListener(new OnClickListener(){...});

Upvotes: 1

Related Questions