抖音白天与晚上触发不同特效的Graph节点编写

简介: 抖音白天与晚上触发不同特效的Graph节点编写

需求

今天我们要制作一个白天与晚上 (6-18点为白天其余时间为晚上) 拍出来效果不一样的特效。那么我们如何通过graph节点实现这一操作呢?

需求分析

  1. 获取系统时间
  2. 定义时间变量即(几点到几点为白天几点到几点为晚上)
  3. 拿系统时间与定义的时间进行判断如果为白天触发白天特效,否则触发晚上对应的特效

相关代码如下!

Date 当前时间 = new Date;
int time6 = 6;
int time18 = 18;
if(当前时间 >= time6 && 当前时间 <= time18){
  执行白天特效......
}else{
  执行晚上特效......
}

在Graph中实现

上面了解了相关的需求与逻辑,也看过了实现代码,那么在我们抖音平台提供的Graph中如何实现呢?请各位小伙伴紧跟博主的步伐。带领大家逐步操作并完成这一效果。

  1. 获取系统时间节点,这里我们用到的是时间组件的小时属性。


0bee21978dba4e2d98e579f4aba95b97.png

  1. 创建大于等于判断与小于等于判断节点(这里的判断规则是拿数值a与数值b进行判断,结果为true与false)

291bf09e6276430781e8d769974add83.png

  1. 定义判断规则并完成相关链接

97526a9ece134d5e99ad1d7f9fe3ead1.png

  1. 定义并且条件并完成链接,即两个判断条件必须同时满足

d3bb42921dcc41398cb884a2fe036e7a.png

  1. 定义输出节点,输出前面四步操作的值

df181ad48f7a49769e49f89abcdb4623.png

  1. 定义if判断,如果条件成立(true)执行哪些操作,如果不成立(false)执行哪些操作。

e5c2af36c9c74793a13e4dc050532cf5.png

  1. 导入一个具体要执行的操作,默认让贴纸为关闭状态

142b49168f2f4c72aa297ba2f15a87a8.png


a6b6103920f34cc59e06bfe23318fd2b.png


16b1b3f91065455fa77c4b609c0950f6.png

  1. set其启动方法并完成触发链接

f4c93b9877fd4eb4addd127a87142966.png

9bb83a00ea764f0c8b09d34b48254b48.png

  1. 添加触发条件并链接

69aeb8a909884f7e9555d13ec29ccbcd.png

测试

经过编写graph节点,我们的贴纸在6-18点之间点击屏幕会触发其余时间不会触发。那么下面我们来进行相关的测试。

当前系统时间为

55dd7318b48e4853a0539708de044de1.png


我们点击屏幕


80201119fd364078af4bff8aaafe33bf.png

爱心成功出现了!好了本期的效果就到此结束了,大家可以拿去制作有趣的特效了!


附一张成品链接图在末尾!

503bb1003ca44109beea6e31b4f8d9cf.png



相关文章
|
编解码 人工智能 达摩院
建站新功能上线:1秒钟抠好一张图!
建站新功能上线:1秒钟抠好一张图!
708 1
建站新功能上线:1秒钟抠好一张图!
|
移动开发 算法 JavaScript
平滑切换——PPT动画的全新玩法(原理篇)/04/O365智能系列(一)
平滑切换——PPT动画的全新玩法(原理篇)/04/O365智能系列(一)
2699 1
平滑切换——PPT动画的全新玩法(原理篇)/04/O365智能系列(一)
|
7月前
|
小程序 API
技术心得记录:微信小程序之图片频繁变化,几秒之后输出结果(适用于抽奖)
技术心得记录:微信小程序之图片频繁变化,几秒之后输出结果(适用于抽奖)
41 0
|
8月前
|
前端开发 移动开发 JavaScript
跨年动态炫酷烟花网页代码
利用Html5的Canvas技术,模拟出逼真的烟花效果,让用户在网页上欣赏到绚丽多彩的烟花盛宴。同时,通过交互式设计,让用户能够与烟花互动,增加趣味性。
97 0
跨年动态炫酷烟花网页代码
|
8月前
|
测试技术 5G Android开发
面试高频题:如何测试好聊天窗口?
面试高频题:如何测试好聊天窗口?
|
8月前
|
算法 开发者
玩家在游戏中抽奖抽的停不下来,是因为这个?
玩家在游戏中抽奖抽的停不下来,是因为这个?
86 1
切换主题 | 切换白天和夜晚模式
夜晚浏览网页太亮,试试夜晚模式吧,此以 vue3 为例
214 0
|
前端开发
「CSS畅想」周期性事情怕忘,来看看一个月内都安排在哪天
前端玩转CSS,可以创造出不少有趣的效果。今天实现了一个周期性日期获取功能,小功能大用处。
132 1
|
移动开发 前端开发 API
本周推荐 | 基于 canvas 实现 H5 丝滑看图体验
推荐语:随着机器算力及性能的提升,基于原生Web体系的富交互体验也可以媲美原生,本文作者通过Canvas + Web手势从零实现了大图浏览的交互效果,并在体验上不输Native,是一次不错的技术尝试,欢迎阅读。 ——大淘宝技术客户端开发工程师 楚奕
362 0
本周推荐 | 基于 canvas 实现 H5 丝滑看图体验
|
编解码 计算机视觉 Python

热门文章

最新文章