用透明圆创建视图
Create view with transparent circle
我想创建一个带有圆角和居中圆形按钮的视图。目前我正在使用一个带有圆形边框的矩形作为视图背景(绿色部分)和一个白色的圆形,其中包含按钮(带有 android 徽标的绿色按钮)。
只要背景(yellow/brown 目前,只是为了更好的可视化)与圆形的颜色相同,这就可以正常工作。
但现在我想使用渐变背景:用透明圆圈实现相同外观的聪明方法是什么?
我无法用正常的 android 形状创建相同的外观(我想到了圆角)。
用自定义视图解决了。它将绘制一个填充给定颜色的矩形。之后,将清除一个椭圆形。
我会 post 一个最小化的代码(没有自定义属性等),也许有一天它会对某人有所帮助:
public class InvertedCircleView extends View {
private Paint mPaint;
private float mCanvasCenterX;
private float mCenterCircleWidth, mCenterCircleHeight;
public InvertedCircleView(Context context, AttributeSet attrs) {
super(context, attrs);
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}
@Override
public void onDraw(Canvas canvas) {
super.onDraw(canvas);
mPaint.setColor(getResources().getColor(android.R.color.holo_green_dark));
mPaint.setStyle(Paint.Style.FILL);
canvas.drawPaint(mPaint);
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
mCenterCircleWidth = canvas.getWidth();
mCenterCircleHeight = canvas.getHeight();
mCanvasCenterX = canvas.getWidth() / 2;
canvas.drawOval(mCanvasCenterX - (mCenterCircleWidth / 2),
-mCenterCircleHeight,
mCanvasCenterX + (mCenterCircleWidth / 2),
mCenterCircleHeight,
mPaint);
}
}
我想创建一个带有圆角和居中圆形按钮的视图。目前我正在使用一个带有圆形边框的矩形作为视图背景(绿色部分)和一个白色的圆形,其中包含按钮(带有 android 徽标的绿色按钮)。
只要背景(yellow/brown 目前,只是为了更好的可视化)与圆形的颜色相同,这就可以正常工作。
但现在我想使用渐变背景:用透明圆圈实现相同外观的聪明方法是什么?
我无法用正常的 android 形状创建相同的外观(我想到了圆角)。
用自定义视图解决了。它将绘制一个填充给定颜色的矩形。之后,将清除一个椭圆形。
我会 post 一个最小化的代码(没有自定义属性等),也许有一天它会对某人有所帮助:
public class InvertedCircleView extends View {
private Paint mPaint;
private float mCanvasCenterX;
private float mCenterCircleWidth, mCenterCircleHeight;
public InvertedCircleView(Context context, AttributeSet attrs) {
super(context, attrs);
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}
@Override
public void onDraw(Canvas canvas) {
super.onDraw(canvas);
mPaint.setColor(getResources().getColor(android.R.color.holo_green_dark));
mPaint.setStyle(Paint.Style.FILL);
canvas.drawPaint(mPaint);
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
mCenterCircleWidth = canvas.getWidth();
mCenterCircleHeight = canvas.getHeight();
mCanvasCenterX = canvas.getWidth() / 2;
canvas.drawOval(mCanvasCenterX - (mCenterCircleWidth / 2),
-mCenterCircleHeight,
mCanvasCenterX + (mCenterCircleWidth / 2),
mCenterCircleHeight,
mPaint);
}
}