android自定义控件_自定义组合控件1

最近有时间整理一下一直想要总结的自定义控件，有问题希望大家及时指出。

自定义根据项目需求可以简单的分成以下3种：

1.自定义组合控件；
2.继承已有的控件   比如smartImageView继承ImageView；
3.完全自定义控件   1)定义一个类继承安卓中的基类View   2)定义一个类继承安卓中的基类ViewGroup；

自定义组合控件：使用结构相同的布局，而且布局中不只有一个控件同时子控件位置都是一样的，即把已有的原生控件组合成一个新的控件。

比如图1仿微信底部四个icon所示（上面imageview 下面textview）：



        图2设置页面控件开关所示（左边 textview 右边switch）：



其实现的原理都是一样的，自定义一个类继承RelatiiveLayout或者LinearLayout等容器（这样的容器都可以包含多个控件）然后重写其方法。

本文中第一个列子很简单，没有用到AttributeSet属性，最终实现的效果如图(点击图和文字都同时变化)： 



自定类MyButton代码如下：

/**
* 自定义button
*/

public class MyButton extends LinearLayout {

/**
* 底部名称
*/
private TextView btnText;

/**
* 图标icon
*/
private ImageView imageView;

/**
* 成员变量isSelected 是不是选中的状态 默认false
*/
private boolean isSelected = false;

private int imageDefault;

private int imageSelected;

private String text;

public MyButton(Context context) {
super(context);
init(context, null);
}

public MyButton(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init(context, attrs);
}

public MyButton(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context, attrs);
}

/**
* 初始化 根据布局文件填充控件
*
* @param context
* @param attrs
*/
private void init(Context context, AttributeSet attrs) {
//inflate 函数有3个参数 参数一是填充的布局文件 参数二 本布局添加到父控件中 作用类似于addView
View butttonView = LayoutInflater.from(context).inflate(R.layout.layout_mybutton, this, true);
imageView = (ImageView) butttonView.findViewById(R.id.mybtn_img);
btnText = (TextView) butttonView.findViewById(R.id.mybtn_txt);

}

/**
* 使用控件先初始化
*
* @param imageDefault
* @param imageSelected
* @param text
*/
public void setButtonView(int imageDefault, int imageSelected, String text) {
this.imageDefault = imageDefault;
this.imageSelected = imageSelected;
this.text = text;

imageView.setImageResource(imageDefault);
btnText.setText(text);

}

/**
* 重写基类View的是否select的方法
* LinearLayout <= ViewGroup <= View
*
* @return
*/
@Override
public boolean isSelected() {
return isSelected;
}

/**
* 重写基类View的设置select的方法
* 用的时候：代码中点击事件触发时先走这个方法 标志了状态
*
* @return
*/
@Override
public void setSelected(boolean selected) {
isSelected = selected;
changeSelected();
}

/**
* 点击底部切换按钮的时候 改变状态 即selected标志
*/
public void changeSelected() {

if (isSelected) {
//选中的话
isSelected = false;
imageView.setImageResource(imageSelected);
btnText.setText(text);
btnText.setTextColor(Color.parseColor("#fed955"));
} else {
isSelected = true;
imageView.setImageResource(imageDefault);
btnText.setText(text);
btnText.setTextColor(Color.parseColor("#666666"));
}
}
}

首先MyButton继承于LinearLayout 。控件的继承关系如下：LinearLayout继承与ViewGroup；ViewGroup继承于基类View；然后每个都有针对自己的实现（这也体现了java面向对象的好处，单继承、多实现） 。

其中：isSelected()和setSelected()是View中的方法；setButtonView()是用于控件初始化；changeSelected()用于改变状态。

布局文件：

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

<ImageView
android:id="@+id/mybtn_img"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_marginTop="3dp"
android:layout_weight="1"
android:src="@drawable/icon_account" />

<TextView
android:id="@+id/mybtn_txt"
android:layout_width="match_parent"
android:textColor="@color/common_h1"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="名称"
android:textSize="12sp" />
</LinearLayout>

使用方法：

public class MainActivity extends AppCompatActivity {

private boolean isSeleced = false;//默认是不选中的

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

final MyButton myButton = findViewById(R.id.btn_text);
myButton.setButtonView(R.drawable.icon_account, R.drawable.icon_account_selected, "账单");
myButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (isSeleced) {
isSeleced = false;
myButton.setSelected(true);
} else {
isSeleced = true;
myButton.setSelected(false);
}

}
});
}
}

主布局文件中的引用方式：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
tools:context="com.yezhu.myapplication.MainActivity">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<com.yezhu.myapplication.MyButton
android:id="@+id/btn_text"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>

</LinearLayout>

综上所述，自定义组合控件一般都是以继承ViewGroup及其子类(4大布局)为主,内部嵌套其他控件,来组合成一个新的控件从而实现一些特定的需要,具有简化代码,结构清晰,重用性高的特性。

以上就是最简单的自定义组合控件方式，如有问题请大家及时指出。