android 简单控件组合显示
android 界面的控件处理时，有时遇到两个或更多个控件紧密联系在一起，可以将其做成绑定在一块，绑定组合之后就会更加方便的处理界面显示：
为了更快的上手，形象直接有效，直接从代码入手，自己再敲一遍，一切就在不言中已经领会了，再去翻翻理论，就更懂了！！
1. 先看一下自定义组合代码，继承LinearLayout ：
package com.test.customviewtest;
import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.ImageButton;
import android.widget.LinearLayout;
import android.widget.TextView;
/**
*
* 将ImageButton和TextView 组合在一起，其他控件组合方法类似
*/
public class ComposeWidget extends LinearLayout {
private ImageButton mImageButton;
private TextView mTextView;
public ComposeWidget(Context context, AttributeSet attrs) {
super(context, attrs);
// 注意参数:root=this 及 attachToRoot=true
LayoutInflater.from(context)
.inflate(R.layout.custom_button, this, true);
mImageButton = (ImageButton) findViewById(R.id.myButton);
mTextView = (TextView) findViewById(R.id.myTextView);
}
public void setButtonBackground(int resid) {
mImageButton.setBackgroundResource(resid);
}
public void setTextViewText(String text) {
mTextView.setText(text);
}
}
2. 发现上面中引入了 R.layout.custom_button ，其实就是组合控件的一个布局custom_button.xml：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageButton
android:id="@+id/myButton"
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_gravity="center_vertical"
android:background="@drawable/flag" />
<TextView
android:id="@+id/myTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:textColor="#00ff00" />
</LinearLayout>
3. 然后在主界面的activity_main.xml 中引入自定义的组合控件：
<com.test.customviewtest.ComposeWidget
android:id="@+id/myComposeWidget"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:clickable="true"
android:focusable="true" >
</com.test.customviewtest.ComposeWidget>
注： com.test.customviewtest.ComposeWidget 是自定义控件ComposeWidget类的全路径
以上三步就够了，自定义组合控件便能显示出来！！
以下介绍一下EditText 与ImageButton 组合显示，根据EditText中是否有内容，显示或隐藏ImageButton的过程:
1.自定义组合代码：
package com.test.customviewtest;
import android.content.Context;
import android.text.Editable;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.EditText;
import android.widget.ImageButton;
import android.widget.LinearLayout;
interface EditTextInterface {
public void hideImageButton();
public void showImageButton();
}
public class CustomEditText extends LinearLayout implements EditTextInterface {
public EditText mEditText;
public ImageButton mImageButton;
public CustomEditText(Context context, AttributeSet attrs) {
super(context, attrs);
LayoutInflater.from(context).inflate(R.layout.custom_edittext, this,
true);
mEditText = (EditText) findViewById(R.id.mEditText);
mImageButton = (ImageButton) findViewById(R.id.mImageButton);
mEditText.addTextChangedListener(mTextWatcher);
mImageButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
hideImageButton();
mEditText.setText("");
}
});
}
TextWatcher mTextWatcher = new TextWatcher() {
@Override
public void onTextChanged(CharSequence s, int start, int before,
int count) {
}
@Override
public void beforeTextChanged(CharSequence s, int start, int count,
int after) {
}
@Override
public void afterTextChanged(Editable s) {
if (s.length() == 0) {
hideImageButton();
} else {
showImageButton();
}
}
};
@Override
public void hideImageButton() {
if (mImageButton.isShown()) {
mImageButton.setVisibility(View.GONE);
}
}
@Override
public void showImageButton() {
if (!mImageButton.isShown()) {
mImageButton.setVisibility(View.VISIBLE);
}
}
}
此处对EditText 添加了 TextWatcher 监听，TextWatcher 对内容进行了监听！！
2. R.layout.custom_edittext 对应的xml :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<EditText
android:id="@+id/mEditText"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:singleLine="true" />
<ImageButton
android:id="@+id/mImageButton"
android:layout_width="50dip"
android:layout_height="wrap_content"
android:layout_alignRight="@+id/mEditText"
android:background="#00ff00"
android:src="@android:drawable/ic_delete"
android:visibility="gone" />
</RelativeLayout>
3. 主界面的activity_main.xml 中引入该组合控件：
<com.test.customviewtest.CustomEditText
android:id="@+id/myCustomEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
</com.test.customviewtest.CustomEditText>注： 需要引用类的全路径：com.test.customviewtest.CustomEditText
以上三步便实现EditText 与ImageButton 根据内容组合显示！！
