如何在单击按钮时在自定义视图中绘制圆圈

How to draw a circle in custom view on button click

我有一个名为 add 的按钮,单击它时需要在我的自定义视图上绘制一个点,并且无论何时单击该按钮,它都不会 运行 代码..

我已经在自定义视图中实现了 OnClickListener,但它仍然存在问题。我对自定义视图还是陌生的,所以任何帮助将不胜感激。

LineGraphView.Java

public class LineGraphView extends View implements View.OnClickListener {

int mPointColor, mMaxColor, mLineColor;
Paint mPointPaint, mMaxPaint, mLinePaint, mBodyPaint, mAxisPaint, 
 mTextPaint;
float mCircleRadius;

public LineGraphView(Context context, AttributeSet attrs) {
    super(context, attrs);
    this.setOnClickListener(this);

    TypedArray array = context.obtainStyledAttributes(attrs, 
     R.styleable.LineGraphView);
    mPointColor = array.getColor(R.styleable.LineGraphView_pointColor, 
    Color.GRAY);
    mMaxColor = array.getColor(R.styleable.LineGraphView_maxColor, 
    Color.BLUE);
    mLineColor = array.getColor(R.styleable.LineGraphView_lineColor, 
  Color.BLUE);

    array.recycle();

    initPaints();
}

private void initPaints() {
    mPointPaint = new Paint();
    mPointPaint.setColor(mPointColor);

    mMaxPaint = new Paint();
    mMaxPaint.setColor(mMaxColor);

    mLinePaint = new Paint();
    mLinePaint.setColor(mLineColor);

    mBodyPaint = new Paint();
    mBodyPaint.setColor(Color.WHITE);

    mAxisPaint = new Paint();
    mAxisPaint.setColor(Color.BLACK);
    mAxisPaint.setStrokeWidth(5);

    mTextPaint = new Paint();
    mTextPaint.setColor(Color.BLACK);
    mTextPaint.setTextSize(30);
}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    //X Axis
    canvas.drawLine(50, dpToPx(190), dpToPx(400), dpToPx(190),mAxisPaint);
    //Y Axis
    canvas.drawLine(50,50,50,dpToPx(190),mAxisPaint);

    int centerX = getWidth()/2;
    //TESTING draw points
    //canvas.drawCircle(centerX, 100, 20, mPointPaint);

    canvas.drawText("0",25,dpToPx(190),mTextPaint);
}

@Override
public void onClick(View v) {
    Button add = findViewById(R.id.addBtn);
    //if (v==add) {
        Canvas canvas=new Canvas();
        canvas.drawCircle(50,50,50,mPointPaint);
        invalidate();
    Toast.makeText(getContext(), "Add button clicked!!",
            Toast.LENGTH_LONG).show();
    //}
}

//Convert dp to pixels
private int dpToPx(int dpValue) {
    return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dpValue, getContext().getResources().getDisplayMetrics());
}
//Round number up to nearest multiple input
int round(double num, int multipleOf){
    return (int)Math.ceil(num/multipleOf) * multipleOf;
}
}

我的Activitymain.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<com.mdadi.graphview.LineGraphView
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:id="@+id/graphView"
    android:layout_alignParentTop="true"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/date"
    android:id="@+id/date_desc"
    android:layout_alignEnd="@+id/students_desc"
    android:layout_below="@+id/graphView" />

<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/graphView"
    android:id="@+id/date_input"
    android:layout_alignParentEnd="true"
    android:inputType="date"
    android:layout_toEndOf="@+id/date_desc"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/students"
    android:id="@+id/students_desc"
    android:layout_below="@+id/date_input"/>

<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/students_input"
    android:layout_below="@+id/date_input"
    android:inputType="number"
    android:layout_toEndOf="@+id/students_desc"/>

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/add"
    android:layout_below="@+id/date_input"
    android:id="@+id/addBtn"
    android:layout_marginTop="50dp"
    android:layout_centerHorizontal="true"/>

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/clear"
    android:layout_toEndOf="@+id/addBtn"
    android:id="@+id/clear"
    android:layout_below="@+id/date_input"
    android:layout_marginTop="50dp" />

<CheckBox
    android:id="@+id/show_lines"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/select_show_lines"
    android:layout_below="@+id/addBtn"/>

<CheckBox
    android:id="@+id/highlight_integral"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/show_lines"
    android:text="@string/select_highlight_integral"/>

<SeekBar
    android:id="@+id/radius_adjuster"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:min="5"
    android:max="10"
    android:layout_below="@+id/highlight_integral"
    />

  </RelativeLayout>

问题:此块代码使您的应用无法运行。

@Override
public void onClick(View v) {
    Button add = findViewById(R.id.addBtn);
    //if (v==add) {
        Canvas canvas=new Canvas();
        canvas.drawCircle(50,50,50,mPointPaint);
        invalidate();
    Toast.makeText(getContext(), "Add button clicked!!",
            Toast.LENGTH_LONG).show();
    //}
}

您正在创建一个新的 canvas 并在其上绘制而不是当前视图的 canvas。

解决方法:可以按以下步骤进行

第一步:在自定义视图class.[=14=中定义一个class ]

public class LineGraphView extends View implements View.OnClickListener {

...

class Circle {
    float cx;
    float cy;
    float radius;
}

Circle mCircle;

...

}

第二步:修改onDraw()方法

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    //X Axis
    canvas.drawLine(50, dpToPx(190), dpToPx(400), dpToPx(190), mAxisPaint);
    //Y Axis
    canvas.drawLine(50, 50, 50, dpToPx(190), mAxisPaint);

    int centerX = getWidth() / 2;
    //TESTING draw points
    //canvas.drawCircle(centerX, 100, 20, mPointPaint);

    canvas.drawText("0", 25, dpToPx(190), mTextPaint);

    // Add this line.
    if (mCircle != null) {
        canvas.drawCircle(mCircle.cx, mCircle.cy, mCircle.radius, mPointPaint);
    }
}

步骤 3: 更改 onClick() 方法中的代码。

@Override
public void onClick(View v) {
    if (mCircle == null) {
        mCircle = new Circle();
    }
    mCircle.cx = 50;
    mCircle.cy = 50;
    mCircle.radius = 50;

    // This will call onDraw() method under the hood.
    invalidate();

    // For debugging.
    Toast.makeText(getContext(), "Add button clicked!!", Toast.LENGTH_LONG).show();
}