自定义View学习笔记之继承ViewGroup

一个自定义View继承ViewGroup的实例。先看效果图，如下：



该自定义View中有三个子控件组成，分别是TextView、EditText和ImageView。当EditText为空时不显示ImageView，当EditText不为空时显示ImageView，此时点击ImageView则清空EditText。

由于该自定义View中有三个子控件，因此我们可以选择让其继承LinearLayout。

自定义View的属性，首先在res/values/ 下建立一个attrs.xml ， 在里面定义我们的属性和声明我们的整个样式。

<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="MyEdtiText">
<attr name="left_text" format="string" />
<attr name="textSize" format="dimension"/>
</declare-styleable>
</resources>

以上代码定义了左边TextView的字体和字体大小。

接下来新建一个类MyEditText继承自LinearLayout，在View的构造方法中，获得我们的自定义的样式。

package com.example.smily.customview02;

import android.content.Context;
import android.content.res.TypedArray;
import android.text.Editable;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MyEdtiText extends LinearLayout {
private View mInflate;
private TextView mTextView;
private EditText mEditText;
private ImageView mImageView;
private String mString;
private int textSize;

public MyEdtiText(Context context) {
super(context);
mInflate = View.inflate(context, R.layout.layout_edit, this);
}

public MyEdtiText(Context context, AttributeSet attrs) {
this(context, attrs, 0);

}

public MyEdtiText(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mInflate = View.inflate(context, R.layout.layout_edit, this);
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.MyEdtiText, defStyleAttr, 0);
int indexCount = typedArray.getIndexCount();
// mString = typedArray.getString(R.styleable.MyEdtiText_left_text);
for (int i = 0; i < indexCount; i++) {
int attr = typedArray.getIndex(i);
switch (attr) {
case R.styleable.MyEdtiText_left_text:
mString = typedArray.getString(R.styleable.MyEdtiText_left_text);
break;
case R.styleable.MyEdtiText_textSize:
// 默认设置为16sp，TypeValue也可以把sp转化为px
textSize = typedArray.getDimensionPixelOffset(attr, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 16, getResources().getDisplayMetrics()));
break;
}

}

typedArray.recycle();
}

//  通过java代码设置左边文字内容
public void setLeftText(String string) {
mTextView.setText(string);
}

//  通过java代码设置字体大小
public void setTextSize(int size) {
mTextView.setTextSize(size);
mEditText.setTextSize(size);
}

/**
* 当View中所有的子控件均被映射成xml后触发该方法
*/
@Override
protected void onFinishInflate() {
super.onFinishInflate();
mTextView = (TextView) mInflate.findViewById(R.id.tv_edit);
mEditText = (EditText) mInflate.findViewById(R.id.et_edit);
mImageView = (ImageView) mInflate.findViewById(R.id.iv_edit);

mTextView.setText(mString);
mTextView.setTextSize(textSize);
mEditText.setTextSize(textSize);
mImageView.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
mEditText.setText("");
}
});
//  监听EditText的变化
mEditText.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {

}

@Override
public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {

}

@Override
public void afterTextChanged(Editable editable) {
String s = editable.toString();
if (s.length() > 0) {
mImageView.setVisibility(VISIBLE);
} else {
mImageView.setVisibility(INVISIBLE);
}
}
});

}
}

在布局文件中声明自定义View

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff"
android:orientation="vertical">

<com.example.smily.customview02.MyEdtiText
android:id="@+id/met_username"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:background="#EFEFEF"
app:textSize="16sp"
app:left_text="用户名：" />

<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#fff" />

<com.example.smily.customview02.MyEdtiText
android:id="@+id/met_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
app:left_text="密 码："
app:textSize="16sp"
android:background="#EFEFEF"/>
</LinearLayout>

xmlns:custom=”http://schemas.android.com/apk/res/com.example.customview01”是我们的命名空间，后面的包路径指的是项目的package 。

可以通过java代码设置属性

package com.example.smily.customview02;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.EditText;

public class MainActivity extends AppCompatActivity {
MyEdtiText mMyEditText;
EditText mEdittext;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

mMyEditText= (MyEdtiText) findViewById(R.id.met_password);
mMyEditText.setLeftText("密 码：");
mMyEditText.setTextSize(30);
}
}