一、是不是你想要的效果,可扫小程序码查看一把先
二、实现步骤:
1. wxml中用到camera中可以设置闪光灯的开启与关闭使用flash属性
<image class="image-style" src="/images/icon/ic_splash_light.png"></image>
<text class="title">派对闪光灯</text>
<text class="desc">夜空中最亮的星,让我们点亮她吧</text>
<view class="slider-container1">
<text class="set-time">灯亮时间(秒)</text>
<slider bindchange="sliderChangeLight" block-size="18" value="{{lightDuration}}" block-color="green" show-value="{{true}}" class="slider" min="{{minTime}}" max="{{maxTime}}" step="0.1"></slider>
</view>
<view class="slider-container2">
<text class="set-time">灯灭时间(秒)</text>
<slider bindchange="sliderChangeInterval" block-size="18" value="{{blackDuration}}" block-color="green" show-value="{{true}}" class="slider" min="{{minTime}}" max="{{maxTime}}" step="0.1"></slider>
</view>
2. js中需要根据设置一个周期内的灯亮时间和灯灭时间,来控制灯亮和灯灭,看着就是一闪一闪的效果;关于灯亮时间和灯灭时间用slider的拖动去设置,此处就不在赘述了
3. 重点在于开启闪光灯和关闭闪光灯与时间控制代码如下:
this.setData({
open: "on"
})
if (this.data.__lightTimeout) {
clearTimeout(this.data._lightTimeout)
}
this.data._lightTimeout = setTimeout(() => {
this.setData({
open: "off"
})
this.beginBlack()
}, this.data.lightDuration * 1000);
},
beginBlack() {
if (this.data._blackTimeout) {
clearTimeout(this.data._blackTimeout)
}
this.data._blackTimeout = setTimeout(() => {
this.beginLight()
}, this.data.blackDuration * 1000);
},
开启闪光灯执行beginLight()方法,倒计时到设置的灯亮时间后,关闭闪光灯;
然后调用beginBlack()方法,倒计时结束后执行beginLight()方法;如此往复,直到用户点击关闭派对,将倒计时关闭并关闭闪光灯