用GirdView来实现复杂显示的日历

最新推荐文章于 2024-05-08 02:34:47 发布

进击的小羊

最新推荐文章于 2024-05-08 02:34:47 发布

阅读量2.8k

点赞数

分类专栏：原创 Android小知识点文章标签： GridView显示日历控件

本文链接：https://blog.csdn.net/mobilexu/article/details/17394545

版权

Android小知识点同时被 2 个专栏收录

119 篇文章 0 订阅

订阅专栏

原创

61 篇文章 0 订阅

订阅专栏

项目中急用能在日期下面显示小方块的日历控件，这一显示效果老总和我说是项目成功与否的关键，我之前下了俩个日历的源码发现都比较难用，所以心里没有底，就来先看看现在能在网上收刮到的日历都有哪些？

1：android原生的日历Calendar

　CalendarView控件的实现效果图如下所示：

　　这是Android3.0及以上版本自带的日历控件，我们可通过流动鼠标滑轮来选择上一月或是下一月，然后选择自己想要的日期，感觉就是灵活度不够，如果需要CalendarView更多的信息，可以查看Android官方文档：http://developer.android.com/reference/android/widget/CalendarView.html

2. 各种自定义控件

如果对其感兴趣可以在这位大神的博客中找到

我都下来看了一下，发现代码写的都狠牛逼，但是扩展性和美观都达不到我的要求，所以走上Github

3：Github上大神的开源项目

ExtendedCalendarView

看起来设计很符合我的胃口，日期里面还有小的标记，很像我要做的效果，后来不知道什么原因，我没有仔细研究这个项目。

还有Caldroid，TimesSquare for Android都不太容易扩展，所以就放弃了用人家的项目。

最后实在没办法了，自己用GridView开发试试看，依据就是，要显示一个日历，就是很多的日期项，上个月的日期和下个月的日期都用空白表示，本月的只要知道一共多少天按照顺序就可以用GridView显示，一旦能用GridView显示了，那么里面要显示很复杂的或者漂亮的效果就有可能了。

功夫不负有心人，最后我实现了下面的效果：

每一个item背景我用了渐变，所以还出现了一种意想不到的效果，可以看出每个蓝色的item 下面有有几个绿色的实心和空心的小方块。绿色的item是今天的日期，这样的一张图完美的实现的需求，不出意外，老板今天拿给客户看的时候，客户很满意，效果很是不错，最后老板夸了我，我很世故的说：“都是老板指导有方”。呵呵，完美的屌丝程序猿逆袭，太机智了我☺。

这逼装的略过哈，下面给出核心的代码（其实也不算核心，思路有了很简单的）

日期实体类：

public class CalendarCell {

	private int id; // id
	private int time;// 几号 24
	private Date date;// 准确的时间
	private int tag;// 标签 0:上个月 ， 1:这个月 2:下个月 
	private boolean isSelect; // 是否选中   今天
	private int count; // 这一天有几个任务

	public int getId() {
		return id;
	}

	public void setId(int id) {
		this.id = id;
	}

	public int getTime() {
		return time;
	}

	public void setTime(int time) {
		this.time = time;
	}

	public Date getDate() {
		return date;
	}

	public void setDate(Date date) {
		this.date = date;
	}

	public int getTag() {
		return tag;
	}

	public void setTag(int tag) {
		this.tag = tag;
	}

	public boolean isSelect() {
		return isSelect;
	}

	public void setSelect(boolean isSelect) {
		this.isSelect = isSelect;
	}

	public int getCount() {
		return count;
	}

	public void setCount(int count) {
		this.count = count;
	}

}

显示的fragment布局：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="30dp"
        android:gravity="center"
        android:orientation="horizontal" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/c2_brown2"
            android:gravity="center"
            android:padding="2dp"
            android:text="周一"
            android:textSize="@dimen/week_text_size" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/c2_brown2"
            android:gravity="center"
            android:text="周二"
            android:textSize="@dimen/week_text_size" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/c2_brown2"
            android:gravity="center"
            android:text="周三"
            android:textSize="@dimen/week_text_size" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/c2_brown2"
            android:gravity="center"
            android:text="周四"
            android:textSize="@dimen/week_text_size" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/c2_brown2"
            android:gravity="center"
            android:text="周五"
            android:textSize="@dimen/week_text_size" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/c2_brown2"
            android:gravity="center"
            android:text="周六"
            android:textSize="@dimen/week_text_size" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/c2_brown2"
            android:gravity="center"
            android:text="周日"
            android:textSize="@dimen/week_text_size" />
    </LinearLayout>

    <GridView
        android:id="@+id/gv_calendar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:cacheColorHint="@color/transparent"
        android:dividerHeight="2dp"
        android:fadingEdgeLength="2dp"
        android:fastScrollEnabled="true"
        android:footerDividersEnabled="false"
        android:horizontalSpacing="2dp"
        android:numColumns="7"
        android:scrollbars="vertical"
        android:scrollingCache="false"
        android:verticalSpacing="2dp" >
    </GridView>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="8dp"
        android:orientation="horizontal" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="本月人工数："
            android:textColor="@color/grey_middle" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:text="19.5"
            android:textColor="@color/android_green" />
    </LinearLayout>

</LinearLayout>

显示的Fragment：

/**
 * 日历-护工工作安排
 * 
 * @author Jinyang
 * 
 */
public class CalendarFragment extends SherlockFragment {
	public static String TAG = "CalendarFragment";
	private GridView mGridView;
	private CalendarAdapter mAdapter;

	private List<CalendarCell> mCellList;

	private static int GridCount = 42;

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		View viewRoot = inflater.inflate(R.layout.fragment_calendar, null);
		init(viewRoot);
		getDate();
		setListener();
		return viewRoot;
	}

	@SuppressWarnings("deprecation")
	private void init(View viewRoot) {
		setHasOptionsMenu(true);// 允许操作ActionBar；
		Date date = new Date();
		((MainActivity) getActivity()).setActionBarTitle(date.toLocaleString());
		mGridView = (GridView) viewRoot.findViewById(R.id.gv_calendar);
		mCellList = new ArrayList<CalendarCell>();
		mAdapter = new CalendarAdapter(getActivity(), mCellList,
				R.layout.item_calendar);
		mGridView.setAdapter(mAdapter);
	}

	/**
	 * 模拟数据
	 */
	private void getDate() {
		int totalCount = CalendarUtil.getDaysByMonth();
		int preDayCount = CalendarUtil.getWeekOfFirstMonth() - 1;
		int today = CalendarUtil.getToday();
		AppContext.showLog("这个月一个多少天" + CalendarUtil.getDaysByMonth());
		AppContext.showLog("第一天为星期几" + CalendarUtil.getWeekOfFirstMonth());
		// 上个月的空白日期
		for (int i = 0; i < preDayCount; i++) {
			CalendarCell c = new CalendarCell();
			c.setTag(0);
			mCellList.add(c);
		}
		// 本月
		for (int i = 1; i <= totalCount; i++) {
			CalendarCell c = new CalendarCell();
			c.setTag(1);
			c.setTime(i);
			if (i == 14 || i == 15) {
				c.setCount(3);
			}
			if (i == 20) {
				c.setCount(1);
			}
			if (i == 21) {
				c.setCount(4);
			}
			if (i == 30) {
				c.setCount(5);
			}
			if (i == today) {
				c.setSelect(true);
			}
			mCellList.add(c);
		}
		// 下个月
		int nextDayCount = GridCount - totalCount - preDayCount;
		for (int i = 0; i < nextDayCount; i++) {
			CalendarCell c = new CalendarCell();
			c.setTag(2);
			mCellList.add(c);
		}
	}
	private void setListener() {
		mGridView.setOnItemClickListener(new OnItemClickListener() {

			@Override
			public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
					long arg3) {
				if (mCellList.get(arg2).getTag() == 1) {
					((MainActivity) getActivity()).turnToFragment(
							getFragmentManager(), CalendarDetailFragment.class,
							CalendarDetailFragment.TAG, null, true);
				}

			}
		});

	}

	@Override
	public boolean onOptionsItemSelected(MenuItem item) {
		switch (item.getItemId()) {
		case android.R.id.home:
			AppContext.showLog("点击了返回");
			getFragmentManager().popBackStack();
			break;
		default:
			break;
		}
		return super.onOptionsItemSelected(item);
	}
}

Gridview的item的布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ly_calendar_item"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:background="@drawable/shape_cell_bg"
    android:orientation="vertical"
    android:padding="5dp" >

    <TextView
        android:id="@+id/tv_item_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:text="2"
        android:textColor="@color/grey_middle"
        android:textSize="20sp" />

    <TextView
        android:id="@+id/tv_item_count"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/tv_item_time"
        android:layout_centerHorizontal="true"
        android:layout_margin="3dp"
        android:text=""
        android:textColor="@color/android_green"
        android:textSize="10sp" />

</RelativeLayout>

GridView的adapter：

import java.util.List;

import android.annotation.SuppressLint;
import android.content.Context;
import android.view.View;
import android.widget.RelativeLayout;
import android.widget.TextView;

import com.james.hospitalmg.R;
import com.james.hospitalmg.model.CalendarCell;

@SuppressLint("ResourceAsColor")
public class CalendarAdapter extends AbsObjectAdapter<CalendarCell> {

	public CalendarAdapter(Context context, List<CalendarCell> data,
			int layoutRes) {
		super(context, data, layoutRes);
	}

	@Override
	protected void setData(int pos, View convertView, CalendarCell itemData) {
		TextView time = getViewFromHolder(convertView, R.id.tv_item_time);
		TextView count = getViewFromHolder(convertView, R.id.tv_item_count);
		RelativeLayout bg = getViewFromHolder(convertView,
				R.id.ly_calendar_item);
		if (itemData.getTag() == 1) {
			time.setText("" + itemData.getTime());
			StringBuffer str = new StringBuffer();
			int careCount = itemData.getCount();
			for (int i = 0; i < careCount; i++) {
				str.append("■");
			}
			if (careCount > 0) {
				str.append("□");
				bg.setBackgroundResource(R.drawable.c2_gray4);
			}
			count.setText(str);
			// 今天
			if (itemData.isSelect()) {
				bg.setBackgroundResource(R.drawable.c2_brown2);
			}
		} else {
			time.setText("");
			count.setText("");
		}

	}

}

Caldroid

进击的小羊

关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
4
评论
用GirdView来实现复杂显示的日历

项目中急用能在日期下面显示小方块的日历控件，这一显示效果老总和我说是项目成功与否的关键，我之前下了俩个日历的源码发现都比较难用，所以心里没有底，就来先看看现在能在网上收刮到的日历都有哪些？1：android原生的日历Calendar　CalendarView控件的实现效果图如下所示：　　　　　　这是Android3.0及以上版本自带的日历控件，我们可通过流动
复制链接

扫一扫

专栏目录