自定义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(一)——画线、矩形、圆形、图像_第1张图片
二、自定义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(一)——画线、矩形、圆形、图像_第2张图片

三、  自定义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(一)——画线、矩形、圆形、图像_第3张图片

四、自定义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);
	}

}
效果图:

自定义View(一)——画线、矩形、圆形、图像_第4张图片

你可能感兴趣的:(自定义View(一)——画线、矩形、圆形、图像)