Android学习自定义View(三)——自绘控件和组合控件

MainActivity如下:

package cc.testviewstudy3;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.app.Activity;
/**
 * Demo描述:
 * 关于自定义View的学习(三)
 *
 * 自定义View的实现方式大概可以分为三种:
 * 自绘控件、组合控件、以及继承控件
 * 在此Demo中实现自绘控件和组合控件
 *
 * 学习资料:
 * http://blog.csdn.net/guolin_blog/article/details/17357967
 * Thank you very much
 *
 */
public class MainActivity extends Activity {
    private TitleViewFrameLayout mTitleViewFrameLayout;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		init();
	}

	private void init(){
		mTitleViewFrameLayout=(TitleViewFrameLayout) findViewById(R.id.titleViewFrameLayout);
		mTitleViewFrameLayout.setBackButtonText("返回");
		mTitleViewFrameLayout.setTitleTextViewText("标题");
		mTitleViewFrameLayout.setButtonClickListener(new OnClickListener() {
			@Override
			public void onClick(View v) {
				System.out.println("点击了Back");
				finish();
			}
		});
	}
}

CounterView如下:

package cc.testviewstudy3;

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

//自绘控件
public class CounterView extends View implements View.OnClickListener{
    private Paint mPaint;
    private Rect mRect;
    private Rect mTextBoundsRect;
    private int counter=0;
	public CounterView(Context context) {
		super(context);
	}

	public CounterView(Context context, AttributeSet attrs) {
		super(context, attrs);
		mPaint=new Paint(Paint.ANTI_ALIAS_FLAG);
		mRect=new Rect();
		mTextBoundsRect=new Rect();
		//设置监听
		this.setOnClickListener(this);
	}

	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		mPaint.setColor(Color.YELLOW);
		// getWidth()和getHeight()表示获得该自定义View本身的宽和高
		canvas.drawRect(0, 0, this.getWidth(), this.getHeight(), mPaint);
		mPaint.setColor(Color.BLUE);
		mPaint.setTextSize(40);
		String counterString = String.valueOf(counter);

		//测量文字的宽和高,将此结果保存到一个Rect中.即此处的mTextBoundsRect
		mPaint.getTextBounds(counterString, 0, counterString.length(),mTextBoundsRect);
		float textBoundWidth = mTextBoundsRect.width();
		float textBoundHeight = mTextBoundsRect.height();
		System.out.println("textBoundWidth="+textBoundWidth+",textBoundHeight="+textBoundHeight);
        //画出文字
		canvas.drawText(counterString, getWidth() / 2-textBoundWidth/2,
				        getHeight() / 2+textBoundHeight/2, mPaint);
	}

	/**
	 * 为实现对于自绘控件点击事件的监听
	 * 1 设置监听器,即this.setOnClickListener(this);
	 *   这个和在Activity中view.setOnClickListener()是同一道理
	 * 2 覆写 onClick(View v)方法
	 *  在该方法中完成业务逻辑后,调用this.invalidate();
	 *  this.invalidate()方法会去调用onDraw()方法,从而实现重绘
	 */
	@Override
	public void onClick(View v) {
		counter++;
		this.invalidate();
	}

}

TitleViewFrameLayout如下:

package cc.testviewstudy3;
import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.Button;
import android.widget.FrameLayout;
import android.widget.TextView;
//组合控件
public class TitleViewFrameLayout extends FrameLayout {
    private Button mBackButton;
    private TextView mTitleTextView;

	public TitleViewFrameLayout(Context context, AttributeSet attrs) {
		super(context, attrs);
		LayoutInflater.from(context).inflate(R.layout.test_title, this);
		mBackButton=(Button) findViewById(R.id.backButton);
		mTitleTextView=(TextView) findViewById(R.id.titleTextView);
	}

	//定义方法--->设置Button的文字
	public void setBackButtonText(String text){
		mBackButton.setText(text);
	}

	//定义方法--->设置Button的点击监听
	public void setButtonClickListener(OnClickListener listener){
		mBackButton.setOnClickListener(listener);
	}

	//定义方法--->设置TextView的文字
	public void setTitleTextViewText(String text){
		mTitleTextView.setText(text);
	}

}

main.xml如下:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <cc.testviewstudy3.TitleViewFrameLayout
        android:id="@+id/titleViewFrameLayout"
        android:layout_width="fill_parent"
        android:layout_height="80dip"
        android:layout_centerHorizontal="true" />

    <cc.testviewstudy3.CounterView
        android:layout_width="120dip"
        android:layout_height="120dip"
        android:layout_centerInParent="true" />

</RelativeLayout>

test_title如下:

<?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="70dip"
    android:background="#fcf345" >

    <Button
        android:id="@+id/backButton"
        android:layout_width="70dip"
        android:layout_height="50dip"
        android:layout_centerVertical="true"
        android:layout_marginLeft="10dip"
        android:text="Back" />

    <TextView
        android:id="@+id/titleTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Title"
        android:textColor="#1ee123"
        android:textSize="20sp" />

</RelativeLayout>