自定义View——画线、矩形、圆形、图像_latex 圆弧矩形

自定义View——画线、矩形、圆形、图像

2017年07月05日 09:37:10 Ah_JackChen 阅读数：530

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/cn_Jack_Chen/article/details/74375037

一、最简单的自定义View，什么都不显示，但是有View的特性

com.cctvjiatao.customview.MainActivity

 

[java] view plain copy

1. package com.cctvjiatao.customview;  
2.   
3. import android.app.Activity;  
4. import android.os.Bundle;  
5.   
6. public class MainActivity extends Activity {  
7.   
8.     @Override  
9.     protected void onCreate(Bundle savedInstanceState) {  
10.         super.onCreate(savedInstanceState);  
11.         setContentView(R.layout.activity_main);  
12.     }  
13.   
14. }  

com.cctvjiatao.customview.v1.CustomView1

 

[java] view plain copy

1. package com.cctvjiatao.customview.v1;  
2.   
3. import android.content.Context;  
4. import android.util.AttributeSet;  
5. import android.view.View;  
6.   
7. /** 
8.  * @作者： jiatao 
9.  * @修改时间：2016-3-11 上午7:58:10 
10.  * @包名：com.cctvjiatao.customview.v1 
11.  * @文件名：CustomView1.java 
12.  * @版权声明：www.cctvjiatao.com 
13.  * @功能： 最简单的自定义View，什么都不显示，但是有View的特性 
14.  */  
15. public class CustomView1 extends View {  
16.   
17.     public CustomView1(Context context) {  
18.         super(context);  
19.     }  
20.   
21.     public CustomView1(Context context, AttributeSet attrs) {  
22.         super(context, attrs);  
23.     }  
24.   
25. }  

activity_main.xml

 

[html] view plain copy

1. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools"  
3.     android:id="@+id/container"  
4.     android:layout_width="match_parent"  
5.     android:layout_height="match_parent" >  
6.   
7.     <com.cctvjiatao.customview.v1.CustomView1  
8.         android:layout_width="match_parent"  
9.         android:layout_height="match_parent"  
10.         android:background="#00ff00" >  
11.     </com.cctvjiatao.customview.v1.CustomView1>  
12.   
13. </FrameLayout>  

AndroidManifest.xml

 

[html] view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <manifest xmlns:android="http://schemas.android.com/apk/res/android"  
3.     package="com.cctvjiatao.customview"  
4.     android:versionCode="1"  
5.     android:versionName="1.0" >  
6.   
7.     <uses-sdk  
8.         android:minSdkVersion="14"  
9.         android:targetSdkVersion="21" />  
10.   
11.     <application  
12.         android:allowBackup="true"  
13.         android:icon="@drawable/ic_launcher"  
14.         android:label="@string/app_name"  
15.         android:theme="@style/AppTheme" >  
16.         <activity  
17.             android:name=".MainActivity"  
18.             android:label="@string/app_name" >  
19.             <intent-filter>  
20.                 <action android:name="android.intent.action.MAIN" />  
21.   
22.                 <category android:name="android.intent.category.LAUNCHER" />  
23.             </intent-filter>  
24.         </activity>  
25.     </application>  
26.   
27. </manifest>  

效果图：

二、自定义View，显示一行文字。注意:drawText的坐标是 “左下” 坐标。
com.cctvjiatao.customview.MainActivity 同一

AndroidManifest.xml 同一

activity_main.xml

 

[html] view plain copy

1. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools"  
3.     android:id="@+id/container"  
4.     android:layout_width="match_parent"  
5.     android:layout_height="match_parent" >  
6.   
7.     <com.cctvjiatao.customview.v1.CustomView1  
8.         android:layout_width="match_parent"  
9.         android:layout_height="match_parent"  
10.         android:background="#00ff00"   
11.         android:visibility="gone">  
12.     </com.cctvjiatao.customview.v1.CustomView1>  
13.       
14.     <com.cctvjiatao.customview.v2.CustomView1  
15.         android:layout_width="match_parent"  
16.         android:layout_height="match_parent">  
17.     </com.cctvjiatao.customview.v2.CustomView1>  
18.   
19. </FrameLayout>  

com.cctvjiatao.customview.v2.CustomView1

 

[java] view plain copy

1. package com.cctvjiatao.customview.v2;  
2.   
3. import android.content.Context;  
4. import android.graphics.Canvas;  
5. import android.graphics.Paint;  
6. import android.util.AttributeSet;  
7. import android.view.View;  
8.   
9. /** 
10.  * @作者： jiatao 
11.  * @修改时间：2016-3-11 上午8:22:56 
12.  * @包名：com.cctvjiatao.customview.v2 
13.  * @文件名：CustomView2.java 
14.  * @版权声明：www.cctvjiatao.com 
15.  * @功能： 自定义View，显示一行文字。注意:drawText的坐标是 “左下” 坐标。 
16.  */  
17. public class CustomView1 extends View {  
18.   
19.     public CustomView1(Context context, AttributeSet attrs) {  
20.         super(context, attrs);  
21.     }  
22.   
23.     public CustomView1(Context context) {  
24.         super(context);  
25.     }  
26.   
27.     @Override  
28.     protected void onDraw(Canvas canvas) {  
29.         Paint paint = new Paint();  
30.         // canvas.drawText("This is a canvas", 0, 0, paint);//这样写不会显示文字，因为文字的左下坐标是（0，0）  
31.         canvas.drawText("This is a canvas,坐标为左下（0，50）", 0, 50, paint);// (字符，左坐标，下坐标，画笔)  
32.   
33.         paint.setTextSize(30);//设置画笔大小，即字体大小  
34.         canvas.drawText("This is a canvas，坐标为左下（0，30）", 0, 30, paint);// (字符，左坐标，下坐标，画笔)  
35.     }  
36.   
37. }  

效果图：

三、 自定义View，画线、矩形、圆角矩形、圆形

 

com.cctvjiatao.customview.MainActivity 同一

AndroidManifest.xml 同一

activity_main.xml

 

[html] view plain copy

1. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools"  
3.     android:id="@+id/container"  
4.     android:layout_width="match_parent"  
5.     android:layout_height="match_parent" >  
6.   
7.     <com.cctvjiatao.customview.v1.CustomView1  
8.         android:layout_width="match_parent"  
9.         android:layout_height="match_parent"  
10.         android:background="#00ff00"   
11.         android:visibility="gone">  
12.     </com.cctvjiatao.customview.v1.CustomView1>  
13.       
14.     <com.cctvjiatao.customview.v2.CustomView1  
15.         android:layout_width="match_parent"  
16.         android:layout_height="match_parent"  
17.         android:visibility="gone">  
18.     </com.cctvjiatao.customview.v2.CustomView1>  
19.       
20.     <com.cctvjiatao.customview.v2.CustomView2  
21.         android:layout_width="match_parent"  
22.         android:layout_height="match_parent">  
23.     </com.cctvjiatao.customview.v2.CustomView2>  
24.   
25. </FrameLayout>  

com.cctvjiatao.customview.v2.CustomView2

 

[java] view plain copy

1. <pre name="code" class="java">package com.cctvjiatao.customview.v2;  
2.   
3. import android.content.Context;  
4. import android.graphics.Canvas;  
5. import android.graphics.Paint;  
6. import android.graphics.Rect;  
7. import android.graphics.RectF;  
8. import android.graphics.Paint.Style;  
9. import android.util.AttributeSet;  
10. import android.view.View;  
11.   
12. /** 
13.  * @作者： jiatao 
14.  * @修改时间：2016-3-12 上午11:31:51 
15.  * @包名：com.cctvjiatao.customview.v2 
16.  * @文件名：CustomView2.java 
17.  * @版权声明：www.cctvjiatao.com 
18.  * @功能： 自定义View，画线、矩形、圆角矩形、圆形 
19.  */  
20. public class CustomView2 extends View {  
21.   
22.     public CustomView2(Context context, AttributeSet attrs) {  
23.         super(context, attrs);  
24.     }  
25.   
26.     public CustomView2(Context context) {  
27.         super(context);  
28.     }  
29.   
30.     @Override  
31.     protected void onDraw(Canvas canvas) {  
32.         Paint paint = new Paint();  
33.         paint.setTextSize(10);  
34.         paint.setColor(0xffff0000);  
35.         // 画直线  
36.         canvas.drawLine(0, 10, 200, 10, paint);  
37.         // 画斜线  
38.         canvas.drawLine(0, 10, 200, 60, paint);  
39.   
40.         // 画矩形(Rect)  
41.         Rect rect = new Rect(0, 80, 100, 160);  
42.         canvas.drawRect(rect, paint);  
43.         // 画矩形(RectF)  
44.         RectF rectf = new RectF(150, 80, 250, 160);  
45.         canvas.drawRect(rectf, paint);  
46.         // 画矩形(坐标)  
47.         canvas.drawRect(300, 80, 400, 160, paint);  
48.   
49.         // 画圆角矩形(RectF)  
50.         RectF rectrf = new RectF(10, 180, 110, 250);  
51.         canvas.drawRoundRect(rectrf, 10, 10, paint);  
52.         // 画圆角矩形(RectF)  
53.         canvas.drawRoundRect(120, 180, 220, 250, 10, 10, paint);  
54.   
55.         // 画圆形  
56.         canvas.drawCircle(100, 350, 50, paint);  
57.         paint.setStyle(Style.STROKE);  
58.         canvas.drawCircle(210, 350, 50, paint);  
59.         paint.setStyle(Style.FILL_AND_STROKE);  
60.         canvas.drawCircle(320, 350, 50, paint);  
61.         paint.setStyle(Style.FILL);  
62.         canvas.drawCircle(430, 350, 50, paint);  
63.   
64.     }  
65. }  

效果图：

四、自定义View，画图像

com.cctvjiatao.customview.MainActivity 同一

AndroidManifest.xml 同一

activity_main.xml

 

[html] view plain copy

1. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools"  
3.     android:id="@+id/container"  
4.     android:layout_width="match_parent"  
5.     android:layout_height="match_parent" >  
6.   
7.     <com.cctvjiatao.customview.v1.CustomView1  
8.         android:layout_width="match_parent"  
9.         android:layout_height="match_parent"  
10.         android:background="#00ff00"   
11.         android:visibility="gone">  
12.     </com.cctvjiatao.customview.v1.CustomView1>  
13.       
14.     <com.cctvjiatao.customview.v2.CustomView1  
15.         android:layout_width="match_parent"  
16.         android:layout_height="match_parent"  
17.         android:visibility="gone">  
18.     </com.cctvjiatao.customview.v2.CustomView1>  
19.       
20.     <com.cctvjiatao.customview.v2.CustomView2  
21.         android:layout_width="match_parent"  
22.         android:layout_height="match_parent"  
23.         android:visibility="gone">  
24.     </com.cctvjiatao.customview.v2.CustomView2>  
25.       
26.     <com.cctvjiatao.customview.v2.CustomView3  
27.         android:layout_width="match_parent"  
28.         android:layout_height="match_parent">  
29.     </com.cctvjiatao.customview.v2.CustomView3>  
30.   
31. </FrameLayout>  

com.cctvjiatao.customview.v2.CustomView3

[java] view plain copy

1. package com.cctvjiatao.customview.v2;  
2.   
3. import com.cctvjiatao.customview.R;  
4.   
5. import android.content.Context;  
6. import android.graphics.Bitmap;  
7. import android.graphics.BitmapFactory;  
8. import android.graphics.Canvas;  
9. import android.graphics.Paint;  
10. import android.util.AttributeSet;  
11. import android.view.View;  
12.   
13. /** 
14.  * @作者： jiatao 
15.  * @修改时间：2016-3-12 下午1:16:11 
16.  * @包名：com.cctvjiatao.customview.v2 
17.  * @文件名：CustomView3.java 
18.  * @版权声明：www.cctvjiatao.com 
19.  * @功能： 自定义View，画图像 
20.  */  
21. public class CustomView3 extends View {  
22.   
23.     private Bitmap bitmap;  
24.   
25.     public CustomView3(Context context, AttributeSet attrs) {  
26.         super(context, attrs);  
27.         bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);  
28.     }  
29.   
30.     public CustomView3(Context context) {  
31.         super(context);  
32.         bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);  
33.     }  
34.   
35.     @Override  
36.     protected void onDraw(Canvas canvas) {  
37.         Paint paint = new Paint();  
38.         canvas.drawBitmap(bitmap, 0, 35, paint);  
39.     }  
40.   
41. }  

效果图：