【问题标题】:Canvas drawing with gradient fill and curvy shape具有渐变填充和曲线形状的画布绘图
【发布时间】:2018-05-31 07:05:47
【问题描述】:

我的问题标题似乎很常见..但这与其他问题不同..我尝试了很多解决方案,但还没有得到完美的解决方案。也无法理解绘图功能。

这是我迄今为止尝试过的:

public class DrawingActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_drawing);

        ImageView img=(ImageView) findViewById(R.id.img);


        Bitmap bitmap = Bitmap.createBitmap(
                1000, // Width
                300, // Height
                Bitmap.Config.ARGB_8888 // Config
        );

        // Initialize a new Canvas instance
        Canvas canvas = new Canvas(bitmap);

        // Draw a solid color on the canvas as background
        canvas.drawColor(Color.LTGRAY);

        // Initialize a new Paint instance to draw the line
        Paint paint = new Paint();
        // Line color
        paint.setColor(Color.RED);
        paint.setStyle(Paint.Style.STROKE);
        // Line width in pixels
        paint.setStrokeWidth(8);
        paint.setAntiAlias(true);


        final RectF oval = new RectF();

        // Set a pixels value to offset the line from canvas edge
        int offset = 0;

        canvas.drawLine(
                offset, // startX
                canvas.getHeight() / 2, // startY
                300, // stopX
                canvas.getHeight() / 2, // stopY
                paint // Paint
        );


        oval.set(250, 100, 300,200);

        canvas.drawArc(oval, 90, -(float) 90, false,paint);


        oval.set(450, 300, 500,350);

        canvas.drawArc(oval, 90, -(float) 90, false,paint);

        canvas.drawLine(
                300, // startX
                canvas.getHeight() -50, // startY
                1000, // stopX
                canvas.getHeight() -50, // stopY
                paint // Paint
        );

        // Display the newly created bitmap on app interface
        img.setImageBitmap(bitmap);
    }

}

我的输出:

所以我的问题是:

  1. 如果有人可以解释其要点或示例代码,我想根据预期输出绘制曲线。
  2. 想知道绘制弧左、上、右、下点(我已阅读文档,但它只是告诉它们是浮动的,没有描述)。
  3. 我想用渐变色填充这个形状,只是这个形状而不是整个画布。

任何建议将不胜感激。谢谢!

【问题讨论】:

  • Canvas#drawPath
  • @pskink 抱歉,如果可能的话,请用一些代码解释一下.. 因为我目前正在尝试这个并且没有得到任何结果:(
  • 所以使用 Path 对象发布您的代码
  • @pskink 我第一次尝试画布,所以不知道路径,也不知道如何使用它。我会尝试阅读文档并回复你
  • 例如见this

标签: android android-layout android-canvas draw curve


【解决方案1】:

使用路径可以绘制贝塞尔路径。

检查我的努力如下。

 private class MyDrawView extends View {
    Paint paint;
    Path mPath;

    public MyDrawView(Context context) {
        this(context, null);

    }

    public MyDrawView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);

        mPath = new Path();
        mPath.moveTo(200, 200);
        mPath.lineTo(200, 100);
        mPath.lineTo(600, 100);
        mPath.lineTo(600, 300);
        mPath.lineTo(300, 300);
        mPath.cubicTo(250, 270, 400, 170, 200, 200);

        paint = new Paint();
        paint.setColor(Color.BLACK);
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(8);
        paint.setStrokeCap(Paint.Cap.ROUND);
        paint.setStrokeJoin(Paint.Join.ROUND);
        paint.setPathEffect(new CornerPathEffect(10));
        paint.setAntiAlias(true);


    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawPath(mPath, paint);
        invalidate();
    }
}

初始化这个自定义视图并添加到您的框架布局中。喜欢,

 MyDrawView myDrawView = new MyDrawView(this);
 frmCustom.addView(myDrawView);

【讨论】:

  • 你能告诉我一件事,如何在活动中使用这个类吗?我的意思是只需要创建对象?
  • 并在 mydrawview 类中使用它来获得渐变色。 protected void onSizeChanged(int w, int h, int oldw, int oldh) { paint.setShader(new LinearGradient(0 ,0 ,w, h, Color.BLUE, Color.RED, Shader.TileMode.MIRROR)); }
  • 嘿,我想再问一件事,我想在这个形状下面添加相同的形状,看起来像阴影......所以我需要在 moveTo 中调整 dy 吗?或任何建议请