反馈已提交

网络繁忙

[通用]移动端简约下拉样式

  • 文档创建者:Wendy123456
  • 编辑次数:6次
  • 最近更新:April陶 于 2021-10-25
  • 1. 概述

    1.1 版本

    报表服务器版本App 版本HTML5 移动端展现插件
    11.011.0V11.0

    1.2 应用场景

    用户若需要改变下拉框和下拉复选框的背景颜色、字号、边框时,对现有下拉框和下拉复选框控件操作非常麻烦,用户可设置「移动端简约下拉样式」,对下拉框和下拉复选框的样式进行设置。

    1.3 功能简介

    本文提供「移动端简约下拉样式」的使用方法,用户可对下拉框和下拉复选框的样式进行自定义设置。

    1.4 适用范围

    移动端设备
    终端范围生效位置备注
    手机、Pad
    App、H5表单 body 内部的下拉框、下拉复选框

    在下面场景中不能生效:

    填报 CPT参数面板与顶部参数面板组合使用视图树控件

    2. 示例

    由于下拉框与下拉复选框的配置界面相同,本章以「下拉框」为例详细描述使用步骤。

    2.1 模板准备

    1)点击下载模板及表格:企业员工春节出行统计.zip

    2)在 FineReport 设计器中打开该模板,选中下拉框控件(bumenx),在「属性」Tab 页下输入标签名称「下拉框」。如下图所示:

    注:「标签名称」可不设置。

    2021-10-25_17-08-18.png

    3)在 FineReport 设计器中打开该模板,选中下拉框控件(bumenx),点击「移动端>样式模板右侧」。如下图所示:

    2021-10-25_17-08-41.png

    点击「样式模板右侧」后,界面如下图所示:

    1582878108335043.png

    3.2 默认样式

    在「样式模板」中选择「默认」,用户可设置「组件背景」,其中组件背景默认为背景色,可自定义颜色。

    移动端效果(以 APP 效果为例)如下图所示:

    1582878652946842.png

    3.3 简约下拉样式

    3.3.1 具体设置

    在「样式模板」中选择「简约下拉样式」,「控件样式」选择「自定义」,对下拉框样式进行设置,如下图所示:

    1589937856258384.png

    简约下拉样式各设置项说明如下表所示:

    属性备注
    控件样式
    选项包括「默认」和「自定义」,默认情况下选择「默认」
    标签名称
    可设置「标签名称」的字符、字号、颜色、是否加粗、是否倾斜
    控件值可设置「控件值」的字符、字号、颜色、是否加粗、是否倾斜
    展开图标、收起图标

    可对「展开图标」和「收起图标」自定义设置 

    注:建议图片尺寸在 16 * 16 到 68 * 68 之间,支持 PNG 、JPG 格式

    控件背景
    可对控件背景进行自定义设置
    控件边框可选择边框类型
    边框颜色
    可自定义边框颜色
    圆角可自定义边框圆角
    宽度

    横向撑满:标签及控件宽度为屏幕宽度减去 body 的左右内边距

    自定义:可自定义控件宽度

    下拉浮层

    横向撑满:下拉值展示宽度为屏幕宽度减去 body 的左右内边距

    与控件等宽:下拉值展示与控件等宽

    3.3.2 移动端效果

    移动端效果(以 App 效果为例)如下图所示:

    2.gif

    附件列表


    主题: 移动端应用
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    请前往「服务平台」,选择「在线支持」

    热线电话:400-811-8890转2

    总裁办24H投诉

    热线电话:173-1278-1526

    文 档反 馈

    鼠标选中内容,快速反馈问题

    鼠标选中存在疑惑的内容,即可快速反馈问题,我们将会跟进处理。

    不再提示

    10s后关闭