19. “我”模块(二)之日历
上一节对欢迎模块进行了综述(可参见 “我”模块(一) 进行了解),接下来将从“我”模块(一)开始详细介绍:
- [“我”模块(二)之日历]
- [“我”模块(二)之星座]
- [“我”模块(二)之星座选择]
- [“我”模块(二)之涂鸦]
- [“我”模块(二)之地图]
知识点
- 掌握“日历”界面的开发,使用日历展示当前年份
- 掌握“星座”界面的开发,选择不同的星座展示不同的运势
- 掌握“涂鸦”界面的开发,实现图画的绘制功能
- 掌握“地图”界面的开发,可以定位一个指定地点
日历
任务综述:
“日历”界面主要是在“我”界面弹出一个对话框,该对话框中显示详细的年、月、日、阴历、阳历、星期以及节假日信息,该界面的日历控件通过调用第三方的CalendarView库实现。
1. “日历”界面
任务分析:
“日历”界面主要用于方便用户查看日历信息,在该界面中有两个黑色箭头用于切换月份,显示年、月、日的灰色文本、星座信息和对应月份的日期信息,界面效果如图所示。

任务实施:
(1)创建“日历”界面:CalendarActivity & activity_calendar。
(2)导入界面图片。将“日历”界面所需的图片(last,next)。
(3)引入CalendarView库。该项目中的日历功能是通过引入第三方库CalendarView实现的。在AS中,File/New/Import Module/导入日历框架,选中项目,右击选择Open Module Settings/+/Dependency选项/日历框架加入主项目,日历框架详情如图所示。

(4)放置界面控件。
2个ImageView控件,用于显示左右两个黑色箭头;
1个TextView控件,用于显示年、月、日;
1个WeekView控件,用于显示星期;
1个CalendarView控件,用于显示阴历与阳历日期以及一些节假日信息。
activity_calendar.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:calendarview="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:gravity="center_horizontal"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp">
<ImageView
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_marginLeft="50dp"
android:background="@drawable/last"
android:onClick="lastMonth" />
<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:textColor="@android:color/darker_gray"
android:textSize="16sp"
android:textStyle="bold" />
<ImageView
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignParentRight="true"
android:layout_marginRight="50dp"
android:background="@drawable/next"
android:onClick="nextMonth" />
</RelativeLayout>
<com.itheima.calendarview.WeekView
android:layout_width="match_parent"
android:layout_height="30dp" />
<com.itheima.calendarview.CalendarView
android:id="@+id/calendar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="4dp"
calendarview:date_end="2030.12"
calendarview:date_start="1990.1" />
</LinearLayout>
2. “日历”界面逻辑代码
任务分析:
“日历”界面主要显示年、月、日、阴历、阳历、星期以及一些节假日信息,当点击“日历”界面中的左右黑色箭头时,会改变显示的月份,点击界面中的日期会显示圆形蓝色背景。
任务实施:
(1)获取界面控件。由于该界面是通过调用日历库实现的,所以相对来说比较简单,在CalendarActivity的onCreate()方法中初始化界面控件并设置相应控件的值。
CalendarActivity.java
public class CalendarActivity extends AppCompatActivity {
private CalendarView calendarView;
private TextView tv_title;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_calendar);
tv_title = (TextView) findViewById(R.id.tv_title);
calendarView = (CalendarView) findViewById(R.id.calendar);
calendarView.init();
DateBean d = calendarView.getDateInit();
tv_title.setText(d.getSolar()[0] + "年" + d.getSolar()[1] + "月" +
d.getSolar()[2] + "日");
calendarView.setOnPagerChangeListener(new OnPagerChangeListener() {
@Override
public void onPagerChanged(int[] date) {
tv_title.setText(date[0] + "年" + date[1] + "月" + date[2] + "日");
}
});
calendarView.setOnItemClickListener(new OnMonthItemClickListener() {
@Override
public void onMonthItemClick(View view, DateBean date) {
tv_title.setText(date.getSolar()[0] + "年" + date.getSolar()[1] + "月" +
date.getSolar()[2] + "日");
}
});
}
public void lastMonth(View view) {
calendarView.lastMonth();
}
public void nextMonth(View view) {
calendarView.nextMonth();
}
}
(2)修改styles.xml文件。“日历”界面是对话框的样式。
<style name="AppTheme.NoTitle.Dialog" parent="Theme.AppCompat.Dialog">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowBackground">@android:color/transparent</item>
<item name="android:windowIsTranslucent">true</item>
</style>
(3)修改清单文件。由于“日历”界面是对话框的样式,因此需要给该界面添加对话框的样式。
<activity
android:name=".activity.CalendarActivity"
android:theme="@style/AppTheme.NoTitle.Dialog"
(4)修改“我”界面逻辑代码。由于点击“我”界面中的日历图标时会跳转到“日历”界面,需要找到MeFragment的onClick()方法中的,在该方法中的“case R.id.ll_calendar:”语句下方添加代码:
Intent calendarIntent = new Intent(getActivity(), CalendarActivity.class);
startActivity(calendarIntent);