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

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

com.cctvjiatao.customview.MainActivity

package com.cctvjiatao.customview;

import android.app.Activity;
import android.os.Bundle;

public class MainActivity extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}

}

com.cctvjiatao.customview.v1.CustomView1

package com.cctvjiatao.customview.v1;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;

/**
* @作者： jiatao
* @修改时间：2016-3-11 上午7:58:10
* @包名：com.cctvjiatao.customview.v1
* @文件名：CustomView1.java
* @版权声明：www.cctvjiatao.com
* @功能： 最简单的自定义View，什么都不显示，但是有View的特性
*/
public class CustomView1 extends View {

public CustomView1(Context context) {
super(context);
}

public CustomView1(Context context, AttributeSet attrs) {
super(context, attrs);
}

}

activity_main.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<com.cctvjiatao.customview.v1.CustomView1
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00ff00" >
</com.cctvjiatao.customview.v1.CustomView1>

</FrameLayout>

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.cctvjiatao.customview"
android:versionCode="1"
android:versionName="1.0" >

<uses-sdk
android:minSdkVersion="14"
android:targetSdkVersion="21" />

<application
android:allowBackup="true"
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme" >
<activity
android:name=".MainActivity"
android:label="@string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>

</manifest>

效果图：



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

com.cctvjiatao.customview.MainActivity
同一

AndroidManifest.xml 同一

activity_main.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<com.cctvjiatao.customview.v1.CustomView1
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00ff00"
android:visibility="gone">
</com.cctvjiatao.customview.v1.CustomView1>

<com.cctvjiatao.customview.v2.CustomView1
android:layout_width="match_parent"
android:layout_height="match_parent">
</com.cctvjiatao.customview.v2.CustomView1>

</FrameLayout>

com.cctvjiatao.customview.v2.CustomView1

package com.cctvjiatao.customview.v2;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;

/**
* @作者： jiatao
* @修改时间：2016-3-11 上午8:22:56
* @包名：com.cctvjiatao.customview.v2
* @文件名：CustomView2.java
* @版权声明：www.cctvjiatao.com
* @功能： 自定义View，显示一行文字。注意:drawText的坐标是 “左下” 坐标。
*/
public class CustomView1 extends View {

public CustomView1(Context context, AttributeSet attrs) {
super(context, attrs);
}

public CustomView1(Context context) {
super(context);
}

@Override
protected void onDraw(Canvas canvas) {
Paint paint = new Paint();
// canvas.drawText("This is a canvas", 0, 0, paint);//这样写不会显示文字，因为文字的左下坐标是（0，0）
canvas.drawText("This is a canvas,坐标为左下（0，50）", 0, 50, paint);// (字符，左坐标，下坐标，画笔)

paint.setTextSize(30);//设置画笔大小，即字体大小
canvas.drawText("This is a canvas，坐标为左下（0，30）", 0, 30, paint);// (字符，左坐标，下坐标，画笔)
}

}

效果图：



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

com.cctvjiatao.customview.MainActivity 同一

AndroidManifest.xml 同一

activity_main.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<com.cctvjiatao.customview.v1.CustomView1
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00ff00"
android:visibility="gone">
</com.cctvjiatao.customview.v1.CustomView1>

<com.cctvjiatao.customview.v2.CustomView1
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone">
</com.cctvjiatao.customview.v2.CustomView1>

<com.cctvjiatao.customview.v2.CustomView2
android:layout_width="match_parent"
android:layout_height="match_parent">
</com.cctvjiatao.customview.v2.CustomView2>

</FrameLayout>

com.cctvjiatao.customview.v2.CustomView2

<pre name="code" class="java">package com.cctvjiatao.customview.v2;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.Paint.Style;
import android.util.AttributeSet;
import android.view.View;

/**
* @作者： jiatao
* @修改时间：2016-3-12 上午11:31:51
* @包名：com.cctvjiatao.customview.v2
* @文件名：CustomView2.java
* @版权声明：www.cctvjiatao.com
* @功能： 自定义View，画线、矩形、圆角矩形、圆形
*/
public class CustomView2 extends View {

public CustomView2(Context context, AttributeSet attrs) {
super(context, attrs);
}

public CustomView2(Context context) {
super(context);
}

@Override
protected void onDraw(Canvas canvas) {
Paint paint = new Paint();
paint.setTextSize(10);
paint.setColor(0xffff0000);
// 画直线
canvas.drawLine(0, 10, 200, 10, paint);
// 画斜线
canvas.drawLine(0, 10, 200, 60, paint);

// 画矩形(Rect)
Rect rect = new Rect(0, 80, 100, 160);
canvas.drawRect(rect, paint);
// 画矩形(RectF)
RectF rectf = new RectF(150, 80, 250, 160);
canvas.drawRect(rectf, paint);
// 画矩形(坐标)
canvas.drawRect(300, 80, 400, 160, paint);

// 画圆角矩形(RectF)
RectF rectrf = new RectF(10, 180, 110, 250);
canvas.drawRoundRect(rectrf, 10, 10, paint);
// 画圆角矩形(RectF)
canvas.drawRoundRect(120, 180, 220, 250, 10, 10, paint);

// 画圆形
canvas.drawCircle(100, 350, 50, paint);
paint.setStyle(Style.STROKE);
canvas.drawCircle(210, 350, 50, paint);
paint.setStyle(Style.FILL_AND_STROKE);
canvas.drawCircle(320, 350, 50, paint);
paint.setStyle(Style.FILL);
canvas.drawCircle(430, 350, 50, paint);

}
}

效果图：



四、自定义View，画图像

com.cctvjiatao.customview.MainActivity 同一

AndroidManifest.xml 同一
activity_main.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<com.cctvjiatao.customview.v1.CustomView1
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00ff00"
android:visibility="gone">
</com.cctvjiatao.customview.v1.CustomView1>

<com.cctvjiatao.customview.v2.CustomView1
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone">
</com.cctvjiatao.customview.v2.CustomView1>

<com.cctvjiatao.customview.v2.CustomView2
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone">
</com.cctvjiatao.customview.v2.CustomView2>

<com.cctvjiatao.customview.v2.CustomView3
android:layout_width="match_parent"
android:layout_height="match_parent">
</com.cctvjiatao.customview.v2.CustomView3>

</FrameLayout>

com.cctvjiatao.customview.v2.CustomView3

package com.cctvjiatao.customview.v2;

import com.cctvjiatao.customview.R;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;

/**
* @作者： jiatao
* @修改时间：2016-3-12 下午1:16:11
* @包名：com.cctvjiatao.customview.v2
* @文件名：CustomView3.java
* @版权声明：www.cctvjiatao.com
* @功能： 自定义View，画图像
*/
public class CustomView3 extends View {

private Bitmap bitmap;

public CustomView3(Context context, AttributeSet attrs) {
super(context, attrs);
bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);
}

public CustomView3(Context context) {
super(context);
bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);
}

@Override
protected void onDraw(Canvas canvas) {
Paint paint = new Paint();
canvas.drawBitmap(bitmap, 0, 35, paint);
}

}

效果图：