滚动选择器主要用于在数据列表中快速选择其中一条数据,比如日期选择.首先给大伙看看最终的实现效果:
实现原理
- 绘制
代码中定义了几个重要的变量:
private int mVisibleItemCount = 3; // 可见的item数量
private int mSelected; // 当前选中的item下标
private int mItemHeight = 0; // 每个条目的高度 = mMeasureHeight/mVisibleItemCount
private int mCenterY; // 中间item的起始坐标y = mCenterPosition*mItemHeight
private float mMoveLength = 0; // item移动长度,负数表示向上移动,正数表示向下移动
通过上图可发现,这几个变量决定了滚动选择器中每个条目的绘制位置
protected void onDraw(Canvas canvas) {
// 中间item
mPaint.setColor(mCenterItemBackground);
float y = mCenterY;
canvas.drawRect(0, y, getWidth(), y + mItemHeight, mPaint);
// 传入位置信息,绘制item
drawItem(canvas, mData, mSelected, 0, mMoveLength, mCenterY + mMoveLength);
int length = Math.max(mCenterPosition, mVisibleItemCount - mCenterPosition);
int positon;
// 上下两边
for (int i = 1; i <= length && i <= mData.size(); i++) {
if (i <= mCenterPosition + 1) { // 上面的items,相对位置为 -i
positon = mSelected - i < 0 ? mData.size() + mSelected - i