用多种颜色绘制路径

Question

我正在使用 android.graphics.Path 在 android.graphics.Canvas 上绘图。我希望允许用户使用一系列颜色和笔划宽度进行绘制，但是，每当颜色或笔划宽度发生更改时，所有内容都会使用新的颜色或笔划宽度重新绘制。我怎样才能解决这个问题？

xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/btnW10"
            android:layout_margin="3sp"
            android:layout_weight="1"
            android:text="Width10"/>
        <Button
            android:id="@+id/btnW40"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_margin="3sp"
            android:layout_weight="1"
            android:text="Width40"/>
        <Button
            android:id="@+id/btnW70"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_margin="3sp"
            android:layout_weight="1"

            android:text="Width70"/>

    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="20dp"></LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_margin="3sp"
            android:layout_weight="1"
            android:id="@+id/btnBlue"
            android:text="Blue"/>
        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_margin="3sp"
            android:layout_weight="1"
            android:id="@+id/btnRed"
            android:text="Red"/>
        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_margin="3sp"
            android:layout_weight="1"

            android:id="@+id/btnGreen"
            android:text="Green"/>

    </LinearLayout>

    <com.vladislav.canvaswc.DrawLine
        android:id="@+id/drwLine"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />

</LinearLayout>

main.java:

public class MainActivity extends AppCompatActivity implements View.OnClickListener
{
   DrawLine dr;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Button btnB=(Button) findViewById(R.id.btnBlue);
        Button btnG=(Button) findViewById(R.id.btnGreen);
        Button btnR=(Button) findViewById(R.id.btnRed);
        Button btnW10=(Button) findViewById(R.id.btnW10);
        Button btnW40=(Button) findViewById(R.id.btnW40);
        Button btnW70=(Button) findViewById(R.id.btnW70);
        dr =(DrawLine) findViewById(R.id.drwLine);
        btnB.setOnClickListener(this);
        btnG.setOnClickListener(this);
        btnR.setOnClickListener(this);
        btnW10.setOnClickListener(this);
        btnW40.setOnClickListener(this);
        btnW70.setOnClickListener(this);
    }


    @Override
    public void onClick(View v) {
        switch(v.getId())
        {
            case R.id.btnBlue : dr.changeColor(Color.BLUE);break;
            case R.id.btnGreen : dr.changeColor(Color.GREEN);break;
            case R.id.btnRed : dr.changeColor(Color.RED);break;
            case R.id.btnW10 : dr.changeWidth(10f);break;
            case R.id.btnW40 : dr.changeWidth(40f);break;
            case R.id.btnW70 : dr.changeWidth(70f);break;
        }
    }
}

drawline.java ChangeWidthColor 它是我的接口，有 2 个方法 changeColor() 和 changeWidth()

public class DrawLine extends View implements ChangeWidthColor {

    private Paint paint = new Paint();
    private Path path = new Path();
    public float x;
    public float y;

    public DrawLine(Context context) {
        super(context);
        init(context);

    }

    public DrawLine(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    public DrawLine(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context);
    }

    public void init(Context context) {

        //paint.setColor(Color.BLACK);
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeJoin(Paint.Join.MITER);
        //paint.setStrokeWidth(5f);

    }

    @Override
    public void changeColor(int color) {
        paint.setColor(color);


    }

    @Override
    public void changeWidth(float width) {
        paint.setStrokeWidth(width);

    }


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

    }


    @Override
    public boolean onTouchEvent(MotionEvent event) {


        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                x= event.getX();
                y= event.getY();
                path.moveTo(x, y);
                break;
            case MotionEvent.ACTION_MOVE:
                x= event.getX();
                y= event.getY();
                path.lineTo(x, y);
                invalidate();
                break;
            case MotionEvent.ACTION_UP:
                invalidate();
                break;
        }
        invalidate();
        return true;
    }
}

Answer 1

该解决方案维护一个路径对象列表和一个用于存储颜色的整数列表。这些列表是并行的 - 每个列表中有 1 个条目用于路径和颜色对。onDraw 迭代这些列表，用相应的颜色绘制每个路径。

每次用户单击更改颜色时，都会创建一个新路径。ACTION_DOWN 和 ACTION_MOVE 在路径上调用 moveTo(x,y) 和 lineTo(x,y)，ACTION_UP 导致将 Path 和当前颜色添加到列表中。

注意：我还没有实现笔画宽度的解决方案，但是，您应该能够按照示例自行添加。

public class DrawLine extends View {

    private Path path = new Path();
    private Paint paint = new Paint();
    private int currentColor = Color.BLACK;
    private List<Path> paths = new ArrayList<Path>();
    private List<Integer> colors = new ArrayList<Integer>();
    private float x;
    private float y;

    public DrawLine(Context context) {
        super(context);
        init(context);
    }

    public DrawLine(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    public DrawLine(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context);
    }

    public void init(Context context) {
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeJoin(Paint.Join.MITER);
        paint.setColor(currentColor);
    }

    public void changeColor(int color) {
        currentColor = color;
        path = new Path();
    }

    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        for (int x = 0; x < paths.size(); x++) {
            paint.setColor(colors.get(x));
            canvas.drawPath(paths.get(x), paint);
        }
    }

    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                x = event.getX();
                y = event.getY();
                path.moveTo(x, y);
                break;
            case MotionEvent.ACTION_MOVE:
                x = event.getX();
                y = event.getY();
                path.lineTo(x, y);
                invalidate();
                break;
            case MotionEvent.ACTION_UP:
                paths.add(path);
                colors.add(currentColor);
                invalidate();
                break;
        }
        invalidate();
        return true;
    }
}

`