更新记录

1.0.5(2020-07-08) 下载此版本

使用cover-image作为图层绘制

解决嵌套问题

1.0.4(2020-06-21) 下载此版本

view->cover-view

video、canvas不再遮挡按钮

1.0.3(2020-06-01) 下载此版本

修复滑动穿透

查看更多

平台兼容性

综述

本控价为悬浮置顶按钮(可拖动)

调用方式

  <template>
    <view>
        <topicon class="topicon" :iconWidth="100" :iconHeight="100" :startPostion="3" iconPath="../../static/zhiding.png"
         :marginBottom="0" :marginTop="60" :marginLeft="5" :marginRight="5" @tapIcon="tapIcon"
        ></topicon>
    </view>
  </template>

  <script>
    import topicon from '@/components/gwh-backTopIcon/gwh-backTopIcon.vue'
    export default {
        components:{
            topicon
        },
        data() {
            return {

            }
        },
        onLoad() {

        },
        methods: {
            tapIcon(e){
                console.log('you tap icon')
            }
        }
    }
  </script>

  <style>
    .topicon >>> .icon{
        border: #4CD964 2upx solid;
    }
  </style>

属性说明

iconWidth | iconHeight

分别管理icon的长宽
类型: 整数
单位: upx

marginLeft | marginRight | marginTop | marginBottom

限制icon移动范围:分别距离屏幕左边界、右边界、上边界、下边界多远
类型: 整数
单位: px

startPostion

初始位置:0-左上角,1-右上角,2-左下角,3-右下角,不填默认右下角
类型: 整数

iconPath

图片路径:不填默认为:“样例图片”中的icon
类型: 字符串

方法说明

@tapChange

点击返回函数,无任何返回值

样式说明

.icon

图片除大小外的其他样式

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问