uniapp动态修改app图标,uniapp使用第三方图标

　　Uniapp会做移动图标的方法：先打开html代码文件；然后将牵引元件设置成可移动的；在uni-app中；最后，在css样式中设置“指针-事件”属性，实现可拖动的浮动图标。

　　UNI-APP开发(仿饿)开发课程：进入学习

　　本教程运行环境：windows7系统，Uni-App版本2.5.1。这个方法适用于所有品牌的电脑。

　　推荐(免费):uni-app开发教程

　　uni-app可拖动的浮动图标

　　第二个项目中有一个要求，

　　在uni-app中制作一个新人红包的图标，需要全屏拖动，初始位置固定。

　　这种风格：

　　下面是我的解决方法

　　1.首先，在uni-app中有一个特殊的可移动的拖拽元素，html代码如下

　　可移动区域class= movable area v-else-if= is show phone==0

　　可移动视图class= movable view direction= all x= 600 rpx y= 800 rpx

　　image:src= imgurl small _ HB . png mode= width fix @ click= to _ xfj _ gg /image

　　余额：{{hb_ye}}/text

　　/可移动视图

　　/可移动区域。mobile-view是一个可拖动的元素，mobile-area是这个元素的拖动范围。

　　2.

　　有一个问题。设置的时候发现红包可以点，但是页面的其他元素不能点。原因是可移动区域阻挡了其他元素，这不能通过使用z索引来解决；按照度娘的指示，你需要设置css样式的指针事件。

　　Css代码如下。可移动区域{

　　位置：固定；

　　top:0；

　　左：0；

　　宽度：100%；

　　身高：100%；

　　指针事件：无；//如果area元素不可单击，事件将向下移动到页面的下部元素。移动视图{

　　指针事件：自动；//可以点击

　　宽度：120rpx

　　身高：110rpx

　　图像{

　　宽度：100%；

　　身高：100%；

　　}

　　文本{

　　位置：绝对；

　　左：0；

　　底部：0；

　　宽度：120rpx

　　身高：18rpx

　　显示器：flex

　　justify-content:居中；

　　对齐-项目：居中；

　　字体大小：16rpx

　　颜色：# ffffff

　　}

　　}

　　}3.因此，实现了可拖动的浮动图标。以上是uniapp如何移动图标的细节。请多关注我们的其他相关文章！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。