How to draw rectangle with transparent sides on Canvas in Android

Question

I know how to draw rectangle on Canvas in Android. My requirement is to draw rectangle on canvas as shown below without using image file (Bitmap).

How can I achieve it, Thanks In Advance.

Answer 1

I create a sample for this effect, hope it can help you :

public class ScanBorderView extends View {
    private int mBorderHeight;
    private int mBorderWidth;
    private int mBorderColor;
    private Rect mBounds, mDrawBounds;
    private Paint mPaint;

    public ScanBorderView(Context context, AttributeSet attrs) {
        super(context, attrs);

        mBounds = new Rect();
        mDrawBounds = new Rect();

        mBorderWidth = 4;
        mBorderHeight = 40;
        mBorderColor = Color.RED;

        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPaint.setColor(mBorderColor);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        mBounds.set(getPaddingLeft(), getPaddingTop(),
            getWidth() - getPaddingRight(), getHeight() - getPaddingBottom());

        // top-left
        mDrawBounds.set(mBounds);
        mDrawBounds.right = mDrawBounds.left + mBorderWidth;
        mDrawBounds.bottom = mDrawBounds.top + mBorderHeight;
        canvas.drawRect(mDrawBounds, mPaint);

        mDrawBounds.right = mDrawBounds.left + mBorderHeight;
        mDrawBounds.bottom = mDrawBounds.top + mBorderWidth;
        canvas.drawRect(mDrawBounds, mPaint);


        // top-right
        mDrawBounds.set(mBounds);
        mDrawBounds.left = mDrawBounds.right - mBorderWidth;
        mDrawBounds.bottom = mDrawBounds.top + mBorderHeight;
        canvas.drawRect(mDrawBounds, mPaint);

        mDrawBounds.left = mDrawBounds.right - mBorderHeight;
        mDrawBounds.bottom = mDrawBounds.top + mBorderWidth;
        canvas.drawRect(mDrawBounds, mPaint);


        // bottom-left
        mDrawBounds.set(mBounds);
        mDrawBounds.top = mDrawBounds.bottom - mBorderHeight;
        mDrawBounds.right = mDrawBounds.left + mBorderWidth;
        canvas.drawRect(mDrawBounds, mPaint);

        mDrawBounds.set(mBounds);
        mDrawBounds.top = mDrawBounds.bottom - mBorderWidth;
        mDrawBounds.right = mDrawBounds.left + mBorderHeight;
        canvas.drawRect(mDrawBounds, mPaint);


        // bottom-right
        mDrawBounds.set(mBounds);
        mDrawBounds.top = mDrawBounds.bottom - mBorderHeight;
        mDrawBounds.left = mDrawBounds.right - mBorderWidth;
        canvas.drawRect(mDrawBounds, mPaint);

        mDrawBounds.set(mBounds);
        mDrawBounds.top = mDrawBounds.bottom - mBorderWidth;
        mDrawBounds.left = mDrawBounds.right - mBorderHeight;
        canvas.drawRect(mDrawBounds, mPaint);
    }
}