自定义组合控件就是将常用的组合控件效果进行封装。
经常使用的界面,并且界面是由多个子控件或子布局组成,这时候需要组合控件
组合控件的作用:用于封装常用的控件组合效果,方便开发者使用。
今天的效果图如下：
效果图
自定义属性
编码中会用到自定义属性，我们先来说一下自定义属性的流程。
我们常用的官方控件，如TextView,ImageView等，常用到layout_width,layout_height等属性，都是官方帮我们自定义好的属性，所以我们可以直接拿来使用。在工作中，有些官方提供的属性不满足我们的需求，我们就需要自定义属性了。
android:layout_width="wrap_content"
android:layout_height="wrap_content"
自定义属性的步骤：
1.在value目录下attr.xml中声名属性的名称和类型格式。如果value目录下没有attr文件，自己创建即可。
建好文件后，会自带
我们在
如下图所示，红框中为所有待选的属性类型。
dimension为单位为dp或sp的值，如我们常用的宽高值。
自定义属性的类型
2.在activity_main.xml文件中定义名称空间和声明属性
加入名称空间可以使用appNs属性，会帮我们自动匹配
3.在自定义组合控件内部获取自定义属性的值,并设置到内部的控件上，此处为TextView上。
public MyToggleView(Context context, AttributeSet set) {
super(context, set);
// 将布局和view绑定
View view = View.inflate(context, R.layout.view_setting_item, this);
//获取控件
TextView tv_title = (TextView) findViewById(R.id.view_tv_title);
// 读取自定义的属性
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.MyToggleView);
//获取自定义属性的值
String title = typedArray.getString(R.styleable.SettingItemView_item_title);
//获取完成后一定要做回收处理
ta.recycle();
tv_title.setText(title_type);//设置文本
...
}
经过以上三个步骤，自定义属性就完成了。再复杂的自定义属性，也都是经过这三个步骤。
若想要控制自定义控件的背景,也可以定义一个枚举类型的属性值,获取属性值并设置到控件上
enum:枚举,表示item_background只允许输入三个(first,middle,last),分别对应int值0,1,2
1.编写attr属性
...
2.activity_main.xml文件中引用
3.在自定义组合控件中获取值，并给控制赋值
public MyToggleView(Context context, AttributeSet set) {
super(context, set);
...
int background_type = typedArray.getInt(R.styleable.MyToggleView_item_backgroud, 0);
...
int bg;
switch (background_type) {
case 1:
bg = R.drawable.seting_middle_selector;
break;
case 2:
bg = R.drawable.seting_last_selector;
break;
default:
bg = R.drawable.seting_first_selector;
}
view.setBackgroundResource(bg);//设置背景
...
}
我们把开关状态也设置在自定义属性中，方便在布局文件中设置一个默认开关状态。
1.编写attr属性
2.布局文件中引用
3.在自定义组合控件中获取值，并给控制赋值
public MyToggleView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
view = View.inflate(context, R.layout.view_setting_item, this);
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.MyToggleView);//通过属性名称获取属性集合
boolean isToggleOn_type = typedArray.getBoolean(R.styleable.MyToggleView_toggle_on, false);//获取开关状态
iv_toggle = (ImageView) findViewById(R.id.view_iv_toggle);//开关
typedArray.recycle();//释放资源
isToggleOn(isToggleOn_type);
}
private boolean isToggleOn = false;
public void toggle() {//对外开放一个方法，用于切换开关
isToggleOn(!isToggleOn);
}
//用于内部设置开关状态
private void isToggleOn(boolean isToggleOn) {
// iv_toggle.setImageResource(isToggleOn ? R.drawable.on : R.drawable.off);
if (isToggleOn) {
iv_toggle.setImageResource(R.drawable.on);
if (listener != null) {
listener.onToggleOpen();
}
} else {
iv_toggle.setImageResource(R.drawable.off);
if (listener != null) {
listener.onToggleClose();
}
}
this.isToggleOn = isToggleOn;
}
//开关改变监听
public interface OnToggleChangeListener {
void onToggleOpen();//开关打开
void onToggleClose();//开关关闭
}
private OnToggleChangeListener listener;
public void setOnToggleChangeListener(OnToggleChangeListener listener) {
this.listener = listener;
}
主界面控制按钮状态:
toggle1 = (MyToggleView) findViewById(R.id.toggle1);
toggle1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
toggle1.toggle();//切换开关状态
}
});
toggle1.setOnToggleChangeListener(new MyToggleView.OnToggleChangeListener() {
@Override
public void onToggleOpen() {
Toast.makeText(getApplicationContext(),"开关已打开。",Toast.LENGTH_SHORT).show();
}
@Override
public void onToggleClose() {
Toast.makeText(getApplicationContext(),"开关已关闭。",Toast.LENGTH_SHORT).show();
}
});
自定义属性写完，基本代码也就写完了，剩下的就是在布局文件中使用自定义的组合控件了。
在布局文件中多使用几次自定义好的组合控件，就可以完成文章开始那张图的效果。
下面贴出完整代码：
布局文件activity_main.xml文件：
单个条目的布局文件view_setting_item.xml文件：
attr.xml文件：
自定义组合控件：
public class MyToggleView extends RelativeLayout {
private View view;
private ImageView iv_toggle;
public MyToggleView(Context context) {
this(context, null);
}
public MyToggleView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public MyToggleView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
view = View.inflate(context, R.layout.view_setting_item, this);
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.MyToggleView);//通过属性名称获取属性集合
int background_type = typedArray.getInt(R.styleable.MyToggleView_item_backgroud, 0);//获取背景值
String title_type = typedArray.getString(R.styleable.MyToggleView_item_title);//获取文本值
boolean isToggleOn_type = typedArray.getBoolean(R.styleable.MyToggleView_toggle_on, false);//获取开关状态
int bg;
switch (background_type) {
case 1:
bg = R.drawable.seting_middle_selector;
break;
case 2:
bg = R.drawable.seting_last_selector;
break;
default:
bg = R.drawable.seting_first_selector;
}
view.setBackgroundResource(bg);//设置背景
TextView tv_title = (TextView) findViewById(R.id.view_tv_title);//文本
tv_title.setText(title_type);//设置文本
iv_toggle = (ImageView) findViewById(R.id.view_iv_toggle);//开关
typedArray.recycle();//释放资源
isToggleOn(isToggleOn_type);
}
private boolean isToggleOn = false;
public void toggle() {
isToggleOn(!isToggleOn);
}
private void isToggleOn(boolean isToggleOn) {
// iv_toggle.setImageResource(isToggleOn ? R.drawable.on : R.drawable.off);
if (isToggleOn) {
iv_toggle.setImageResource(R.drawable.on);
if (listener != null) {
listener.onToggleOpen();
}
} else {
iv_toggle.setImageResource(R.drawable.off);
if (listener != null) {
listener.onToggleClose();
}
}
this.isToggleOn = isToggleOn;
}
public interface OnToggleChangeListener {
void onToggleOpen();
void onToggleClose();
}
private OnToggleChangeListener listener;
public void setOnToggleChangeListener(OnToggleChangeListener listener) {
this.listener = listener;
}
}
最后MainActivity.java:
public class MainActivity extends AppCompatActivity {
private MyToggleView toggle1;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toggle1 = (MyToggleView) findViewById(R.id.toggle1);
toggle1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
toggle1.toggle();
}
});
toggle1.setOnToggleChangeListener(new MyToggleView.OnToggleChangeListener() {
@Override
public void onToggleOpen() {
Toast.makeText(getApplicationContext(),"开关已打开。",Toast.LENGTH_SHORT).show();
}
@Override
public void onToggleClose() {
Toast.makeText(getApplicationContext(),"开关已关闭。",Toast.LENGTH_SHORT).show();
}
});
}
}