Android使用自定义View实现购物车的加减

实现自定义控件的三种方法：组合控件、自绘控件、继承控件

（一）组合控件

组合控件顾名思义就是将一些小的控件组合起来形成一个新的控件，这些小的控件多是系统自带的控件。比如很多应用中普遍使用的标题栏控件，其实用的就是组合控件，那么下面将通过实现一个简单的标题栏自定义控件来说一说控件的用法。

（二）自绘控件

自绘控件的内容都是自己绘制出来的，在View的onDraw方法中完成绘制。下面就实现以个简单的计数器，每点击一次，计数值就加 1 并显示出来。

（三）继承控件

就是继承已有的控件，创建新控件，保留继承的父控件的特性，并且还可以引入新特性。下面就以支持横向滑动，删除列表项的自定义ListView的实现来介绍。

下面来做一个案例

示例图：

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

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="AddDeleteViewStyle">
        <attr name="left_text" format="string"/>
        <attr name="right_text" format="string"/>
        <attr name="middle_text" format="string"/>
    </declare-styleable>

</resources>

我们定义了字体、字体颜色、字体大小3个属性，format是值该属性的取值类型：

一共有：string,color,demension,integer,enum,reference,float,boolean,fraction,flag;（google上面有详细介绍）

然后在布局中声明我们的自定义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"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" tools:context="com.bawei.com.myapplication.MainActivity"
    android:orientation="vertical">
    <com.bawei.com.myapplication.AddDeleteView
        android:id="@+id/adv_main"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:left_text="减"
        app:middle_text="3"
        app:right_text="加"></com.bawei.com.myapplication.AddDeleteView>
</LinearLayout>

一定要引入 xmlns: app = "http://schemas.android.com/apk/res-auto"

2、在View的构造方法中，获得我们的自定义的样式

我们重谢了3个构造方法，默认的布局文件条用的是两个参数的构造方法，所以记得让所有的构造调用我们的三个参数的构造，我们在三个参数的构造中获得自定义属性。

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.LinearLayout;

/**
 * Created by WuXirui
 * Create Time: 2017/11/1
 * Description:
 */

public class AddDeleteView extends LinearLayout {

    private OnAddDelClickListener listener;
    private EditText et_number;

    public void setOnAddDelClickListener(OnAddDelClickListener listener) {
        if (listener != null) {
            this.listener = listener;
        }
    }


    interface OnAddDelClickListener{
        void onAddClick(View v);
        void onDelClick(View v);
    }

    public AddDeleteView(Context context) {
        this(context,null);
    }

    public AddDeleteView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs,0);

    }

    public AddDeleteView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView(context,attrs,defStyleAttr);
    }
    private void initView(Context context,AttributeSet attrs,int defStyleAttr){
        View.inflate(context,R.layout.layout_add_delete,this);
        Button but_add = findViewById(R.id.but_add);
        Button but_delete = findViewById(R.id.but_delete);
        et_number = findViewById(R.id.et_number);

        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.AddDeleteViewStyle);
        String left_text = typedArray.getString(R.styleable.AddDeleteViewStyle_left_text);
        String middle_text = typedArray.getString(R.styleable.AddDeleteViewStyle_middle_text);
        String right_text = typedArray.getString(R.styleable.AddDeleteViewStyle_right_text);
        but_delete.setText(left_text);
        but_add.setText(right_text);
        et_number.setText(middle_text);
        //释放资源
        typedArray.recycle();
        
        but_add.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {
                listener.onAddClick(view);
            }
        });
        but_delete.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {
                listener.onDelClick(view);
            }
        });
    }
    /**
     * 对外提供设置EditText值的方法
     */
    public void setNumber(int number){
        if (number>0){
            et_number.setText(number+"");
        }
    }
    /**
     * 得到控件原来的值
     */
    public int getNumber(){
        int number = 0;
        try {
            String numberStr = et_number.getText().toString().trim();
            number = Integer.valueOf(numberStr);
        } catch (Exception e) {
            number = 0;
        }
        return number;
    }
}

MainActivity

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.View;

public class MainActivity extends AppCompatActivity {
    private static final String TAG = "MainActivity";
    private AddDeleteView adv;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        adv = (AddDeleteView) findViewById(R.id.adv_main);


        adv.setOnAddDelClickListener(new AddDeleteView.OnAddDelClickListener() {
            @Override
            public void onAddClick(View v) {
                Log.i(TAG, "onAddClick: 执行");
                int origin = adv.getNumber();
                origin++;
                adv.setNumber(origin);
            }

            @Override
            public void onDelClick(View v) {
                int origin = adv.getNumber();
                origin--;
                adv.setNumber(origin);
            }
        });
    }
}

layout_add_delete.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    >
    <Button
        android:id="@+id/but_delete"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="-"
        android:textSize="30dp"
        />
    <EditText
        android:id="@+id/et_number"
        android:layout_width="100dp"
        android:inputType="number"
        android:layout_height="wrap_content"
        android:gravity="center"

        />
    <Button
        android:id="@+id/but_add"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="+"
        android:textSize="30dp"
        />
</LinearLayout>
</LinearLayout>