今天产品中要实现这样的需求,想了想还是把它给整出来了!
第一步:自定义View
实现步骤:
1、先画好圆弧
2、再画第一根线
3、最后再画第二根线
1. /**
2. * DrawHook
3. * Created by Zane on 2015/3/4.
4. */
5. public class DrawHookView extends View {
6. //绘制圆弧的进度值
7. private int progress = 0;
8. //线1的x轴
9. private int line1_x = 0;
10. //线1的y轴
11. private int line1_y = 0;
12. //线2的x轴
13. private int line2_x = 0;
14. //线2的y轴
15. private int line2_y = 0;
16.
17. public DrawHookView(Context context) {
18. super(context);
19. }
20.
21. public DrawHookView(Context context, AttributeSet attrs) {
22. super(context, attrs);
23. }
24.
25. public DrawHookView(Context context, AttributeSet attrs, int defStyle) {
26. super(context, attrs, defStyle);
27. }
28.
29. //绘制
30.
31. @Override
32. protected void onDraw(Canvas canvas) {
33. super.onDraw(canvas);
34.
35. progress++;
36.
37. /**
38. * 绘制圆弧
39. */
40. new Paint();
41. //设置画笔颜色
42. paint.setColor(getResources().getColor(R.color.arc_blue));
43. //设置圆弧的宽度
44. 5);
45. //设置圆弧为空心
46. paint.setStyle(Paint.Style.STROKE);
47. //消除锯齿
48. true);
49.
50. //获取圆心的x坐标
51. int center = getWidth() / 2;
52. int center1 = center - getWidth() / 5;
53. //圆弧半径
54. int radius = getWidth() / 2 - 5;
55.
56. //定义的圆弧的形状和大小的界限
57. new RectF(center - radius -1, center - radius -1 ,center + radius + 1, center + radius + 1);
58.
59. //根据进度画圆弧
60. 235, -360 * progress / 100, false, paint);
61.
62. /**
63. * 绘制对勾
64. */
65. //先等圆弧画完,才话对勾
66. if(progress >= 100) {
67. if(line1_x < radius / 3) {
68. line1_x++;
69. line1_y++;
70. }
71. //画第一根线
72. canvas.drawLine(center1, center, center1 + line1_x, center + line1_y, paint);
73.
74. if (line1_x == radius / 3) {
75. line2_x = line1_x;
76. line2_y = line1_y;
77. line1_x++;
78. line1_y++;
79. }
80. if (line1_x >= radius / 3 && line2_x <= radius) {
81. line2_x++;
82. line2_y--;
83. }
84. //画第二根线
85. 1, center + line1_y, center1 + line2_x, center + line2_y, paint);
86. }
87.
88. //每隔10毫秒界面刷新
89. 10);
90. }
91. }
第二步:布局文件引用自定义View
1. <?xml version="1.0" encoding="utf-8"?>
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. android:orientation="vertical"
4. android:layout_width="fill_parent"
5. android:layout_height="fill_parent"
6. android:background="@color/color_fff"
7. >
8. <com.offcn.DrawHookViewDemo.DrawHookView
9. android:layout_width="90dp"
10. android:layout_height="90dp"
11. android:layout_centerInParent="true"
12. />
13. </RelativeLayout>
附colors.xml:
1. <?xml version="1.0" encoding="utf-8"?>
2. <resources>
3. <color name="arc_blue">#10a679</color>
4. <color name="color_fff">#ffffff</color>
5. </resources>
示例代码戳Here
https://github.com/ZaneLove/DrawHookView