前言：
这段时间好久没更新，最近对自定义View感兴趣，先是根据网上的一些例子仿做了一个仿微信通讯录的组合控件，就是那种带字母索引ListView，可惜不知什么原因，用android studio导出的arr包却老是报错，待我继续研究。
后来便搞了这个日历控件，一是对自定义的view感兴趣，二来后来的项目可能需要用到类似的控件，虽说网上也有类似的现成的控件下载，但是觉得自己动手又何尝不是一次联系的机会。
先上图
normal
日期单选
日期多选
由于不会上传视频，只能截图啦
自定义View的过程也不重复太多，毕竟网上这么多教程了
就总结一下流程吧
- 新建一个类继承于View或者View的子类
- 实现三个构造方法
- 可以在value目录下新建attrs.xml文件，再其中声明
<declare-styleable>以及内部的<attr>子标签来定义xml属性。 - 实现
onMeasure()方法以及最重要的onDraw()方法 - 因为是自定义的日历控件，所以我也重写了
dispatchTouchEvent()方法来解决响应事件。
思路：
- 要绘制出一个月的日历，需要下列几个参数
- 这个月的天数
- 这个月第一天是星期几
- 今天是几号
手画的，见谅
贴上最重要的onDraw()方法
protected void onDraw(Canvas canvas) {
//绘制背景色
canvas.drawColor(mBackground);
//绘制左箭头
mNumPaint.setColor(clickLeft ? mNormalButtonColor1 : mClickButtonColor2);
mNumPaint.setStrokeWidth(6);
mNumPaint.setAntiAlias(true);
canvas.drawLine(mViewWidth / 8, mViewHeight / 16, mViewWidth * 3 / 16, mViewHeight / 32, mNumPaint);
canvas.drawLine(mViewWidth / 8, mViewHeight / 16, mViewWidth * 3 / 16, mViewHeight * 3 / 32, mNumPaint);
mNumPaint.reset();
//绘制右箭头
mNumPaint.setColor(clickRight ? mNormalButtonColor1 : mClickButtonColor2);
mNumPaint.setStrokeWidth(6);
mNumPaint.setAntiAlias(true);
canvas.drawLine(mViewWidth * 7 / 8, mViewHeight / 16,
mViewWidth * 13 / 16, mViewHeight / 32, mNumPaint);
canvas.drawLine(mViewWidth * 7 / 8, mViewHeight / 16,
mViewWidth * 13 / 16, mViewHeight * 3 / 32, mNumPaint);
mNumPaint.reset();
//绘制年，月份
mNumPaint.setTextSize(mViewHeight / 16);
mNumPaint.setColor(mNormalTextColor1);
mNumPaint.setAntiAlias(true);
String theYear = year + "";
String theMonth = month + "";
canvas.drawText(theYear, mViewWidth / 2 - getTextWidth(mNumPaint, theYear) / 2,
mViewHeight / 16, mNumPaint);
mNumPaint.setTextSize(mViewHeight / 18);
mNumPaint.setColor(mNormalTextColor2);
canvas.drawText(theMonth, mViewWidth / 2 - getTextWidth(mNumPaint, theMonth) / 2,
mViewHeight / 8, mNumPaint);
mNumPaint.reset();
//绘制日历
xInterval = mViewWidth / 7;
yInterval = mViewHeight / 8;
int day = 0;
float x;
float y;
int theday;
boolean isToday = false;
boolean isCheckDay = false;
float offset = 0;
radius = mViewWidth / 19;
for (int i = 0; i < weekName.length; i++) {
x = i * xInterval + mNormalTextSize / 2;
y = 1 * yInterval + yInterval / 2;
if (i == 0 || i == weekName.length - 1) {
drawNum(weekName[i], mNormalTextSize, mNormalTextColor2, x, y,
canvas, isToday, offset);
} else {
drawNum(weekName[i], mNormalTextSize, mNormalTextColor1, x, y,
canvas, isToday, offset);
}
}
mNumPaint.reset();
String str;
for (int i = 2; i < 8; i++) {
for (int j = 0; j < 7; j++) {
if (i == 2 && j == 0) {
j = weekOfFirstDay;
}
if (day > allDays.length - 1) {
theday = -1;
} else {
theday = allDays[day];
}
str = "" + theday;
if (theday == -1) {
str = "";
}
//单个数字的偏移量
if (theday < 10 && theday > 0) {
offset = mNormalTextSize / 4;
}
//计算数字的位置
y = i * yInterval + yInterval / 2;
x = j * xInterval + mNormalTextSize / 2 -
getTextWidth(mNumPaint, str) + offset;
//判断是否为今天
isToday = theday == today;
if (isToday) {
drawACircle(x, y, Color.argb(255, 254, 140, 26),
radius, canvas, offset);
}
//如果数字是checkDay
isCheckDay = theday == firstCheckDay;
if (isCheckDay) {
drawACircle(x, y, 0xffa0c8c8, radius, canvas, offset);
}
if (secondCheckDay != -2) {
if (theday > firstCheckDay && theday <= secondCheckDay) {
drawACircle(x, y, 0xffa0c8c8, radius, canvas, offset);
isCheckDay = true;
}
}
if (j == 0 || j == 6) {
drawNum(str, mNormalTextSize, mNormalTextColor2,
x, y, canvas, isToday || isCheckDay, offset);
} else {
drawNum(str, mNormalTextSize, mNormalTextColor1,
x, y, canvas, isToday || isCheckDay, offset);
}
offset = 0;
day++;
mNumPaint.reset();
}
}
}
再贴上dispatchTouchEvent()方法
public boolean dispatchTouchEvent(MotionEvent event) {
//获取事件的位置
float touchX = event.getX();
float touchY = event.getY();
if (!canClick) {
return true;
}
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
if (touchY < 3 * mViewHeight / 32 && touchY > mViewHeight / 32) {
if (touchX < 3 * mViewWidth / 16 && touchX > mViewWidth / 8) {
clickLeft = true;
//左箭头事件
if (turnPageListener != null) {
turnPageListener.OnLeftDown(today, month, year);
}
}
if (touchX < 7 * mViewWidth / 8 && touchX > 13 * mViewWidth / 16) {
clickRight = true;
//右箭头事件
if (turnPageListener != null) {
turnPageListener.OnRightUp(today, month, year);
}
}
}
//以下是对日历的事件处理
int theX = (int) ((touchX + 0.1 * xInterval) / xInterval);//获取第几列
int theY = (int) ((touchY + 0.2 * yInterval) / yInterval);//获取第几行
if (theY < 2) {
theY = 2;
}
//得到是哪一天
int num = (theY - 2) * 7 + theX - weekOfFirstDay;
int day;
if (num < 0 || num > allDays.length - 1) {
num = -2;
day = 0;
} else {
day = allDays[num];
}
float x = theX * xInterval + mNormalTextSize / 2 -
mNumPaint.measureText("" + day);
float y = theY * yInterval + yInterval / 2;
//判断是否点击在每个数字为中心的圆内
boolean isclick = isClick(x, y, num, touchX, touchY);
//有三种状态 初始状态（00），第一次点击（10），第二次点击（11）
if (!firstClick) {
firstClick = true;
} else if (!secondClick) {
secondClick = true;
} else {
firstClick = false;
secondClick = false;
firstCheckDay = -2;
secondCheckDay = -2;
}
//处理点击在月份天数外所引起的数值问题
if (isclick && num != -2 && firstClick && !secondClick) {
firstCheckDay = allDays[num];
}
if (firstClick && firstCheckDay == -2) {
firstClick = false;
}
if (isclick && num != -2 && secondClick) {
if (allDays[num] < firstCheckDay) {
firstCheckDay = allDays[num];
secondClick = false;
} else {
secondCheckDay = allDays[num];
}
}
if (secondClick && secondCheckDay == -2) {
secondClick = false;
}
//
//调用接口
if (firstClick && !secondClick) {
if (chooseListener != null) {
chooseListener.onSingleChoose(firstCheckDay);
}
} else if (firstClick && secondClick) {
int numO = secondCheckDay - firstCheckDay + 1;
int[] days = new int[numO];
int tday = firstCheckDay;
for (int j = 0; j < numO; j++) {
days[j] = tday++;
}
if (chooseListener != null) {
chooseListener.onDoubleChoose(days);
}
}
break;
case MotionEvent.ACTION_UP:
//左箭头事件
if (clickLeft) {
if (turnPageListener != null) {
turnPageListener.OnLeftUp(today, month, year);
}
clickLeft = !clickLeft;
preMonth();
}
//右箭头事件
if (clickRight) {
if (turnPageListener != null) {
turnPageListener.OnRightUp(today, month, year);
}
clickRight = !clickRight;
nextMonth();
}
break;
}
invalidate();
return true;
}
待完善的地方
- 日期的多选还没做到跨月
- 没有做动画
发现在对日期的绘制位置的计算出了偏差，待下次更新！
网友评论