Question

我有一个按钮，我想在点击它之后逐渐在它周围画一个圆角矩形。我尝试在画布中绘制贝塞尔曲线但是我找不到可以绘制圆角矩形的贝塞尔曲线的公式。所以我最终绘制了四条直线来创建一个没有圆角的矩形。以下是相关代码：

public class CustomProgressBar extends View{

private Paint paint = new Paint();
public HomeFragment mHomeFragment;
private Context context;
private Path path;
int width = 178;
int height = 58;
int x1=0;
int y1=0;
int x2=width;
int y2=0;
int x3=width;
int y3=height;
int x4=0;
int y4=height;
int currentLine=0;
int stepLength = 8;

public CustomProgressBar(Context context) {
    super( context );

}

public CustomProgressBar(Context context, AttributeSet attrs) {

    super( context, attrs );
    this.context = context;
}

public CustomProgressBar(Context context, AttributeSet attrs, int defStyle) {

    super( context, attrs, defStyle );
}

public void init(HomeFragment homeFragment){
    this.mHomeFragment = homeFragment;
    paint.setStyle(Paint.Style.STROKE);
    paint.setStrokeWidth(6);
    paint.setColor(Color.rgb(203,156,76));
    setCoordinates();
}

public void setCoordinates(){
    new Thread(new Runnable() {
        @Override
        public void run() {
            while (true){
                switch (currentLine){
                    case 0:
                        if(x1<width) {
                            x1 += stepLength;
                        }else {
                            currentLine = 1;
                        }
                        break;
                    case 1:
                        if(y2<=height){
                            y2 += stepLength;
                        }else {
                            currentLine = 2;
                        }
                        break;
                    case 2:
                        if(x3>=0){
                            x3 -= stepLength;
                        }else {
                            currentLine = 3;
                        }
                        break;
                    case 3:
                        if(y4 >= 0){
                            y4 -= stepLength;
                        }else {
                            currentLine = 0;
                            x1 = 0;
                            y2 = 0;
                            x2 = width;
                            y2 = 0;
                            x3 = width;
                            y3 = height;
                            x4 = 0;
                            y4 = height;
                        }
                        break;
                }
                mHomeFragment.getActivity().runOnUiThread(new Runnable() {
                    @Override
                    public void run() {
                        invalidate();
                    }
                });
                try {
                    Thread.sleep(50);
                } catch (InterruptedException e) {
                    e.printStackTrace();
                }
            }

        }
    }).start();

}


int max=100;
int progress=20;
@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    switch (currentLine){
        case 0:
            canvas.drawLine(0, 0, x1, y1, paint);
            break;
        case 1:
            canvas.drawLine(0, 0, x1, y1, paint);
            canvas.drawLine(width, 0, x2, y2, paint);
            break;
        case 2:
            canvas.drawLine(0, 0, x1, y1, paint);
            canvas.drawLine(width, 0, x2, y2, paint);
            canvas.drawLine(width, height, x3, y3, paint);
            break;
        case 3:
            canvas.drawLine(0, 0, x1, y1, paint);
            canvas.drawLine(width, 0, x2, y2, paint);
            canvas.drawLine(width, height, x3, y3, paint);
            canvas.drawLine(0, height, x4, y4, paint);
            break;

    }
}
}

有谁知道如何用画布绘制圆角矩形？非常感谢任何帮助！

Answer 1

你应该使用drawRoundRect（）

canvas.drawRoundRect(rect, rx, ry, paint);

Answer 2

似乎没有太多关于如何在互联网上绘制圆形矩形的信息。所以我修改了一个由@pskink引入java版本的js demo。以下是完整代码：

filter {
#ignore log comments
if [message] =~ "^#" {
drop {}
}

grok {
patterns_dir => "./patterns"
match => ["message", "%{DATA:extras}<LoadID%{DATA:extra}>%{DATA:ASNNumber}%{GREEDYDATA:behind}"]
}
date {
match => [ "timestamp", "yyyy-MM-dd HH:mm:ss" ]
locale => "en"
}
}

Second filter
filter {
if "_grokparsefailure" in [tags] {
drop { }
} else {
# on success remove the message field to save space
mutate {
remove_field => ["message", "timestamp", "extra", "extras", "behind"]
}
}
}

如何使用画布逐渐绘制圆角矩形

2 个答案: