自定义控件，实现正方形套圆环内套圆形图片

来源：互联网发布：js循环读取txt文件内容编辑：程序博客网时间：2024/04/30 03:53

自定义控件，实现正方形套圆环内套圆形图片

说到自定义View有的时候，属实让人头疼，今天得到一位大神的指点，自己实现了一定的效果。

接下来我们一起看一下效果图：

效果图也就是这样的，可是具体代码是如何实现的呢，接下来看代码。

1.首先，自定义View吗，那就要创建一个自己的类来继承View，实现构造方法，进行一些计算。

public class Custom_View extends View{    private SetOnWhat sow;    private int one;    private int two;    private int three;    private int RX;    private int RY;    private float width;    private int rect;    public Custom_View(Context context) {        super(context);    }    public Custom_View(Context context, AttributeSet attrs) {        super(context, attrs);    }    public Custom_View(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        int x = getWidth();        int y = getHeight();        rect = x*3/4;        int R = rect*8/25;        width = R*3/8;        RX = x/2;        RY = y/2;        int r = rect/2 - (int) (width*2);        one = r;        two = (int) (r+width);        three = (int)(r+width*2);        int left = (x - rect)/2;        int right = left + rect;        int top = (y - rect)/2;        int bottom = top + rect;        Paint paint = new Paint();        paint.setColor(Color.GREEN);        paint.setStrokeWidth(width);        paint.setAntiAlias(true);        canvas.drawRect(left, top, right, bottom, paint);        paint.setColor(Color.WHITE);        canvas.drawCircle(RX, RY, r, paint);        paint.setStyle(Paint.Style.STROKE);        paint.setColor(Color.RED);        canvas.drawCircle(RX, RY, R, paint);        paint.setColor(Color.BLUE);        canvas.drawCircle(RX, RY, R+width, paint);    }    @Override    public boolean onTouchEvent(MotionEvent event) {        int x = (int) event.getX();        int y = (int) event.getY();        float rawX = event.getRawX();        float rawY = event.getRawY();        int action = event.getAction();        if(action==MotionEvent.ACTION_DOWN||action==MotionEvent.ACTION_MOVE){            if (x + getLeft() < getRight() && y + getTop() < getBottom()) {                int type = 0;                int distance = getDistance(x, y);                if(distance<=one*one){                    type = 0;                }else if(distance>one&&distance<=two*two){                    type = 1;                }else if(distance>two&&distance<=three*three){                    type = 2;                }else if(x>=(RX - rect/2)&&x<=(RX + rect/2)&&y>=(RY - rect/2)&&y<=(RY+rect/2)){                    type = 3;                }else {                    type = 4;                }                if(sow!=null){                    sow.onWhat(type);                }            }        }        return true;    }    private int getDistance(int x, int y){        return (x-RX)*(x-RX) + (y-RY)*(y-RY);    }    public interface SetOnWhat{        void onWhat(int type);    }    public void getOnWhat(SetOnWhat sow){        this.sow = sow;    }}

2.写布局文件，布局文件如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context=".activity.TestActivity">    <com.nababy.yuekaolianxi.view.Custom_View        android:id="@+id/cv"        android:layout_width="match_parent"        android:layout_height="match_parent" />    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/tv_color"        android:textSize="20sp"        android:layout_centerInParent="true"        android:text="ewrfewt"        android:layout_marginTop="10dp"/></RelativeLayout>

3.Activity中代码如下：

public class TestActivity extends AppCompatActivity {    private TextView tv;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_test);        tv = (TextView) findViewById(R.id.tv_color);        setText("一家人");        Custom_View cv = (Custom_View) findViewById(R.id.cv);        cv.getOnWhat(new Custom_View.SetOnWhat() {            @Override            public void onWhat(int type) {                switch (type) {                    case 0:                        Toast.makeText(TestActivity.this, "这里是白色", Toast.LENGTH_SHORT).show();                        break;                    case 1:                        Toast.makeText(TestActivity.this, "这里是红色", Toast.LENGTH_SHORT).show();                        break;                    case 2:                        Toast.makeText(TestActivity.this, "这里是蓝色", Toast.LENGTH_SHORT).show();                        break;                    case 3:                        Toast.makeText(TestActivity.this, "这里是绿色", Toast.LENGTH_SHORT).show();                        break;                    case 4:                        Toast.makeText(TestActivity.this, "这..这里是哪里?", Toast.LENGTH_SHORT).show();                        break;                    default:                        break;                }            }        });    }    private void setText(String message){        tv.setText(message);    }}

好了，可以去运行一下demo试一下嘛！！！

1 0