自定义控件实现一个UpDownView(1)

先看下什么叫UpDownView：

[img]http://dl.iteye.com/upload/attachment/526019/66df460b-8405-3231-acb0-8c5610c2bb9c.png[/img]
这就叫UpDownView，:P

先看代码：

package com.ql.view;

import java.text.DecimalFormat;

import com.ql.app.R;
import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.LinearLayout;

public class UpDownView extends LinearLayout {
	private final static String tag="UpDownView";
	private ImageView iv_minus,iv_plus;
	private EditText et_input;

	public UpDownView(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
		Log.i(tag, "UpDownView1");
	}
	public UpDownView(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
		Log.i(tag, "UpDownView2");
	}
	@Override
	protected void onFinishInflate() {
		// TODO Auto-generated method stub
		super.onFinishInflate();
		Log.i(tag, "onFinishInflate");
		View view=LayoutInflater.from(getContext()).inflate(R.layout.up_down_view, this);
		iv_minus=(ImageView)view.findViewById(R.id.iv_minus);
		iv_plus=(ImageView)view.findViewById(R.id.iv_plus);
		et_input=(EditText)view.findViewById(R.id.et_input);

		iv_minus.setOnClickListener(listener);
		iv_plus.setOnClickListener(listener);
	}

	OnClickListener listener=new OnClickListener() {

		@Override
		public void onClick(View v) {
			// TODO Auto-generated method stub
			switch (v.getId()) {
			case R.id.iv_minus:
				doMinus();
				break;
			case R.id.iv_plus:
				doPlus();
				break;

			default:
				break;
			}
		}
	};

	private double number;//当前量
	private double step=1000;//步长，每次加减的量
	private double max=10000;//最大量
	private double min=-10000;//最小量

	private void doPlus(){
		String temp=et_input.getText().toString();
		if(temp.length()==0){
			number=0;
		}else{
			number=Double.parseDouble(temp);
		}
		number+=step;
		if(number>max){
			number=max;
		}
		et_input.setText(convertNumberToString(number,pattern));
	}

	private void doMinus(){
		String temp=et_input.getText().toString();
		if(temp.length()==0){
			number=0;
		}else{
			number=Double.parseDouble(temp);
		}
		number-=step;
		if(number<min){
			number=min;
		}
		et_input.setText(convertNumberToString(number,pattern));
	}

	private String pattern = "############.##";
	/**
	 * Util
	 * @param value
	 * @param pattern
	 * @return
	 */
	public static String convertNumberToString(Number value, String pattern) {
		try {
			DecimalFormat decimalFormat = new DecimalFormat(pattern);
			return decimalFormat.format(value);
		} catch (Exception e) {
			e.printStackTrace();
		}
		return null;
	}

	public double getNumber() {
		return number;
	}
	public void setNumber(double number) {
                et_input.setText(convertNumberToString(number,pattern));
		this.number = number;
	}
	public double getStep() {
		return step;
	}
	public void setStep(double step) {
		this.step = step;
	}
	public double getMax() {
		return max;
	}
	public void setMax(double max) {
		this.max = max;
	}
	public double getMin() {
		return min;
	}
	public void setMin(double min) {
		this.min = min;
	}
}

其实挺简单的，只要在onFinishInflate中加载一个布局就可以了。
布局up_down_view.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="wrap_content"
	android:layout_gravity="center_vertical"
	android:orientation="horizontal"
    >
    <ImageView android:id="@+id/iv_minus"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:layout_gravity="center_vertical"
	android:src="@drawable/sh_trade_minus"
	android:scaleType="fitCenter"
	/>
	<EditText  android:id="@+id/et_input"
	android:layout_width="fill_parent"
	android:layout_height="wrap_content"
	android:layout_weight="1"
	android:text=""
	android:singleLine="true"
	android:inputType="numberDecimal"
	/>
	<ImageView android:id="@+id/iv_plus"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:layout_gravity="center_vertical"
	android:src="@drawable/sh_trade_plus"
	android:scaleType="fitCenter"
	/>
</LinearLayout>

使用：
在布局文件中引入：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <TextView  
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="@string/hello"
    />
    <com.ql.view.UpDownView android:id="@+id/upDownView"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"
    />
</LinearLayout>

然后可以通过UpDownView提供的setter/getter函数对它进行初始化需要的数据了。

UpDownView view=(UpDownView)findViewById(R.id.upDownView);
view.setMax(100);
view.setStep(1);
view.setMin(0);
view.setNumber(90.01);//没有的话显示为""

此控件支持小数，看源码中pattern = "############.##"就知道了。该控件适合对金额的显示。
用到的两张图：

[img]http://dl.iteye.com/upload/attachment/526025/fae34d71-9ffb-3900-91d2-60ae14e6a19b.png[/img]

[img]http://dl.iteye.com/upload/attachment/526027/520afa6a-3e04-3068-99ad-4f3ab69eb8b3.png[/img]

[url]https://github.com/saiwu-bigkoo/Android-SnappingStepper[/url]