Android Canvas 聚焦在选定区域
Android Canvas focus in selected area
我正在尝试实现这种效果:
我的想法是,我想用部分透明层覆盖 ImageView
,但不是全部。某处有一个区域(圆形或矩形),应该是完全透明的。我尝试使用这行代码:
Paint paint = new Paint();
paint.setColor(Color.parseColor("#80000000"));
canvas.drawRect(0, 0, bitmap.getWidth(), bitmap.getHeight(), paint);
paint.setColor(Color.TRANSPARENT);
canvas.drawCircle((int) x, (int) y, 50, paint);
但它没有用,因为圆圈下面是矩形。
有没有办法实现我想要的?
抱歉回答晚了。
您可以通过制作 CustomImageView 并按照以下步骤来实现。
public class CustomImageView extends ImageView {
private Paint paint;
private Paint transParentPaint;
private Canvas tempCanvas;
private Bitmap emptyBitmap;
public CustomImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
public CustomImageView(Context context) {
super(context);
init();
}
public CustomImageView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
private void init() {
paint = new Paint();
paint.setColor(Color.parseColor("#80000000")); //Semi TransParent Paint
transParentPaint = new Paint();
transParentPaint.setColor(Color.TRANSPARENT);
transParentPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));//This is necessary to make the portion transparent. Otherwise it will show Black.
}
@Override
protected void onDraw(Canvas canvas) {
emptyBitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
tempCanvas = new Canvas(emptyBitmap);
emptyBitmap.eraseColor(Color.TRANSPARENT);
// tempCanvas.drawColor(Color.parseColor("#80000000"));
tempCanvas.drawRect(0, 0, getWidth(), getHeight(), paint);
tempCanvas.drawCircle(getWidth() / 2, getHeight() / 2, 100, transParentPaint); // Set the circle at the middle of the Canvas.
canvas.drawBitmap(emptyBitmap, 0, 0, null);
}
}
将此 CustomImageView 添加到您的布局文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
>
<transparent.example.com.partialtransparentview.CustomImageView
android:id="@+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/your_image" />
</RelativeLayout>
它将如您所愿地工作。
我正在尝试实现这种效果:
我的想法是,我想用部分透明层覆盖 ImageView
,但不是全部。某处有一个区域(圆形或矩形),应该是完全透明的。我尝试使用这行代码:
Paint paint = new Paint();
paint.setColor(Color.parseColor("#80000000"));
canvas.drawRect(0, 0, bitmap.getWidth(), bitmap.getHeight(), paint);
paint.setColor(Color.TRANSPARENT);
canvas.drawCircle((int) x, (int) y, 50, paint);
但它没有用,因为圆圈下面是矩形。 有没有办法实现我想要的?
抱歉回答晚了。 您可以通过制作 CustomImageView 并按照以下步骤来实现。
public class CustomImageView extends ImageView {
private Paint paint;
private Paint transParentPaint;
private Canvas tempCanvas;
private Bitmap emptyBitmap;
public CustomImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
public CustomImageView(Context context) {
super(context);
init();
}
public CustomImageView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
private void init() {
paint = new Paint();
paint.setColor(Color.parseColor("#80000000")); //Semi TransParent Paint
transParentPaint = new Paint();
transParentPaint.setColor(Color.TRANSPARENT);
transParentPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));//This is necessary to make the portion transparent. Otherwise it will show Black.
}
@Override
protected void onDraw(Canvas canvas) {
emptyBitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
tempCanvas = new Canvas(emptyBitmap);
emptyBitmap.eraseColor(Color.TRANSPARENT);
// tempCanvas.drawColor(Color.parseColor("#80000000"));
tempCanvas.drawRect(0, 0, getWidth(), getHeight(), paint);
tempCanvas.drawCircle(getWidth() / 2, getHeight() / 2, 100, transParentPaint); // Set the circle at the middle of the Canvas.
canvas.drawBitmap(emptyBitmap, 0, 0, null);
}
}
将此 CustomImageView 添加到您的布局文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
>
<transparent.example.com.partialtransparentview.CustomImageView
android:id="@+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/your_image" />
</RelativeLayout>
它将如您所愿地工作。