🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
### 翻牌器组件就是添加数字各种样式的组件。点击“![](https://img.kancloud.cn/7b/5e/7b5eccf1bf9db9d18e2779e02e8a9bfa_28x26.png)”图标,再点击“翻牌器”,即可创翻牌器,如图5.11; ![](https://img.kancloud.cn/0e/13/0e139cfff2354a98f8427d46226ba865_814x303.png) ![](https://img.kancloud.cn/46/28/4628075a591b932d5fe44b80b8c100c3_799x36.png) ## **一、组件名称设置** ### 选中该翻牌器组件,在操作界面右侧的“图层名称”处可修改组件的名称,如图5.12。(名称最好要设置一下,方便后期组件管理) ![](https://img.kancloud.cn/6c/37/6c37676bece3b63645c38ef7e355073b_648x512.png) ![](https://img.kancloud.cn/d0/17/d0175f028731eb57f7f759464efff436_804x37.png) ## **二、基本样式设置** ### 1\. 整体 ### 选中该字符云组件,在操作界面右侧的“整体”处可把数字设置成整体的样式,如图5.13; ![](https://img.kancloud.cn/48/d4/48d4a65d88db3e81b083c46fac096e7b_607x515.png) ![](https://img.kancloud.cn/1e/b1/1eb1b02fce7c8b6966badd29f4768500_794x40.png) ### 2\. 横行 ### 选中该字符云组件,在操作界面右侧的“横行”处可对横行 进行设置样式,如图5.14; ![](https://img.kancloud.cn/38/1d/381da276dc0d4726d71aaf6fdfa95f44_595x513.png) ![](https://img.kancloud.cn/8f/65/8f65eca79708206a94b934edd6991b0e_795x44.png) ### 3\. 精度 ### 选中该字符云组件,在操作界面右侧的“精度”处修改,可设置数值保留的小数位数,设置好后,点击预览可以看到效果,如图5.15,预览样式如图5.151; ![](https://img.kancloud.cn/39/22/39224af3450353a4e40ed9df44720c6b_632x523.png) ![](https://img.kancloud.cn/88/ae/88aeab2a7ef8eaad6c697df640abcb74_795x45.png) ![](https://img.kancloud.cn/32/f9/32f9f8ab446a28d7401568e9601c4e2c_349x146.png) ![](https://img.kancloud.cn/65/13/6513d80996d0441483f60b5ac6f85604_795x45.png) ### 4\. 边框设置 ### 选中该字符云组件,在操作界面右侧的“边框设置”处修改,设置好后,点击预览可以看到效果,如图5.16; * ### 间距:边款与文字的间距,默认文字居中,调整间距值,文字向下移动; * ### 边框:可设置边框样式;分为:无边框、内置图片、内置边框; ~~~ * 无边框:设置无边框的翻牌器,可以用这个设置一些大一点的数字或者钱,样式如图5.161; * 内置图片:设置翻牌器的背景,如可设置图片地址、背景图片、背景颜色,样式如图5.162; * 内置边框:设置翻牌器的边框样式,如可设置边框颜色、边框宽度、背景颜色,样式如图5.163; ~~~ ![](https://img.kancloud.cn/04/de/04dee1a3c983b6694a11f0d2b0146588_846x381.png) ![](https://img.kancloud.cn/b5/46/b54650ece098ec1bba2e0de2ce239e12_794x40.png) ![](https://img.kancloud.cn/95/36/9536fc42436efdb0afcbd4d933b7b811_929x279.png) ### 5\. 内部设置 ### 选中该字符云组件,在操作界面右侧的“内部设置”处可修改文字样式,如图5.17; ~~~ * 字体大小:翻牌器内文字的大小; * 字体颜色:翻牌器内文字颜色; * 字体粗细:翻牌器内文字粗细; * 对齐方式:翻牌器内文字对齐方式; ~~~ ![](https://img.kancloud.cn/3b/fb/3bfbe5166abdd41a7522e1bd57dc9022_841x357.png) ![](https://img.kancloud.cn/81/f5/81f514c7630f0313d95f498421eb9737_803x40.png) ### 6\. 前缀设置 ### 选中该字符云组件,在操作界面右侧的“前缀设置”处可设置前缀样式,如图5.18; ~~~ * 前缀内容:前缀要显示的内容; * 对齐方式:前缀的对齐方式; * X间距:前缀跟X轴的间距; * Y间距:前缀跟Y轴间距; * 颜色:前缀字体颜色; * 字体大小:前缀字体大小; ~~~ ![](https://img.kancloud.cn/e0/19/e01991030af0f231e886419906ca876f_791x427.png) ![](https://img.kancloud.cn/e2/b4/e2b495519a5292585b70efe4bd32a514_797x41.png) ### 7\. 后缀设置 ### 选中该字符云组件,在操作界面右侧的“前缀设置”处可设置前缀样式,如图5.19; ~~~ * 前缀内容:前缀要显示的内容; * 对齐方式:前缀的对齐方式; * X间距:前缀跟X轴的间距; * Y间距:前缀跟Y轴间距; * 颜色:前缀字体颜色; * 字体大小:前缀字体大小; ~~~ ![](https://img.kancloud.cn/6c/c8/6cc85d1f766a6a93728ca31da7fbe4e0_770x412.png) ![](https://img.kancloud.cn/6b/26/6b26389ddf0ce52c344fb4795077f780_805x30.png) ## **三、接口设置** ### 1\. 数据类型 ### 数据类型分为静态数据和动态数据; * ### 静态数据:写死的数据; * ### 动态数据:会随着接口传过来的数据实时变化;(一般这种比较常用) ### 2\. 接口地址 ### (1)静态数据,接口地址穿过来的内容要符合以下格式: ~~~ { "value": "12345" } ~~~ ### (2)动态数据,接口地址穿过来的内容要符合以下格式: ~~~ {"data":{"value":"1234567"}} ~~~ ### 3\. 刷新时间 ### 这个参数主要针对动态数据设置的,完成数据的实时更新。 * ### 如果你想设置成5秒刷新一次,可以将刷新时间设置成“5000”; ### 4\. 刷新数据 ### 这个参数主要是重新请求以下接口,完成数据的更新。 ![](https://img.kancloud.cn/2f/f8/2ff8d8405e4742542abffc8822757596_1066x980.png)