android 开发教程之日历项目实践(三)

更新时间：2013年01月03日 15:19:57 作者：

决定开始学习 Android 平台下的软件开发，以日历作为实践项目，进行一周后，基本完成,有需要的朋友可以参考下

二、创建样式

日历显示的表格线，使用 Cell 填充图形的边框来实现，为了统一，我们先定义边框线的颜色及线条精细。

另外还要定义一系统填充样式等。

创建 color：

color_calendar_border 表格线
color_calendar_title_gregorian 标题栏日期年月文字的颜色color_calendar_title_lunar 标题栏农历color_calendar_title_startcolor_calendar_title_endcolor_calendar_title_addition 标题栏节日，节气color_calendar_weekindex 年单位周序号color_calendar_weekindex_backgroundcolor_calendar_weekend 周末color_calendar_weekend_backgroundcolor_calendar_header 表头color_calendar_header_backgroundcolor_calendar_outrange 非本月日期color_calendar_outrange_backgroundcolor_calendar_normal_gregorian 公历日期color_calendar_normal_lunar 农历日期color_calendar_normal_backgroundcolor_calendar_today_gregorian 今天公历日期color_calendar_today_lunar 今天农历日期color_calendar_today_backgroundcolor_calendar_solarterm 节气color_calendar_festival 节日color_calendar_pressed 点击单元格填充背景
color_calendar_focused 焦点单元格填充背景

点击下图菜单 Search 下面的图标(New Android XML File)

选择 Resource Type -> Values，输入文件名 -> colors，选择 Root Element -> resources，点击 Finish。

定义 color_calendar_border

复制代码代码如下:

<?xml version="1.0" encoding="utf-8"?> 
<resources> 
<color name="color_calendar_border">#3fff</color> 
<color name="color_calendar_title_gregorian">#cfff</color> 
<color name="color_calendar_title_lunar">#cfff</color> 
<color name="color_calendar_title_start">#c000</color> 
<color name="color_calendar_title_end">#6000</color> 
<color name="color_calendar_title_addition">#f63</color> 
<color name="color_calendar_weekindex">#3fff</color> 
<color name="color_calendar_weekindex_background">#369f</color> 
<color name="color_calendar_weekend">#9fff</color> 
<color name="color_calendar_weekend_background">#3f99</color> 
<color name="color_calendar_header">#9fff</color> 
<color name="color_calendar_header_background">#6000</color> 
<color name="color_calendar_outrange">#3fff</color> 
<color name="color_calendar_outrange_background">#3fff</color> 
<color name="color_calendar_normal_gregorian">#cfff</color> 
<color name="color_calendar_normal_lunar">#9fff</color> 
<color name="color_calendar_normal_background">#0000</color> 
<color name="color_calendar_today_gregorian">#cfff</color> 
<color name="color_calendar_today_lunar">#9fff</color> 
<color name="color_calendar_today_background">#06c</color> 
<color name="color_calendar_solarterm">#c0c3</color> 
<color name="color_calendar_festival">#cf90</color> 
<color name="color_calendar_pressed">#306c</color> 
<color name="color_calendar_focused">#606c</color> 
</resources> 

Color 的值由四部分组成：透明度，Red, Green, Blue，每部分可以用一位或两位十六进制数字表示，透明度可以省略。

如：

ffff 或 ffffffff 表示不透明白色，前面的透明度可以省略：fff 或 ffffff

7f00 表示半透明的红色

更多请查看：http://developer.android.com/guide/topics/resources/more-resources.html#Color

将颜色定义统一放在一个文件中，是出于两点考虑，一是多处用到同一种颜色定义，这样一处修改，相应的位置都会跟着变，另外则是为了修改方便，无须到处去找某一个文件。上面的 color_calendar_border 被表格的各种状态填充图形用到，而像 color_calendar_weelndex_background 只有一处用到，如果不想统一管理，也可以不在这里定义，在定义 shape 时，直接使用固定值。

创建 dimen：

点击下图菜单 Search 下面的图标(New Android XML File)

选择 Resource Type -> Values，输入文件名 -> dimens，选择 Root Element -> resources，点击 Finish。

完成的 xml 文件内容：

复制代码代码如下:

<?xml version="1.0" encoding="utf-8"?> 
<resources> 
<dimen name="dimen_calendar_border">1dp</dimen> 

</resources> 

尺寸的单位主要有六种：dp, sp, pt, px, mm, in，更多介绍请参照：http://developer.android.com/guide/topics/resources/more-resources.html#Dimension

创建 Color State List

在我们的日历中，单元格有三种状态，分别是无焦点，按下，有焦点，为了在不同的状态下显示不同的颜色，可以定义 Color State List。

关于 Color State List，更多请参照：http://developer.android.com/guide/topics/resources/color-list-resource.html。

Color State List 列表：

colorlist_calendar_normal
colorlist_calendar_outrange
colorlist_calendar_weekend
colorlist_calendar_today

点击下图菜单 Search 下面的图标(New Android XML File)

选择 Resource Type -> Drawable，输入文件名 -> colorlist_calendar_outrange，选择 Root Element -> selector，点击 Finish。

完成的 xml 文件：

复制代码代码如下:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
<item android:state_pressed="true" android:color="@color/color_calendar_pressed"/> 
<item android:state_focused="true" android:color="@color/color_calendar_focused"/> 
<item android:color="@color/color_calendar_outrange_background"/> 
</selector> 

其它也同样创建。

创建的 drawable：

shape_calendar_titlebar.xml 主画面标题栏填充背景shape_calendar_header.xml 表头填充背景shape_calendar_cell_weekindex.xml 年为单元的周序号单元格填充背景shape_calendar_cell_weekend.xml 周末日期单元格填充背景shape_calendar_cell_normal.xml 当月普通日期单元格填充背景shape_calendar_cell_outrange.xml 非当前月日期单元格填充背景shape_calendar_cell_today.xml 今天单元格填充背景

点击下图菜单 Search 下面的图标(New Android XML File)

选择 Resource Type -> Drawable，输入文件名 -> shpae_calendar_titlebar，选择 Root Element -> shape，点击 Finish。

输入 shape 定义：

复制代码代码如下:

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
<corners android:radius="3dp" /> 
<gradient android:angle="90" 
android:startColor="@color/color_calendar_title_start" 
android:endColor="@color/color_calendar_title_end" 
/> 
</shape> 

这段定义代码会帮我们生成一个圆角矩形，填充颜色是上下渐变的。

radius = 圆角大小

angle = 渐变填充方向(45的位数，0-360，90 表示从上往下渐变填充)

startColor, endColor = 填充的起始与终止颜色定义

其它的也按此一一创建，但表格的填充矩形，不要圆角，删除 radius 或设为 0

如：shape_calendar_cell_outrange.xml

复制代码代码如下:

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
<solid android:color="@color/colorlist_calendar_outrange" /> 
<stroke android:width="@dimen/dimen_calendar_border" 
android:color="@color/color_calendar_border" /> 
</shape> 

solid = 填充色，这里用前面定义的 color state list，来实现不同状态下，填充不同颜色。

stroke = 矩形边框，width = 边框线粗细， color = 边框线颜色

创建 style

打开 res/styles.xml，添加样式定义。由于样式与画面设计相关，在我们设计界面时，还要相应调整，所以在使用时，一一添加。这里给出一个 sample：

复制代码代码如下:

<resources xmlns:android="http://schemas.android.com/apk/res/android"> 

<!-- 
Base application theme, dependent on API level. This theme is replaced 
by AppBaseTheme from res/values-vXX/styles.xml on newer devices. 
--> 
<style name="AppBaseTheme" parent="android:Theme.Light"> 
<!-- 
Theme customizations available in newer API levels can go in 
res/values-vXX/styles.xml, while customizations related to 
backward-compatibility can go here. 
--> 
</style> 

<!-- Application theme. --> 
<style name="AppTheme" parent="AppBaseTheme"> 
<!-- All customizations that are NOT specific to a particular API-level can go here. --> 
</style> 

<style name="style_calendar_title"> 
<item name="android:background">@drawable/shape_calendar_titlebar</item> 
</style> 

<style name="style_calendar_title_gregorian"> 
<item name="android:textSize">36sp</item> 
<item name="android:textStyle">bold</item> 
<item name="android:textColor">@color/color_calendar_title_gregorian</item> 
<item name="android:layout_marginLeft">25dp</item> 
</style> 
... ... 
</resources> 

您可能感兴趣的文章:

从0快速搭建一个实用的MVVM框架(超详细)
这篇文章主要介绍了从0搭建一个实用的MVVM框架,结合Jetpack，构建快速开发的MVVM框架，支持快速生成ListActivity、ListFragment，主要是基于MVVM进行快速开发上手即用，需要的朋友可以参考下
2022-03-03
基于Android XML解析与保存的实现
本篇文章小编为大家介绍，基于Android XML解析与保存的实现。需要的朋友参考下
2013-04-04
Android Tiny集成图片压缩框架的使用
本篇文章主要介绍了Android Tiny集成图片压缩框架的使用，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-09-09
Android实现一个简易的带边输入框
如今市面上APP的输入框可以说是千奇百怪,不搞点花样出来貌似代表格局没打开,还在使用系统自带的输入框的兄弟可以停下脚步,哥带你实现一个简易的带边框输入框,感兴趣的同学可以自己动手试一下
2023-08-08
Android Canvas和Bitmap结合绘图详解流程
在 Android Canvas 上绘图非常难，在绘图时需要理解许多不同的类和概念。这篇文章中，将介绍 Android 框架中可用的一些类，它们可以让画布使用时更轻松
2021-11-11
Android实现淘宝客户端倒计时界面
这篇文章主要为大家详细介绍了Android实现淘宝客户端倒计时界面，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2018-04-04
Flutter fluro时报错type 'String' is not a subty
这篇文章主要介绍了Flutter使用fluro时报错type 'String' is not a subtype of type 'Queue<Task>'解决方法详解，有需要的朋友可以借鉴参考下，希望能够有所帮助
2023-12-12
Kotlin定义其他类的实现详解
这篇文章主要介绍了Kotlin定义其他类的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2022-09-09
Android最简单的限制输入方法（只包含数字、字母和符号）
这篇文章主要给大家介绍了关于Android最简单的限制输入的实现方法，限制输入框只能输入数字、字母和符号，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面来一起看看吧
2018-11-11
Android 实现左滑出现删除选项
滑动删除的部分主要包含两个部分，一个是内容区域（用于放置正常显示的view），另一个是操作区域（用于放置删除按钮）。下面通过本文给大家介绍Android 实现左滑出现删除选项,需要的朋友可以参考下
2017-06-06

android 开发教程之日历项目实践(三)

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具