1.创建一个Module命名为NumberAddSubView
2.创建自定义控件的布局文件number_add_sub_view.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/number_add_sub_view_selector"
android:gravity="center_vertical"
android:orientation="horizontal">
<Button
android:id="@+id/btn_sub"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:background="@drawable/btn_number_selector"
android:gravity="center"
android:text="-"
android:textColor="@android:color/black"
android:textSize="25sp" />
<TextView
android:layout_width="40dp"
android:layout_height="wrap_content"
android:gravity="center"
android:text="1"
android:textColor="@android:color/black"
android:textSize="20sp" />
<Button
android:id="@+id/btn_add"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:background="@drawable/btn_number_selector"
android:gravity="center"
android:text="+"
android:textColor="@android:color/black"
android:textSize="25sp" />
</LinearLayout>
3.布局中用到控件的选择器,整体布局的边框线number_add_sub_view_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<!--设置圆角-->
<corners android:radius="2dp"></corners>
<!--设置固定背景颜色-->
<solid android:color="#ffffff"></solid>
<!--设置边框颜色-->
<stroke android:color="#dddddd" android:width="1dp"></stroke>
</shape>
按钮控件的按下背景颜色选择器btn_number_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!--没按下状态-->
<item android:state_enabled="false">
<shape android:shape="rectangle">
<corners android:radius="2dp"></corners>
<solid android:color="#7fd8d8d8"></solid>
<stroke android:color="#dddddd" android:width="1dp"></stroke>
</shape>
</item>
<!--按下状态-->
<item android:state_pressed="true">
<shape android:shape="rectangle">
<corners android:radius="2dp"></corners>
<solid android:color="#ffd8d8d8"></solid>
<stroke android:color="#dddddd" android:width="1dp"></stroke>
</shape>
</item>
<!--默认状态-->
<item >
<shape android:shape="rectangle">
<corners android:radius="2dp"></corners>
<solid android:color="#ffffff"></solid>
<stroke android:color="#dddddd" android:width="1dp"></stroke>
</shape>
</item>
</selector>
4.自定义一个类编写该布局文件的逻辑操作形成自定义的控件,布局的父控件是线性布局,所以新建一个类继
承线性布局NumberAddSubView.java
步骤1:创建一个类,并且把布局与该类形成一个整体
View.inflate(context,R.layout.number_add_sub_view,this);
这一句代码是关键,里面的最后一个参数this就是把这个类和布局文件number_add_sub_view形成一个整体。
public class NumberAddSubView extends LinearLayout{
public NumberAddSubView(Context context) {
this(context,null);
}
public NumberAddSubView(Context context, AttributeSet attrs) {
this(context, attrs,0);
}
public NumberAddSubView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
//要让布局和当前类形成一个整体
View view = View.inflate(context,R.layout.number_add_sub_view,this);
}
}
步骤二、控件的逻辑处理,并且定义接口回调响应控件
import android.content.Context;
import android.text.TextUtils;
import android.util.AttributeSet;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.TextView;
/**
* 自定义数字加减控件
* Created by willkong on 2016/12/14.
*/
public class NumberAddSubView extends LinearLayout implements View.OnClickListener {
private Button btn_sub;
private Button btn_add;
private TextView tv_value;
//属性监听
private int value = 1;//默认值
private int minValue = 1;//最小值
private int maxValue = 10;//最大值
public int getMaxValue() {
return maxValue;
}
public void setMaxValue(int maxValue) {
this.maxValue = maxValue;
}
public int getValue() {
String valueStr = tv_value.getText().toString().trim();//文本的内容
if (!TextUtils.isEmpty(valueStr)){
value = Integer.valueOf(valueStr);
}
return value;
}
public void setValue(int value) {
this.value = value;
tv_value.setText(value+"");
}
public int getMinValue() {
return minValue;
}
public void setMinValue(int minValue) {
this.minValue = minValue;
}
public NumberAddSubView(Context context) {
this(context, null);
}
public NumberAddSubView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public NumberAddSubView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
//要让布局和当前类形成一个整体
View.inflate(context, R.layout.number_add_sub_view, this);
btn_sub = (Button) findViewById(R.id.btn_sub);
btn_add = (Button) findViewById(R.id.btn_add);
tv_value = (TextView) findViewById(R.id.tv_value);
getValue();//获得当前值
//设置点击事件
btn_add.setOnClickListener(this);
btn_sub.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.btn_sub://减
subNumber();
if (listener != null){
listener.onButtonSub(v,value);
}
break;
case R.id.btn_add://加
addNumber();
if (listener != null){
listener.onButtonAdd(v,value);
}
break;
}
}
/**
* 减
*/
private void subNumber() {
if (value > minValue){
value -= 1;
}
setValue(value);
}
/**
* 加
*/
private void addNumber() {
if (value < maxValue){
value += 1;
}
setValue(value);
}
/**
* 监听数字增加减少控件
*/
public interface OnNumberClickListener{
/**
* 当减少按钮被点击的时候回调
* @param view
* @param value
*/
void onButtonSub(View view,int value);
/**
* 当增加按钮被点击的时候回调
* @param view
* @param value
*/
void onButtonAdd(View view,int value);
}
public OnNumberClickListener listener;
/**
* 设置监听数字按钮
* @param listener
*/
public void setOnNumberClickListener(OnNumberClickListener listener){
this.listener = listener;
}
}
步骤三、自定义控件属性
新建一个attrs文件,名称自定义如:number_add_sub_view_attrs.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="NumberAddSubView">
<attr name="value" format="integer|reference"></attr>
<attr name="minValue" format="integer|reference"></attr>
<attr name="maxValue" format="integer|reference"></attr>
<attr name="NumberAddSubBackground" format="reference"></attr>
<attr name="NumberAddBackground" format="reference"></attr>
<attr name="NumberSubBackground" format="reference"></attr>
</declare-styleable>
</resources>
步骤四、在自定义类中获取属性
import android.annotation.TargetApi;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.os.Build;
import android.support.v7.widget.TintTypedArray;
import android.text.TextUtils;
import android.util.AttributeSet;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.TextView;
import static android.icu.lang.UCharacter.GraphemeClusterBreak.T;
/**
* 自定义数字加减控件
* Created by willkong on 2016/12/14.
*/
public class NumberAddSubView extends LinearLayout implements View.OnClickListener {
private Button btn_sub;
private Button btn_add;
private TextView tv_value;
//属性监听
private int value = 1;//默认值
private int minValue = 1;//最小值
private int maxValue = 10;//最大值
public int getMaxValue() {
return maxValue;
}
public void setMaxValue(int maxValue) {
this.maxValue = maxValue;
}
public int getValue() {
String valueStr = tv_value.getText().toString().trim();//文本的内容
if (!TextUtils.isEmpty(valueStr)){
value = Integer.valueOf(valueStr);
}
return value;
}
public void setValue(int value) {
this.value = value;
tv_value.setText(value+"");
}
public int getMinValue() {
return minValue;
}
public void setMinValue(int minValue) {
this.minValue = minValue;
}
public NumberAddSubView(Context context) {
this(context, null);
}
public NumberAddSubView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
@TargetApi(Build.VERSION_CODES.JELLY_BEAN)
public NumberAddSubView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
//要让布局和当前类形成一个整体
View.inflate(context, R.layout.number_add_sub_view, this);
btn_sub = (Button) findViewById(R.id.btn_sub);
btn_add = (Button) findViewById(R.id.btn_add);
tv_value = (TextView) findViewById(R.id.tv_value);
getValue();//获得当前值
//设置点击事件
btn_add.setOnClickListener(this);
btn_sub.setOnClickListener(this);
//得到属性
if (attrs != null){
TintTypedArray typedArray = TintTypedArray.obtainStyledAttributes
(context,attrs,R.styleable.NumberAddSubView);
int value = typedArray.getInt(R.styleable.NumberAddSubView_value,0);
if (value > 0){
setValue(value);
}
int minValue = typedArray.getInt(R.styleable.NumberAddSubView_minValue,0);
if (minValue > 0){
setMinValue(minValue);
}
int maxValue = typedArray.getInt(R.styleable.NumberAddSubView_maxValue,0);
if (maxValue > 0){
setMaxValue(maxValue);
}
Drawable numberAddSubBackground = typedArray.getDrawable
(R.styleable.NumberAddSubView_NumberAddSubBackground);
if (numberAddSubBackground != null){
setBackground(numberAddSubBackground);
}
Drawable numberAddBackground = typedArray.getDrawable
(R.styleable.NumberAddSubView_NumberAddBackground);
if (numberAddBackground != null){
btn_add.setBackground(numberAddBackground);
}
Drawable numberSubBackground = typedArray.getDrawable
(R.styleable.NumberAddSubView_NumberSubBackground);
if (numberSubBackground != null){
btn_sub.setBackground(numberSubBackground);
}
}
}
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.btn_sub://减
subNumber();
if (listener != null){
listener.onButtonSub(v,value);
}
break;
case R.id.btn_add://加
addNumber();
if (listener != null){
listener.onButtonAdd(v,value);
}
break;
}
}
/**
* 减
*/
private void subNumber() {
if (value > minValue){
value -= 1;
}
setValue(value);
}
/**
* 加
*/
private void addNumber() {
if (value < maxValue){
value += 1;
}
setValue(value);
}
/**
* 监听数字增加减少控件
*/
public interface OnNumberClickListener{
/**
* 当减少按钮被点击的时候回调
* @param view
* @param value
*/
void onButtonSub(View view,int value);
/**
* 当增加按钮被点击的时候回调
* @param view
* @param value
*/
void onButtonAdd(View view,int value);
}
public OnNumberClickListener listener;
/**
* 设置监听数字按钮
* @param listener
*/
public void setOnNumberClickListener(OnNumberClickListener listener){
this.listener = listener;
}
}
至此,购物车的自定义数字加减控件就完成了。