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个构造方法，默认的布局文件调用的是两个参数的构造方法，所以记得让所有的构造调用我们的三个参数的构造，我们在三个参数的构造中获得自定义属性。

package com.bawei.com.myapplication;

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

package com.bawei.com.myapplication;


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>