zim实现万圣节森林中百鬼出没动画效果代码
代码语言:html
所属分类:动画
代码描述:zim实现万圣节森林中百鬼出没动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> </head> <body translate="no"> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/createjs-1.3.2.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/zim_nft.js"></script> <script> const assets = [ "//repo.bfw.wiki/bfwrepo/image/616f54f8e4a91.png", ]; const frame = new Frame(FIT, 1024, 768, black, black, assets); frame.on("ready", () => {// ES6 Arrow Function - similar to function(){} zog("ready from ZIM Frame"); // logs in console (F12 - choose console) // often need below - so consider it part of the template const stage = frame.stage; const stageW = frame.width; const stageH = frame.height; // REFERENCES for ZIM at https://zimjs.com // see https://zimjs.com/intro.html for an intro example // see https://zimjs.com/learn.html for video and code tutorials // see https://zimjs.com/docs.html for documentation // see https://codepen.io/topic/zim/ for ZIM on CodePen // *** NOTE: since ZIM Cat (before ZIM NFT) ZIM defaults to time in seconds // All previous versions, examples, videos, etc. have time in milliseconds // This can be set back with TIME = "milliseconds" but we suggest you give it a try! // CODE HERE // Add backing picture to canvas asset("//repo.bfw.wiki/bfwrepo/image/616f54f8e4a91.png").center(); // the Button will have a flare shape which happens to be one of the ZIM shapes // with three states: normal, roll and wait // so set the colors for these states using a STYLE with series // also center the registration but do not add each one // or could do this in each Flare below STYLE = { Flare: { color: series(black, red, yellow), // ZIM VEE values allow you to pick from a series centerReg: { add: false } } }; const button = new Button({ label: new Label({ text: "SUMMON", font: "eldorado", size: 30, shiftHorizontal: 12 // so it looks better on the Flare }), backing: new Flare(), rollBacking: new Flare(), waitBacking: new Flare(), wait: "TRULY?", // this will change the text to a confirm text... waitTime: 2 }). sca(4). alp(.3). centerReg(); // so it rotates nicely when animated button.on("mousedown", e => .........完整代码请登录后点击上方下载按钮下载查看
网友评论0