提问 发文

数字孪生大屏图片切换教程

易知微创新技术团队

| 2024-08-30 15:07 120 0 0

一、预览效果

图片


二、实现逻辑

通过自定义事件来实现。设置按钮图片控制轮播图,实现轮播内容的前后切换效果。


三、操作步骤

首先在看板中添加图片组件,通过 【辅助】→【图片】→【上传图片】,上传用于控制轮播的按钮图片。

图片

添加轮播图组件,通过【其他】→【轮播图片视频】,样式中取消【开启轮播】,点击【轮播内容】→【轮播内容列表】→上传需要轮播的【图片】并修改【标题】样式。

图片

选中用于控制轮播的按钮图片,点击【交互】→【自定义事件】→事件类型【鼠标点击】→组件【轮播图】→动作【步进切换】→右侧按钮图片参数【return 1】

ps:"return 1"的结果是使轮播组件的值+1,效果为向前切换一页图片

图片

同理,左侧按钮图片参数【return -1】通过自定义事件使按钮图片与轮播图片关联,设置图片向前轮播。

图片

点击轮播图【交互】→【自定义事件】→事件类型【切换图片时】→组件选择【轮播图片】→动作【设置当前项】

图片

如需教程Demo,关注【易知微产品帮助中心】,发送“轮播图片”即可获得~

收藏 0
分享
分享方式
微信

评论

游客

全部 0条评论

轻松设计高效搭建,减少3倍设计改稿与开发运维工作量

开始免费试用 预约演示

扫一扫关注公众号 扫一扫联系客服

©Copyrights 2016-2022 杭州易知微科技有限公司 浙ICP备2021017017号-3 浙公网安备33011002011932号

互联网信息服务业务 合字B2-20220090

400-8505-905 复制
免费试用
微信社区
易知微-数据可视化
微信扫一扫入群