Change background color to a limited area of a view - Android

Question

I am trying to develop a BarcodeReader using Google play services, and i would like to get a camera surface background like Zxing sample.

Actually I view with a black transparent background and a white Rect Canvas, and i would like this Rect to be transparent, so my question is if can change the view background without this Rect bounds.

This is my Custom View where i draw some lines

public class MyView extends View {

private Paint paint;
private Path path;
private int width, height;
Canvas canvas;
private Rect rectangle;


public MyView(Context context) {
    super(context);
    init();
}

public MyView(Context context, @Nullable AttributeSet attrs) {
    super(context, attrs);
    init();
}

public MyView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init();
}

private void init() {
    paint = new Paint();
    paint.setColor(Color.RED);
    paint.setStrokeWidth(10);
    paint.setStyle(Paint.Style.STROKE);
    this.setBackgroundColor(getResources().getColor(R.color.black60));

}


@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    this.canvas = canvas;
    drawMiddleLine();
    drawLeftUpCorner();
    drawLeftDownCorner();
    drawRightUpCorner();
    drawRightDownCorner();
    drawRectSample();
}

private void drawRectSample() {
    int x = width / 6;
    int y = height / 4;
    int widthLength = x*5;
    int heightLenght = y* 3;
    Paint paint = new Paint();
    // create a rectangle that we'll draw later
    rectangle = new Rect(x, y, widthLength, heightLenght);
    paint.setStyle(Paint.Style.FILL);
    paint.setColor(getResources().getColor(R.color.white50));
    canvas.drawRect(rectangle, paint);


}

private void drawLeftUpCorner() {
    if (width != 0 && height != 0) {
        int startX = width / 6;
        int startY = height / 4;
        int endX = startX * 2;
        int endY = startY;
        canvas.drawLine(startX, startY, endX, endY, paint);
        endX = startX;
        endY += startX;
        canvas.drawLine(startX, startY, endX, endY, paint);
    }
}

private void drawLeftDownCorner() {
    if (width != 0 && height != 0) {
        int startX = width / 6;
        int startY = height / 4 * 3;
        int endX = startX * 2;
        int endY = startY;
        canvas.drawLine(startX, startY, endX, endY, paint);
        endX = startX;
        endY -= startX;
        canvas.drawLine(startX, startY, endX, endY, paint);

    }
}

private void drawRightUpCorner() {
    if (width != 0 && height != 0) {
        int startX = (width / 6) * 4;
        int startY = height / 4;
        int endX = startX + (width / 6);
        int endY = startY;
        canvas.drawLine(startX, startY, endX, endY, paint);
        startX = endX;
        endY = startY + (width / 6);
        canvas.drawLine(startX, startY, endX, endY, paint);
    }
}

private void drawRightDownCorner() {
    if (width != 0 && height != 0) {
        int startX = (width / 6) * 4;
        int startY = (height / 4) * 3;
        int endX = startX + (width/ 6);
        int endY = startY;
        canvas.drawLine(startX, startY, endX, endY, paint);
        startX = endX;
        endY -= width / 6;
        canvas.drawLine(startX, startY, endX, endY, paint);

    }
}


private void drawMiddleLine() {
    if (width != 0 && height != 0) {
        int startX = width / 3;
        int startY = height / 2;
        int endX = startX * 2;
        int endY = startY;
        canvas.drawLine(startX, startY, endX, endY, paint);
        paint.setColor(Color.GREEN);
    }
}

public void setBounds(int width, int height) {
    this.width = width;
    this.height = height;
}

}

This is my xml where the CameraSourePreview and MyView (custom view just to paint screen lines) are:

<?xml version="1.0" encoding="utf-8"?>                                        
<RelativeLayout                                                               
xmlns:android="http://schemas.android.com/apk/res/android"                
android:id="@+id/topLayout"                                               
android:orientation="vertical"                                            
android:layout_width="match_parent"                                       
android:layout_height="match_parent"                                      
android:keepScreenOn="true"                                               
>                                                                         

<t_systems.qrlabs.camera.CameraSourcePreview                              
    android:id="@+id/preview"                                             
    android:layout_width="match_parent"                                   
    android:layout_height="match_parent">                                 

</t_systems.qrlabs.camera.CameraSourcePreview>                            


<t_systems.qrlabs.barcode.MyView                                          
    android:layout_width="match_parent"                                   
    android:id="@+id/myView"                     
    android:layout_centerInParent="true"                                  
    android:layout_height="match_parent" />                               
</RelativeLayout>                                                             

Any help? Thanks.

Answer 1

I solved it with inverse fill path

private void drawBlackBackgorund() {
    int x = width / 6;
    int y = height / 4;
    int widthLength = x*5;
    int heightLenght = y* 3;

    RectF rect = new RectF(x,y,widthLength,heightLenght);

    path.addRect(rect,Path.Direction.CW);
    path.setFillType(Path.FillType.INVERSE_EVEN_ODD);
    canvas.clipPath(path);
    canvas.drawColor(getResources().getColor(R.color.black60));

}