写点什么

Android 开源的精美日历控件,热插拔设计的万能自定义 UI(1)

用户头像
Android架构
关注
发布于: 3 小时前

</declare-styleable>

XML 用法

如果需要在日历控件下方使用其它控件,使用 CalendarLayout 控件即可,calendar_content_view_id 为其它控件的 id,支持任意控件,如 RecyclerView、ListView。CalendarView 的 calendar_card_view 为任意自定义实现的日历绘制控件路径。

<com.haibin.calendarview.CalendarLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"android:background="#fff"app:calendar_content_view_id="@+id/linearView">


<com.haibin.calendarview.CalendarViewandroid:id="@+id/calendarView"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="#fff"app:current_month_text_color="#333333"app:current_month_lunar_text_color="#CFCFCF"app:min_year="2004"app:other_month_text_color="#e1e1e1"app:scheme_text_color="#333"app:scheme_theme_color="#128c4b"app:selected_lunar_text_color


《Android学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》
浏览器打开:qq.cn.hn/FTe 免费领取
复制代码


="#CFCFCF"app:calendar_card_view="com.haibin.calendarviewproject.meizu.MeiZuCalendarCardView"app:selected_text_color="#333"app:selected_theme_color="#108cd4"app:week_background="#fff"app:week_text_color="#111" />


<LinearLayoutandroid:id="@+id/linearView"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@color/content_background"android:clickable="true"android:orientation="vertical"tools:ignore="KeyboardInaccessibleWidget"/></LinearLayout></com.haibin.calendarview.CalendarLayout>

熟悉一下这几个简单的特性,看看日历内容界面的绘制 BaseCalendarCardView,根据需求实现以下部分方法即可

/**


  • 开始绘制前的回调钩子,这里做一些初始化的操作,每次绘制只调用一次,性能高效

  • 没有需要可忽略不实现

  • 例如:

  • 1、需要绘制圆形标记事件背景,可以在这里计算半径

  • 2、绘制矩形选中效果,也可以在这里计算矩形宽和高*/protected void onPreviewHook() {// TODO: 2017/11/16}


/**


  • 循环绘制开始的回调,不需要可忽略

  • 绘制每个日历项的循环,用来计算 baseLine、圆心坐标等都可以在这里实现

  • @param x 日历 Card x 起点坐标

  • @param y 日历 Card y 起点坐标*/protected void onLoopStart(int x, int y) {// TODO: 2017/11/16}


/**


  • 绘制选中的日期

  • @param canvas canvas

  • @param calendar 日历日历 calendar

  • @param x 日历 Card x 起点坐标

  • @param y 日历 Card y 起点坐标

  • @param hasScheme hasScheme 非标记的日期*/protected abstract void onDrawSelected(Canvas canvas, Calendar calendar, int x, int y, boolean hasScheme);


/**


  • 绘制标记的日期 UI

  • @param canvas canvas

  • @param calendar 日历 calendar

  • @param x 日历 Card x 起点坐标

  • @param y 日历 Card y 起点坐标*/protected abstract void onDrawScheme(Canvas canvas, Calendar calendar, int x, int y);


/**


  • 绘制日历文本

  • @param canvas canvas

  • @param calendar 日历 calendar

  • @param x 日历 Card x 起点坐标

  • @param y 日历 Card y 起点坐标

  • @param hasScheme 是否是标记的日期

  • @param isSelected 是否选中*/protected abstract void onDrawText(Canvas canvas, Calendar calendar, int x, int y, boolean hasScheme, boolean isSelected);

举个例子:如果你的需求是类似魅族日历的 UI,那么第一步,继承 BaseCalendarCardView,然后实现 onDrawSelected、onDrawScheme、onDrawText 三个回调函数即可

public class MeiZuCalendarCardView extends BaseCalendarCardView {


private Paint mTextPaint = new Paint();private Paint mSchemeBasicPaint = new Paint();private float mRadio;private int mPadding;private float mSchemeBaseLine;


public MeiZuCalendarCardView(Context context) {super(context);


mTextPaint.setTextSize(dipToPx(context, 8));mTextPaint.setColor(0xff111111);mTextPaint.setAntiAlias(true);mTextPaint.setFakeBoldText(true);


mSchemeBasicPaint.setAntiAlias(true);mSchemeBasicPaint.setStyle(Paint.Style.FILL);mSchemeBasicPaint.setTextAlign(Paint.Align.CENTER);mSchemeBasicPaint.setColor(0xffed5353);mSchemeBasicPaint.setFakeBoldText(true);mRadio = dipToPx(getContext(), 7);mPadding = dipToPx(getContext(), 4);Paint.FontMetrics metrics = mSchemeBasicPaint.getFontMetrics();mSchemeBaseLine = mRadio - metrics.descent + (metrics.bottom - metrics.top) / 2 + dipToPx(getContext(), 1);


}


/**


  • 绘制选中的日期

  • @param canvas canvas

  • @param calendar 日历日历 calendar

  • @param x 日历 Card x 起点坐标

  • @param y 日历 Card y 起点坐标

  • @param hasScheme hasScheme 非标记的日期*/@Overrideprotected void onDrawSelected(Canvas canvas, Calendar calendar, int x, int y, boolean hasScheme) {mSelectedPaint.setStyle(Paint.Style.FILL);mSelectedPaint.setColor(0x80cfcfcf);canvas.drawRect(x + mPadding, y + mPadding, x + mItemWidth - mPadding, y + mItemHeight - mPadding, mSelectedPaint);}


/**

用户头像

Android架构

关注

还未添加个人签名 2021.10.31 加入

还未添加个人简介

评论

发布
暂无评论
Android开源的精美日历控件,热插拔设计的万能自定义UI(1)