1. 概述
1.1 版本
| 报表服务器版本 | APP版本 | HTML5 移动端展现插件版本 | 功能变动 |
|---|---|---|---|
| 11.0 | V11.0 | V11.0 | - |
| 11.0 | V11.0.891 | V11.0.891 | 简约日历 支持自定义「年、年月」格式的日期控件 |
1.2 应用场景
移动端通过日历的方式筛选日期，之前只能通过报表块、条件属性、联动等实现，模板制作过程非常麻烦，且样式单一。
1.3 功能简介
移动端可实现通过日历的方式筛选日期，比如日报、行程等场景，易用性及体验更强，能够明显看出日期所处月份，周号等。并支持为日期控件设置控件背景、边框颜色、字符字体、图标等。
2. 功能入口
1）点击下载模板：行程管理主页-phone.frm ，在 FineReport 设计器中打开该模板。
2）选中右侧属性面板中的「组件设置>day」。
3）点击「移动端」，点击「样式模板」旁的「...」按钮，可以看到 样式模板 有四种样式：「默认」、「导航日历」、「简约日历」、「简约日期样式」，如下图所示：
3. 默认
3.1 设置
「默认」样式模板只可设置「通用属性」，详情参见：默认样式模板 。
3.2 示例
1）样式模板选择「默认」。
2）「通用属性> 属性设置」 选择「自定义」。
3）配置具体设置项，点击「确定」，如下图所示：
4）App 及 HTML5 端效果预览如下图所示：
注：可点击日期或图标打开日历面板选择具体日期。
4. 简约日历
4.1 设置
「简约日历」样式模板可设置「通用属性」和「设定」。
4.1.1 通用属性
「通用属性」的设置与「默认」样式模板相同，详情参见：默认样式模板 。
4.1.2 设定
「设定」的「按钮样式」分为「标准」和「自定义」。
1）「按钮样式」为「标准」时，不可自定义设置 按钮样式 。
2）「按钮样式」为「自定义」时，可自定义设置 按钮样式 。
具体设置项说明如下表所示：
| 设置项 | 说明 | |
|---|---|---|
| 默认状态 |
| |
| 标题行 | 分割线颜色 | 支持自定义分割线颜色 |
| 按钮 | 颜色 | 支持自定义按钮颜色 |
| 字符 | 主字符 | 支持自定义主字符颜色 |
| 特殊字符 | 支持自定义特殊字符颜色 | |
| 字号 | 支持自定义字号，范围为12-18之间的整数，默认为14 | |
| 箭头 | 颜色 | 支持自定义箭头颜色 |
4.2 示例
1）样式模板选择「简约日历」。
2）「通用属性>属性设置」选择「默认」。
3）「设定」的「按钮样式」选择「自定义」，配置具体设置项，点击「确定」，如下图所示：
4）App 及 HTML5 端效果预览如下图所示：
注：可点击上方的日期或下方的箭头收起日历面板。
4.3 年月、年
App 版本及 HTML5 移动端展现插件版本 V11.0.891 版本及之后，移动端支持自定义日期控件「年月、年」格式的「简约日历」样式模板，效果如下图所示：
5. 导航日历
5.1 设置
5.1.1 通用属性
「通用属性」的设置与「默认」样式模板相同，详情参见：默认样式模板 。
5.1.2 设定
「设定」的「按钮样式」分为「标准」和「自定义」。
1）「按钮样式」为「标准」时，不可自定义设置 按钮样式 。
2）「按钮样式」为「自定义」时，可自定义设置 按钮样式 。
具体设置项说明如下表所示：
| 设置项 | 说明 | |
|---|---|---|
| 默认状态 |
| |
| 标题行 | 标题行 | 支持设置是否显示标题行 |
| 分割线颜色 | 支持自定义分割线颜色 | |
| 按钮 | 颜色 | 支持自定义按钮颜色 |
| 字符 | 主字符 | 支持自定义主字符颜色 |
| 特殊字符 | 支持自定义特殊字符颜色 | |
| 字号 | 支持自定义字号，范围为12-18之间的整数，默认为14 | |
| 箭头 | 颜色 | 支持自定义箭头颜色 |
5.2 示例
1）样式模板选择「导航日历」。
2）「通用属性>属性设置」选择「默认」。
3）「设定」的「按钮样式」选择「自定义」，配置具体设置项，点击「确定」，如下图所示：
4）App 及 HTML5 端效果预览如下图所示：
注1：「收起状态」下，上下周切换可通过上方的「上一周」、「下一周」按钮实现，也可左右滑动下方日期来实现。
注2：可通过点击上方的日期或下方的箭头展开日历面板。
6. 简约日期样式
6.1 设置
6.1.1 通用属性
「通用属性」的设置与「默认」样式模板相同，详情参见：默认样式模板 。
6.1.2 设定
「设定」的「按钮样式」分为「标准」和「自定义」。
1）「按钮样式」为「标准」时，不可自定义设置 按钮样式 。
2）「按钮样式」为「自定义」时，可自定义设置 按钮样式 。
具体设置项说明如下表所示：
| 设置项 | 说明 | |
|---|---|---|
| 标签名称 | 字符 | 支持设置字体样式、字号（范围为1-99之间的整数，默认为15）、字体颜色、加粗、倾斜 |
| 控件名称 | 字符 | 支持设置字体样式、字号（范围为1-99之间的整数，默认为15）、字体颜色、加粗、倾斜 |
| 图标 | 支持自定义图标 | |
控件区域 注：「控件区域」设置的控件样式生效优先级高于「通用属性」 | 控件背景 | 支持自定义控件背景的颜色 |
| 控件边框 | 支持自定义控件边框的类型 | |
| 边框颜色 | 支持自定义边框颜色 | |
| 圆角 | 支持自定义边框的圆角 | |
| 宽度 |
| |
6.2 示例
1）选中右侧属性面板中的「组件设置>day」。
2）选择「属性」Tab 面板，设置「标签名称」为「帆软」，如下图所示：
3）选择「移动端」Tab 面板，点击「样式模板」旁的「...」按钮。
4）样式模板选择「简约日期样式」。
5）「通用属性>属性设置」选择「默认」。
6）「设定」的「按钮样式」选择「自定义」，配置具体设置项，点击「确定」，如下图所示：
7）App 及 HTML5 端效果预览如下图所示：
上一篇：决策报表移动端简约下拉样式
