链控实现自定义分享图标?xapp-share=1&xapp-share-image=

[复制链接]
老魏Lv.7 显示全部楼层 发表于 2021-12-28 17:10:47 |阅读模式 打印 上一主题 下一主题
一门app开发演示
功能名称: u.cshtml?xapp-share=1&xapp-share-image=链控实现自定义分享图标
功能说明: 在任意网页或HTML里面添加A标签链接后缀获得链控能力,u.cshtml?xapp-share=1&xapp-share-image=添加链接后缀实现自定义分享图标
核心代码: ?xapp-share=1&xapp-share-image=https://bbs.yimenapp.com/data/attachment/common/d9/common_274_icon.png
jsBridge下载: https://www.yimenapp.com/doc/demo.cshtml
苹果上架
URL添加后缀
  1. <a href="https://www.yimenapp.com/?xapp-share=1&xapp-share-image=https%3A%2F%2Fbbs.yimenapp.com%2Fdata%2Fattachment%2Fcommon%2Fd9%2Fcommon_274_icon.png">执行</a>
  2. <!-- 任意网页html在A标签后添加后缀,实现自定义分享图标,分享后组件显示的图片 -->
  3. <!-- 分享图标地址需要进行urlencode编码 -->
  4. <!-- 这里的图片地址为“https://bbs.yimenapp.com/data/attachment/common/d9/common_274_icon.png”urlencode编码后为“https%3A%2F%2Fbbs.yimenapp.com%2Fdata%2Fattachment%2Fcommon%2Fd9%2Fcommon_274_icon.png” -->
  5. <!-- “?”“#”“&”三个符号间隔,具体根据自己的URI结构选择使用 -->
  6. <!-- URL链控后缀可以组合使用,更多链控规则,请查阅demo -->
复制代码
执行

下载jsbridge-mini.js上传服务器并引入,根据实际业务自定义JS策略,映射JS只会APP内生效!请下载APP打开app体验!

效果演示

QQ截图20211228171931.jpg

APP内点击执行

QQ截图20211228171944.jpg

进入页面点击原生标题栏分享按钮

QQ截图20211228172018.jpg

分享后效果,可以在分享组件里面看到图标已经是我们这里设置的自定义图片了

由于图标是PNG格式,导致透明部分为黑色背景了,一般不建议使用透明PNG

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

一门APP打包致力于H5混合APP基础框架领域的前沿探索,专注轻便的移动应用解决方案 提供基于HTML前端页面在各种应用层级的端延展。
  • 官方手机版

  • 微信公众号

  • 微信客服

  • Powered by Discuz! X3.4 | Copyright © 2001-2020, 一门APP. | 一门APP开发平台|热门标签
  • 蜀ICP备17005078号-4 | 川公网安备 51019002001185号 | |成都七扇门科技有限公司