1.创建类继承View
public class MyCustomCircleArrowView extends View {
//创建画笔
private Paint paint;
//从xml中获取的颜色
private int circleBoundColor;
private float circleBoundWidth;
//当前画笔画圆的颜色
private int CurrenCircleBoundColor;
public MyCustomCircleArrowView(Context context) {
super(context);
}
public MyCustomCircleArrowView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
initVeiw(context);
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.MyCustomCircleArrowView);
for (int i = 0; i < typedArray.getIndexCount(); i++) {
//就是我们自定义的属性的资源id
int attr = typedArray.getIndex(i);
switch (attr) {
case R.styleable.MyCustomCircleArrowView_circlr_bound_color:
circleBoundColor = typedArray.getColor(attr, Color.RED);
CurrenCircleBoundColor = circleBoundColor;
break;
case R.styleable.MyCustomCircleArrowView_circlr_bound_width:
circleBoundWidth = typedArray.getDimension(attr, 3);
break;
}
}
}
private void initVeiw(Context context) {
paint = new Paint();
}
public void setColor(int color) {
if (CurrenCircleBoundColor != color) {
CurrenCircleBoundColor = color;
} else {
CurrenCircleBoundColor = circleBoundColor;
}
}
//设置圆心位置
private int pivotX;
private int pivotY;
private float currentDegree = 0;//旋转的度数
private float radius=130;//半径
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
paint.setAntiAlias(true);
paint.setColor(CurrenCircleBoundColor);//给画笔设置颜色
paint.setStrokeWidth(circleBoundWidth);//获取圆的宽度
pivotX = getWidth()/2;//获取屏幕的宽
pivotY = getHeight()/2;//获取屏幕的高
canvas.drawCircle(pivotX,pivotY,radius,paint);//画圆
//创建
canvas.save();
//旋转画布 , 如果旋转的的度数大的话,视觉上看着是旋转快的
canvas.rotate(currentDegree, pivotX, pivotY);
//提供了一些api可以用来画线(画路径)
Path path = new Path();
//从哪开始画 从A开始画
path.moveTo(pivotX + radius, pivotY);
//从A点画一个直线到D点
path.lineTo(pivotX + radius - 20, pivotY - 20);
//从D点画一个直线到B点
path.lineTo(pivotX + radius, pivotY + 20);
//从B点画一个直线到C点
path.lineTo(pivotX + radius + 20, pivotY - 20);
//闭合 -- 从C点画一个直线到A点
path.close();
paint.setStyle(Paint.Style.FILL);//图的样式
paint.setColor(Color.BLACK);//图的背景色
canvas.drawPath(path, paint);//使用画笔画圆
canvas.restore();
//旋转的度数一个一个度数增加, 如果乘以一个速度的话,按一个速度速度增加
currentDegree += 1 * currentSpeed;
if (!isPause) {
invalidate();//重置
}
}
private int currentSpeed = 1;
private boolean isPause = false;
public void speed() {
++currentSpeed;
if (currentSpeed >= 10) {
currentSpeed = 10;
Toast.makeText(getContext(), "我比闪电还快", Toast.LENGTH_SHORT).show();
}
}
public void slowDown() {
--currentSpeed;
if (currentSpeed <=1) {
currentSpeed = 1;
}
}
public void pauseOrStart() {
//如果是开始状态的话去重新绘制
if (isPause) {
isPause = !isPause;
invalidate();
} else {
isPause = !isPause;
}
}
}
2.通过xml来创建给自定义控件添加颜色和宽度
在values中添加attrs.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="MyCustomCircleArrowView">
<attr name="circlr_bound_width" format="dimension"></attr>
<attr name="circlr_bound_color" format="color"></attr>
</declare-styleable>
</resources>
3.创建自定义控件之后在布局当中直接调用自定义的控件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="加速"
android:id="@+id/button" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="减速"
android:layout_below="@+id/button"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:id="@+id/button2" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="改变背景颜色"
android:layout_below="@+id/button2"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:id="@+id/button3" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="开始/停止"
android:layout_below="@+id/button3"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:id="@+id/button4" />
<zss.bwie.com.zidinyiview.MyCustomCircleArrowView
android:id="@+id/my_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:circlr_bound_color="@color/colorAccent"
app:circlr_bound_width="3dp"
android:layout_below="@+id/button4"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
4.在Activity中获取进行展示
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private Button jiasu;//加速
private Button jiansu;//减速
private Button bianse;//变色
private MyCustomCircleArrowView myCustomCircleArrowView;
private Button tingzhi;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//初始化布局控件
isitView();
}
//获取布局控件
private void isitView() {
jiasu = (Button) findViewById(R.id.button);
jiansu = (Button) findViewById(R.id.button2);
bianse = (Button) findViewById(R.id.button3);
myCustomCircleArrowView = (MyCustomCircleArrowView) findViewById(R.id.my_view);
tingzhi = (Button) findViewById(R.id.button4);
jiasu.setOnClickListener(this);
jiansu.setOnClickListener(this);
bianse.setOnClickListener(this);
tingzhi.setOnClickListener(this);
}
@Override
public void onClick(View view) {
switch (view.getId()){
case R.id.button:
myCustomCircleArrowView.speed();
break;
case R.id.button2:
myCustomCircleArrowView.slowDown();
break;
case R.id.button3:
myCustomCircleArrowView.setColor(Color.BLUE);
break;
case R.id.button4:
myCustomCircleArrowView.pauseOrStart();//停止
}
}
}
就会展示一个三角在圆上转动可加速减速停止开始