▲ Android 自定義日曆簽到效果

如果需要更多的定製化需求請直接看我這篇,Android 使用RecycleView自定義日曆簽到效果
,自定義日曆2.0的功能遠遠大於我這個篇1.0的效果。

效果展示
在這裏插入圖片描述

自定義1.0的效果,適用於需求差不多,拿過來直接使用的。畢竟大家時間寶貴.
在這裏插入圖片描述
這裏的這個圖標是可以根據自己的需求更換的,比如連續簽到有禮包的這種,還有忘記簽到狀態之類的。

代碼實現

通過自定義View,把帶有日曆的Adapter加載到這個View中,然後通過這個View實現 OnTodayClickListener完成簽到。

核心代碼

public class SignView extends View {
    private static final String[] WEEK_MARK = {"一", "二", "三", "四", "五", "六", "日"};

    private static final int MAX_COLUMN = 7;
    /**
     * 周內
     */
    private static final int COLOR_MARKER_WEEKDAY = 0xFF999999;
    private static final int COLOR_MARKER_WEEKEND = 0xFF1B89CD;
    /**
     * 已簽到背景色
     */
    private static final int COLOR_BACKGROUND_HIGHLIGHT = 0xFF1B89CD;
    /**
     * 未簽到背景色
     */
    private static final int COLOR_BACKGROUND_NORMAL = 0xFFFFFFFF;
    /**
     * 等待簽到背景色
     */
    private static final int COLOR_BACKGROUND_WAIT = 0xFFFE7471;
    /**
     * 已簽到文字顏色
     */
    private static final int COLOR_TEXT_HIGHLIGHT = 0xFFFFFFFF;
    /**
     * 未簽到文字顏色
     */
    private static final int COLOR_TEXT_NORMAL = 0xFF606060;
//    /**
//     * 不可用文字顏色
//     */
//    private static final int COLOR_TEXT_DISABLED = 0xFFD4D4D4;

    private static final int MARKER_TEXT_SIZE = 40;
    private static final int CELL_TEXT_SIZE = 40;

    private static final int VERTICAL_SPACE = 51;
    private static final int VERTICAL_MARGIN = 62;
    private static final int HORIZONTAL_MARGIN = 39;
    private static final int CELL_SIZE = 80;
    private static final int WAIT_LINE_SIZE = 14;

    private int dayOfMonthToday;
    private int markerTextY;
    private int verticalCellTop;
    private int sumDayOfMonth;
    private int daysOfFirstWeek;
    private int horizontalSpace;
    private int deltaTextCellY;
    private int deltaTextMarkerY;

    private int verticalSpace;
    private int verticalMargin;
    private int horizontalMargin;
    private int cellSize;
    private int waitLineSize;

    private Path waitPath;
    private Rect waitRect;
    private Paint paintWeekday;
    private Paint paintWeekend;
    private Paint paintTextNormal;
    private Paint paintTextHighlight;
    private Paint paintBackgroundWait;
    private Paint paintBackgroundNormal;
    private Paint paintBackgroundHighlight;
    private CalendarAdapter adapter;
    private ResolutionUtil resolutionUtil;
    private Paint paintReward;
    private Paint paintRewardX;
    public SignView(Context context) {
        this(context, null);
    }

    public SignView(Context context, AttributeSet attrs) {
        this(context, attrs, -1);
    }

    public SignView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initResolution();
        initPaint();
        initData();
    }

    private void initResolution() {
        resolutionUtil = ResolutionUtil.getInstance();
        verticalSpace = resolutionUtil.formatVertical(VERTICAL_SPACE);
        verticalMargin = resolutionUtil.formatVertical(VERTICAL_MARGIN);
        horizontalMargin = resolutionUtil.formatHorizontal(HORIZONTAL_MARGIN);
        cellSize = resolutionUtil.formatVertical(CELL_SIZE);
        waitLineSize = resolutionUtil.formatVertical(WAIT_LINE_SIZE);
    }

    private void initPaint() {
        int markerTextSize = resolutionUtil.formatVertical(MARKER_TEXT_SIZE);
        int cellTextSize = resolutionUtil.formatVertical(CELL_TEXT_SIZE);

        paintWeekday = new Paint();
        paintWeekday.setAntiAlias(true);
        paintWeekday.setColor(COLOR_MARKER_WEEKDAY);
        paintWeekday.setTextSize(markerTextSize);
        paintWeekday.setTextAlign(Paint.Align.CENTER);

        paintWeekend = new Paint();
        paintWeekend.setAntiAlias(true);
        paintWeekend.setColor(COLOR_MARKER_WEEKEND);
        paintWeekend.setTextSize(markerTextSize);
        paintWeekend.setTextAlign(Paint.Align.CENTER);

        paintTextNormal = new Paint();
        paintTextNormal.setAntiAlias(true);
        paintTextNormal.setColor(COLOR_TEXT_NORMAL);
        paintTextNormal.setTextSize(cellTextSize);
        paintTextNormal.setTextAlign(Paint.Align.CENTER);

        //簽到畫筆顏色
        paintTextHighlight = new Paint();
        paintTextHighlight.setAntiAlias(true);
        paintTextHighlight.setAlpha(00);//透明度
        paintTextHighlight.setTextSize(cellTextSize);
        paintTextHighlight.setTextAlign(Paint.Align.CENTER);

        paintBackgroundWait = new Paint();
        paintBackgroundWait.setAntiAlias(true);
        paintBackgroundWait.setColor(COLOR_BACKGROUND_WAIT);
        paintBackgroundWait.setStrokeWidth(2);
        paintBackgroundWait.setStyle(Paint.Style.STROKE);

        //未簽到 背景
        paintBackgroundNormal = new Paint();
        paintBackgroundNormal.setAntiAlias(true);
        paintBackgroundNormal.setColor(COLOR_BACKGROUND_NORMAL);
        paintBackgroundNormal.setStrokeWidth(2);
        paintBackgroundNormal.setStyle(Paint.Style.FILL);


        //已簽到 背景
        paintBackgroundHighlight = new Paint();
        paintBackgroundHighlight.setAntiAlias(true);
       // paintBackgroundHighlight.setColor(COLOR_BACKGROUND_HIGHLIGHT);
        paintBackgroundHighlight.setStrokeWidth(2);
        paintBackgroundHighlight.setStyle(Paint.Style.FILL);

        //獎項
        paintReward = new Paint();
        paintReward.setAntiAlias(true);
        paintReward.setStrokeWidth(2);
        paintReward.setStyle(Paint.Style.FILL);

        paintRewardX = new Paint();
        paintRewardX.setAntiAlias(true);
        paintRewardX.setAlpha(00);//透明度
        paintRewardX.setTextSize(cellTextSize);
        paintRewardX.setTextAlign(Paint.Align.CENTER);
    }

    private void initData() {
        Paint.FontMetricsInt fmiMarker = paintWeekday.getFontMetricsInt();
        deltaTextMarkerY = -(fmiMarker.bottom - fmiMarker.top) / 2 - fmiMarker.top;
        markerTextY = verticalMargin + cellSize / 2;
        Paint.FontMetricsInt fmiCell = paintTextNormal.getFontMetricsInt();
        deltaTextCellY = -(fmiCell.bottom - fmiCell.top) / 2 - fmiCell.top;
        verticalCellTop = verticalMargin + cellSize;

        Calendar calendarToday = Calendar.getInstance();
        dayOfMonthToday = calendarToday.get(Calendar.DAY_OF_MONTH);
        int dayOfWeek;
        sumDayOfMonth = calendarToday.getActualMaximum(Calendar.DAY_OF_MONTH);

        Calendar calendarFirstDay = Calendar.getInstance();
        calendarFirstDay.set(Calendar.DAY_OF_MONTH, 1);
        dayOfWeek = calendarFirstDay.get(Calendar.DAY_OF_WEEK);
        if (dayOfWeek == Calendar.SUNDAY) {
            dayOfWeek = 7;
        } else {
            dayOfWeek = dayOfWeek - 1;
        }
        daysOfFirstWeek = MAX_COLUMN - dayOfWeek + 1;
    }

    private void createWaitBackground(int topX, int topY) {
        waitPath = new Path();
        waitPath.moveTo(topX, topY + waitLineSize);
        waitPath.lineTo(topX, topY);
        waitPath.lineTo(topX + waitLineSize, topY);

        waitPath.moveTo(topX + cellSize - waitLineSize, topY + cellSize);
        waitPath.lineTo(topX + cellSize, topY + cellSize);
        waitPath.lineTo(topX + cellSize, topY + cellSize - waitLineSize);

        waitRect = new Rect(topX, topY, topX + cellSize, topY + cellSize);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        horizontalSpace = (w - MAX_COLUMN * cellSize - horizontalMargin * 2) / (MAX_COLUMN - 1);
    }

    @Override
    public void draw(Canvas canvas) {
        super.draw(canvas);
        drawWeekMark(canvas);
        drawCellsBackground(canvas);
        drawCells(canvas);
    }

    private void drawWeekMark(Canvas canvas) {
        int y = markerTextY + deltaTextMarkerY;
        for (int i = 0; i < 7; i++) {
            int x = horizontalMargin + i * (horizontalSpace + cellSize)
                    + cellSize / 2;
            if (i < 5) {
                canvas.drawText(WEEK_MARK[i], x, y, paintWeekday);
            } else {
                canvas.drawText(WEEK_MARK[i], x, y, paintWeekend);
            }
        }
    }

    private void drawCellsBackground(Canvas canvas) {
        for (int i = 1; i <= dayOfMonthToday; i++) {
            drawCellBackground(canvas, i, getColumnIndex(i), getRowIndex(i));
        }
    }

    /**
     * 根據行列序號繪製日期背景
     *
     * @param canvas     畫布
     * @param dayOfMonth 日期
     * @param column     列序號
     * @param row        行序號
     */
    private void drawCellBackground(Canvas canvas, int dayOfMonth, int column, int row) {
        int x = horizontalMargin + column * (horizontalSpace + cellSize)
                + cellSize / 2;
        int y = verticalCellTop + verticalSpace * (row + 1) + cellSize * row + cellSize / 2;
        if (adapter != null) {
            DayType dayType = adapter.getType(dayOfMonth);
            switch (dayType) {
                case WAITING:
                    if (waitPath == null) {
                        createWaitBackground(x - cellSize / 2, y - cellSize / 2);
                    }
                    canvas.drawPath(waitPath, paintBackgroundWait);
                    break;
                case SIGNED:
                    canvas.drawBitmap(BitmapFactory.decodeResource(getResources(), R.mipmap.icon_m), x-30, y-30, paintBackgroundHighlight);
                    break;
                case REWARD:
                   canvas.drawBitmap(BitmapFactory.decodeResource(getResources(), R.mipmap.icon_j), x-30, y-30, paintReward);
                   // canvas.drawCircle(x, y, cellSize / 2, paintBackgroundNormal);
                    break;
                default:
                    canvas.drawCircle(x, y, cellSize / 2, paintBackgroundNormal);
                    break;
            }
        } else {
            canvas.drawCircle(x, y, cellSize / 2, paintBackgroundNormal);
        }
    }

    private void drawCells(Canvas canvas) {
        for (int i = 1; i <= sumDayOfMonth; i++) {
            drawCell(canvas, i, getColumnIndex(i), getRowIndex(i));
        }
    }

    /**
     * 根據行列序號繪製日期
     *
     * @param canvas     畫布
     * @param dayOfMonth 日期
     * @param column     列序號
     * @param row        行序號
     */
    private void drawCell(Canvas canvas, int dayOfMonth, int column, int row) {
        int x = horizontalMargin + column * (horizontalSpace + cellSize)
                + cellSize / 2;
        int y = verticalCellTop + verticalSpace * (row + 1) + cellSize * row + cellSize / 2
                + deltaTextCellY;
        if (adapter != null && dayOfMonth <= dayOfMonthToday) {
            DayType dayType = adapter.getType(dayOfMonth);
            Paint paint;
            switch (dayType) {
                case SIGNED:
                    paint = paintTextHighlight;
                    break;
                case REWARD:
                    paint = paintRewardX;
                    break;
                default:
                    paint = paintTextNormal;
                    break;
            }
            canvas.drawText(String.valueOf(dayOfMonth), x, y, paint);
        } else {
            canvas.drawText(String.valueOf(dayOfMonth), x, y, paintTextNormal);
        }
    }

    /**
     * 獲取列序號
     *
     * @param dayOfMonth 日期
     * @return 列序號
     */
    private int getColumnIndex(int dayOfMonth) {
        Calendar calendar = Calendar.getInstance();
        calendar.set(Calendar.DAY_OF_MONTH, dayOfMonth);
        int dayOfWeek = calendar.get(Calendar.DAY_OF_WEEK);
        if (dayOfWeek == Calendar.SUNDAY) {
            dayOfWeek = 6;
        } else {
            dayOfWeek = dayOfWeek - 2;
        }
        return dayOfWeek;
    }

    /**
     * 獲取行序號
     *
     * @param dayOfMonth 日期
     * @return 行序號
     */
    private int getRowIndex(int dayOfMonth) {
        float weight = (dayOfMonth - daysOfFirstWeek) / (MAX_COLUMN * 1f);
        double rowIndexDouble = Math.abs(Math.ceil(weight));
        return (int) rowIndexDouble;
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        if (event.getAction() == MotionEvent.ACTION_UP) {
            float x = event.getX();
            float y = event.getY();
            if (waitPath != null) {
                if (adapter.getType(dayOfMonthToday).equals(DayType.WAITING)) {
                    if (x >= waitRect.left && y >= waitRect.top && x <= waitRect.right && y <= waitRect.bottom) {
                        if (onTodayClickListener != null) {
                            onTodayClickListener.onTodayClick();
                        }
                    }
                }
            }
        }
        return true;
    }

    public void setAdapter(CalendarAdapter adapter) {
        this.adapter = adapter;
        this.invalidate();
    }

    public int getDayOfMonthToday() {
        return dayOfMonthToday;
    }

    public void notifyDataSetChanged() {
        invalidate();
    }

    private OnTodayClickListener onTodayClickListener;

    public void setOnTodayClickListener(OnTodayClickListener onTodayClickListener) {
        this.onTodayClickListener = onTodayClickListener;
    }

    public interface OnTodayClickListener {
        void onTodayClick();
    }

    public enum DayType {
        /**
         * 已簽到狀態,時間已過
         */
        SIGNED(0),
        /**
         * 未簽到狀態,時間已過
         */
        UNSIGNED(1),
        /**
         * 等待狀態,即當日還未簽到
         */
        WAITING(2),
        /**
         * 不可達到狀態,未到時間
         */
        UNREACHABLE(3),
        /**
         * 不可用狀態,非當前月份
         */
        DISABLED(5),

        /**
         * 獎賞
         */
        REWARD(4);

        private int value;

        DayType(int value) {
            this.value = value;
        }

        public int getValue() {
            return value;
        }

        public static DayType valueOf(int value) {
            switch (value) {
                case 0:
                    return SIGNED;
                case 1:
                    return UNSIGNED;
                case 2:
                    return WAITING;
                case 3:
                    return UNREACHABLE;
                case 4:
                    return REWARD;
                case 5:
                    return DISABLED;
                default:
                    return DISABLED;
            }
        }
    }
}

【源碼地址】

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章