Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android draw border in ImageView

I want to draw a border around an image. But I can't align the border at the ImageView itself (like it is done mostly) because I translate and scale the image inside of the ImageView with the ImageMatrix (the ImageView itself is fill_parent / fills the whole screen). I had the idea to add a second image (which looks like a border) and translate & scale it in the same way as the image which should have a border, but it isn't very handy to do it this way. Has anybody a better idea to reach that goal?

like image 269
andineupert Avatar asked Oct 02 '11 13:10

andineupert


1 Answers

There are two ways to achieve this: 1) add padding to the imageView and set a background color to it.

final ImageView imageView = new ImageView(context);
imageView.setPadding(2*border,2*border,0,0);
final ViewGroup.MarginLayoutParams params = new ViewGroup.MarginLayoutParams(width,height);
params.leftMargin = marginYouWouldSet + border;
params.topMargin = marginYouWouldSet + border;
imageView.setBackgroundDrawable(drawable);
imageView.setBackgroundColor(borderColor);
addView(imageView, params);

2) another option is to override the draw method of your view and there draw the border:

@Override
protected void dispatchDraw(Canvas canvas)
{
 borderDrawable.draw(canvas);
 super.dispatchDraw(canvas);
}
...
public class BorderDrawable extends Drawable{

    private Rect mBounds;
    private Paint mBorderPaint;

    public BorderDrawable(Rect bounds, int thickness, int color) {
        mBounds = bounds;
        mBorderPaint = new Paint();
        mBorderPaint.setStrokeWidth(thickness);
        mBorderPaint.setColor(color);
    }

    @Override
    public void draw(Canvas canvas) {
        //left border
        canvas.drawLine(
                mBounds.left - thickness/2, 
                mBounds.top,
                mBounds.left - thickness/2,
                mBounds.bottom,
                mBorderPaint);
        //top border
        canvas.drawLine(
                mBounds.left, 
                mBounds.top - thickness/2,
                mBounds.right, 
                mBounds.top - thickness/2, 
                mBorderPaint);
        //right border
        canvas.drawLine(
                mBounds.right + thickness/2, 
                mBounds.top,
                mBounds.right + thickness/2,
                mBounds.bottom, 
                mBorderPaint);
        //bottom border
        canvas.drawLine(
                mBounds.left, 
                mBounds.bottom + thickness/2, 
                mBounds.right, 
                mBounds.bottom + thickness/2, 
                mBorderPaint);
    }

}

Note that you are to give the middle of the line you want to draw(!) And also I haven't run, nor compiled this, so I'm not 100% sure it's correct, but these are the ways :) Rect bounds should be the bounding rect of your view - (0,0,width,height).

like image 110
asenovm Avatar answered Oct 22 '22 07:10

asenovm