如何以编程方式在 Android 中的按钮周围绘制平滑的笔划?

发布于 2024-12-12 18:16:03 字数 1991 浏览 1 评论 0原文

我试图在渐变填充按钮周围绘制平滑的抗锯齿笔划,但角落变得非常难看。这是我的代码:

import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.drawable.ShapeDrawable;
import android.graphics.drawable.shapes.Shape;

public class StrokeShapeDrawable extends ShapeDrawable {
    Paint fillpaint;
    Paint strokepaint;
    private static final int WIDTH = 1;

    public StrokeShapeDrawable(Shape s) {
        super(s);
        fillpaint = this.getPaint();
        strokepaint = new Paint(fillpaint);
        strokepaint.setAntiAlias(true);
        strokepaint.setStyle(Paint.Style.STROKE);
        strokepaint.setStrokeWidth(WIDTH);
        strokepaint.setARGB(255, 0, 0, 0);
    }

    @Override
    protected void onDraw(Shape shape, Canvas canvas, Paint fillpaint) {
        shape.draw(canvas, fillpaint);
        shape.draw(canvas, strokepaint);
    }

    public void setFillColour(int c) {
        fillpaint.setColor(c);
    }
}

按钮创建:

    ShapeDrawable.ShaderFactory sf = new ShapeDrawable.ShaderFactory() {
        @Override
        public Shader resize(int width, int height) {
            LinearGradient lg = new LinearGradient(0, 0, 0, mLoginBtn.getHeight(),
                new int[] { 
                    0xfff6f6f6, 
                    0xffd2d3d5, 
                    0xffc0c1c4, 
                    0xffc0c1c4},
                new float[] {
                    0, 0.45f, 0.55f, 1 },
                Shader.TileMode.REPEAT);
             return lg;
        }
    };

    float[] roundedCorner = new float[] {15, 15, 15, 15, 15, 15, 15, 15};
    StrokeShapeDrawable b = new StrokeShapeDrawable(new RoundRectShape(roundedCorner, null, null));
    b.setShaderFactory(sf);
    mLoginBtn.setBackgroundDrawable((Drawable)b);

我的按钮如下所示:

Button

不太好,有人有什么想法吗?

另外,我不想使用 XML 文件,因为我不确定是否可以在不使用 dp 指定渐变位置的情况下实现每个按钮 50% 的两个渐变(因为我想要 50-50 个渐变)。

谢谢!

I am trying to draw a smoothed antialiased stroke around a gradient-filled button but the corners gets really ugly. This is my code:

import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.drawable.ShapeDrawable;
import android.graphics.drawable.shapes.Shape;

public class StrokeShapeDrawable extends ShapeDrawable {
    Paint fillpaint;
    Paint strokepaint;
    private static final int WIDTH = 1;

    public StrokeShapeDrawable(Shape s) {
        super(s);
        fillpaint = this.getPaint();
        strokepaint = new Paint(fillpaint);
        strokepaint.setAntiAlias(true);
        strokepaint.setStyle(Paint.Style.STROKE);
        strokepaint.setStrokeWidth(WIDTH);
        strokepaint.setARGB(255, 0, 0, 0);
    }

    @Override
    protected void onDraw(Shape shape, Canvas canvas, Paint fillpaint) {
        shape.draw(canvas, fillpaint);
        shape.draw(canvas, strokepaint);
    }

    public void setFillColour(int c) {
        fillpaint.setColor(c);
    }
}

And the button creation:

    ShapeDrawable.ShaderFactory sf = new ShapeDrawable.ShaderFactory() {
        @Override
        public Shader resize(int width, int height) {
            LinearGradient lg = new LinearGradient(0, 0, 0, mLoginBtn.getHeight(),
                new int[] { 
                    0xfff6f6f6, 
                    0xffd2d3d5, 
                    0xffc0c1c4, 
                    0xffc0c1c4},
                new float[] {
                    0, 0.45f, 0.55f, 1 },
                Shader.TileMode.REPEAT);
             return lg;
        }
    };

    float[] roundedCorner = new float[] {15, 15, 15, 15, 15, 15, 15, 15};
    StrokeShapeDrawable b = new StrokeShapeDrawable(new RoundRectShape(roundedCorner, null, null));
    b.setShaderFactory(sf);
    mLoginBtn.setBackgroundDrawable((Drawable)b);

My button looks like this:

Button

Not very nice, anyone has any ideas?

Also I do not want to use a XML file since I am not sure it's possible to achieve two gradients with 50 precent each of the button without using dp's to specify gradient position (since I want to have 50-50 gradients).

Thanks!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

月光色 2024-12-19 18:16:03

在我看来,这是一种过于复杂的方法来实现相对简单的事情。我会使用 九补丁可绘制 - 它们非常适合你的任务。

This strikes me as an overly complex way to achieve something relatively simple. I would have used a nine-patch drawable instead - they are perfect for your task.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文