如何快速抠图_抠图在线生成网_图片在线设计_在线长图生成器_切图软件
当前位置:建站首页 > 解决方案 >

在线抠图网站—如何在微信小程序中制作圆点沿

发表日期:2021-05-14 08:45文章编辑:在线抠图网站浏览次数: 标签:    

手机微信微信小程序中制作圆点沿着圆圈运动健身健身运动的日本动漫?一定有许多朋友很是期待吧,下面就是详细的内容。

最开始用 wx.createAnimation(OBJECT) 创建一个日本动漫实例,OBJECT 里的关键主要参数是设置日本动漫 duration、timingFunction、delay、transformOrigin;接着依据 export 方法将日本动漫实例输出并 setData 给构件 data{} 里的 animation 特点。
[标识:內容1]

在一开始说下面的小日本动漫之前务必注意以下好多个层面:

手机微信微信小程序官方网网日本动漫 API 文字文本文档的最下面的 bug tip :

bug: IOS/Android 6.3.30 依据step()分隔日本动漫,唯一第一步日本动漫能见效。

在手机微信微信小程序日本动漫文字文本文档里的 wx.creatAnimation(OBJECT) 这一方法提供的关键主要参数没有相仿 css3 animation-iteration-count 那般的关键主要参数。

接来便说说下面的小日本动漫案例:

如圖大伙儿要进行小圆点沿着圆圈健身运动运动轨迹运动健身健身运动的小日本动漫。

WXML:

两个 view 标志,一个是相对性相对路径圆圈,圆圈可以用状况图来做还能够用 border-radius 来进行;一个是圆点。

view 'animation-box\'

view class = \'time-crl-path\' /view

view class = \'crl-dot\' animation=\'{{dotAnData}}\' /view

/view

WXSS:

基本设置精确精准定位,这儿只放宽高。

.animation-box{

width: 176px;

height:176px;

}

.time-crl-path {

width: 176px;

height: 176px;

......

}

.crl-dot {

width: 9px;

height:9px;

......

}

JS:

transformOrigin 这一关键主要参数所设置的是小圆点旋转时的原点,默认设置设定是原素管理方法管理中心,下面设置的就是相对性相对路径圆圈的管理方法管理中心,具体关键主要参数务必根据相对性相对路径圆圈不上算。

Page({

data: {

dotAnData: {}

},

onShow: function(){

var i = 0

var dotAnData =wx.createAnimation({

duration: 1000,

transformOrigin: \'4px 91px\'

})

dotAnFun =setInterval(function() {

dotAnData.rotate(6 * (++i)).step()

that.setData({

dotAnData: dotAnData.export()

})

}.bind(that), 1000)

}

})

从上面的编号可以看出是运用 setInterval() 解决了文章内容內容刚开始的二项注意事项。

那么为什么虚假行 rotate(360) 或者 rotate(180) ?

这就必须注意官方网网文字文本文档的 rotate(deg) 的 deg 的取值范围 -180 ~ 180,从原点顺时针方向方位旋转一个 deg。也是有就是 rotate animation 在运动健身健身运动角度幅度非常大的情况下健身运动运动轨迹会出現偏位,就是说在一切一切正常设置的 transformOrigin 的情况下圆点运动健身健身运动健身运动运动轨迹会出現偏位。

因而上面的小日本动漫案例就是把它拆分,定义 deg 为 6 作基本提高量, ++i 累加,那般在一切一切正常的 transformOrigin 下所有日本动漫就是由每个小日本动漫 rotate(6) 组成的。

目前手机微信微信小程序日本动漫对于日本动漫具体实际效果还是较为比较有限制的,可是简单的日本动漫具体实际效果是一切一切正常的啦~

以上就是如何手中机手机微信手机微信微信小程序中制作圆点沿着圆圈运动健身健身运动的日本动漫的全部内容了,大家都学精了沒有?

相关新闻

影响网站商城注册率—教你如何设置微信公共号

教你怎样设定手机上入门机手机微信手机上手机微信手机微信微信公众账号开展在网络上报考...

日期:2021-05-09 浏览次数:106

免费设计图片制作在线—哪些计算机网络技术学

09:22什么互联网技术性性性院校好什么测算机互联网技术性性性院校好?伴随着着互连网的盛行...

日期:2021-04-29 浏览次数:112

背景抠图—锦州团队小程序游戏定制那家好

锦州精英精锐精英团队手机上手机微信手机微信微信小程序手机上入门机手机游戏订制哪一个...

日期:2021-04-23 浏览次数:88

h5在线—小程序报名预约 微信预约小程序怎样做

中小型型型学习培训学习培训学习培训学习培训组织怎样运用手机上手机微信手机微信微信小...

日期:2021-04-06 浏览次数:115

衡水精品企业网站建设报价—为何要做商城型小

...

日期:2021-03-30 浏览次数:166

作图软件 加文字—微网站制作教程

年会综艺节目综艺节目综艺节目综艺节目互连网互联网网络投票方法_教你制作有造型设计造型...

日期:2021-03-29 浏览次数:149