首先呈上效果图
现在很多地方都用到了滚轮布局WheelView,比如在选择生日的时候,风格类似系统提供的DatePickerDialog,开源的控件也有很多,不过大部分都是根据当前项目的需求绘制的界面,因此我就自己写了一款比较符合自己项目的WheelView。
首先这个控件有以下的需求:
1、能够循环滚动,当向上或者向下滑动到临界值的时候,则循环开始滚动
2、中间的一块有一块半透明的选择区,滑动结束时,哪一块在这个选择区,就选择这快。
3、继承自View进行绘制
然后进行一些关键点的讲解:
1、整体控件继承自View,在onDraw中进行绘制。整体包含三个模块,整个View、每一块的条目、中间选择区的条目(额外绘制一块灰色区域)。
2、通过动态设置或者默认设置的可显示条目数,在最上和最下再各加入一块,意思就是一共绘制showCount+2个条目。
3、当最上面的条目数滑动超过条目高度的一半时,进行动态条目更新:将最下面的条目删除加入第一个条目、将第一个条目删除加入最下面的条目。
4、外界可设置条目显示数、字体大小、颜色、选择区提示文字(图中那个年字)、默认选择项、padding补白等等。
5、在onTouchEvent中,得到手指滑动的渐变值,动态更新当前所有的条目。
6、在onMeasure中动态计算宽度,所有条目的宽度、高度、起始Y坐标等等。
7、通过当前条目和被选择条目的坐标,超过一半则视为被选择,并且滑动到对应的位置。
下面的是WheelView代码,主要是计算初始值、得到外面设置的值:
package cc.wxf.view.wheel;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import java.util.ArrayList;
import java.util.List;
/**
* Created by ccwxf on 2016/3/31.
*/
public class WheelView extends View {
public static final int FONT_COLOR = Color.BLACK;
public static final int FONT_SIZE = 30;
public static final int PADDING = 10;
public static final int SHOW_COUNT = 3;
public static final int SELECT = 0;
//总体宽度、高度、Item的高度
private int width;
private int height;
private int itemHeight;
//需要显示的行数
private int showCount = SHOW_COUNT;
//当前默认选择的位置
private int select = SELECT;
//字体颜色、大小、补白
private int fontColor = FONT_COLOR;
private int fontSize = FONT_SIZE;
private int padding = PADDING;
//文本列表
private List<String> lists;
//选中项的辅助文本,可为空
private String selectTip;
//每一项Item和选中项
private List<WheelItem> wheelItems = new ArrayList<WheelItem>();
private WheelSelect wheelSelect = null;
//手点击的Y坐标
private float mTouchY;
//监听器
private OnWheelViewItemSelectListener listener;
public WheelView(Context context) {
super(context);
}
public WheelView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public WheelView(Context context, AttributeSet attrs, int defStyl