Android自定义View原理详解02

  自定义  View （下）

一、 自绘控件

自绘控件的意思就是，这个  View 上所展现的内容全部都是我们自己绘制出来的。绘制的代码是写在  onDraw() 方法中的。

绘制一个计数器功能：

Java 代码：

public class CounterView extends View implements OnClickListener {

private Paint mPaint;

private Rect mBounds;

private int mCount;

public CounterView(Context context, AttributeSet attrs) {

super(context, attrs);

mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);

mBounds = new Rect();

setOnClickListener(this);

}

@Override

protectedvoid onDraw(Canvas canvas) {

super.onDraw(canvas);

mPaint.setColor(Color.BLUE);

canvas.drawRect(0, 0, getWidth(), getHeight(), mPaint);

mPaint.setColor(Color.YELLOW);

mPaint.setTextSize(30);

String text = String.valueOf(mCount);

mPaint.getTextBounds(text, 0, text.length(), mBounds);

float textWidth = mBounds.width();

float textHeight = mBounds.height();

canvas.drawText(text, getWidth() / 2 -textWidth / 2, getHeight() / 2

+ textHeight / 2, mPaint);

}

@Override

public void onClick(View v) {

mCount++;

invalidate();

}

}

布局代码：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent" >

<com.example.customview.CounterView

android:layout_width="100dp"

android:layout_height="100dp"

android:layout_centerInParent="true" />

</RelativeLayout>

二、 组合控件

组合控件的意思就是，我们并不需要自己去绘制视图上显示的内容，而只是用系统原生的控件就好了，但我们可以将几个系统原生的控件组合到一起，这样创建出的控件就被称为组合控件。

创建组合布局：

<?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="50dp"

android:background="#ffcb05" >

<Button

android:id="@+id/button_left"

android:layout_width="60dp"

android:layout_height="40dp"

android:layout_centerVertical="true"

android:layout_marginLeft="5dp"

android:background="@drawable/back_button"

android:text="Back"

android:textColor="#fff" />

<TextView

android:id="@+id/title_text"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_centerInParent="true"

android:text="This is Title"

android:textColor="#fff"

android:textSize="20sp" />

</RelativeLayout>

创建自定义布局：

public class TitleView extends FrameLayout {

private Button leftButton;

private TextView titleText;

public TitleView(Context context, AttributeSet attrs) {

super(context, attrs);

LayoutInflater.from(context).inflate(R.layout.title, this);

titleText = (TextView) findViewById(R.id.title_text);

leftButton = (Button) findViewById(R.id.button_left);

leftButton.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {

((Activity) getContext()).finish();

}

});

}

public void setTitleText(String text) {

titleText.setText(text);

}

public void setLeftButtonText(String text) {

leftButton.setText(text);

}

public void setLeftButtonListener(OnClickListener l) {

leftButton.setOnClickListener(l);

}

}

使用组合布局：

<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" >

<com.example.customview.TitleView

android:id="@+id/title_view"

android:layout_width="match_parent"

android:layout_height="wrap_content" >

</com.example.customview.TitleView>

</RelativeLayout>

三、 自定义属性

在 Android  中要增加自定义属性，需要依靠  attrs.xml 文件。这里指定的自定义属性，是在  layout 布局文件中使用的不是以  android 开头的属性，例如  my:textValue 。首先，我们需要在  /res/values 目录下新建一个名为  attrs.xml

的文件。

<?xml version="1.0" encoding="utf-8"?>

<resources>

<declare-styleable name="NewMyElement">

<attr name="textColor" format="color" />

<attr name="textSize" format="dimension" />

<attr name="textValue" format="string" />

</declare-styleable>

</resources>

常用 format 属性：

reference 资源类型，通常是  @ 开头，例如  @+id/xxxx ，  @id/xxxxx

string 字符串类型，通常是文字信息

dimension 浮点类型，通常是尺寸度量，单位有很多  px ，  dp ，  sp ，  dip 等

color 颜色类型，通常是颜色  16 进制代码，支持  ARGB 。

boolean 布尔类型，  true 和  false

enum 枚举类型，通常是代表这个属性提供了几种值来进行选择，并且只能选择这几种中的一个

flag 与  enum 基本没有区别。

integer 整数类型，通常是整数

创建完 attrs.xml 文件，现在我们需要把这个属性用到  layout 文件中：

<?xml version="1.0" encoding="utf-8"?>

<LineanLayout

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:my="http://schemas.android.com/apk/res/com.qf.teach"

android:layout_width="match_parent"

android:layout_height="match_parent"

>

<com.ixgsoft.space.NewMyElement

my:textValue=" 哈哈 1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

/>

<com.ixgsoft.space.NewMyElement

my:textValue=" 哈哈 2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

/>

</LineanLayout>

自定义 View 中调用自定义属性：

TypedArray t = getContext().obtainStyledAttributes(attrs,R.styleable.NewMyElement);

String textValue = t.getString(R.styleable.NewMyElement_textValue); 

float textSize = t.getDimension(R.styleable.NewMyElement_textSize, 36); 

int textColor = t.getColor(R.styleable.NewMyElement_textColor, 0xff000000);