🚨 Active Supply Chain Attack:node-ipc Package Compromised.Learn More →
tinyjs-plugin-ninepatch
Advanced tools
tinyjs-plugin-ninepatch - npm Package Compare versions
Sorry, the diff of this file is not supported yet
+105
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>tinyjs - 九宫格图片</title> | ||
| <meta content="yes" name="apple-mobile-web-app-capable" /> | ||
| <meta content="yes" name="apple-touch-fullscreen" /> | ||
| <meta content="telephone=no,email=no" name="format-detection" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" /> | ||
| <script src="https://gw.alipayobjects.com/as/g/tiny/tiny/1.1.5/tiny.js"></script> | ||
| <script src="../dist/index.debug.js"></script> | ||
| <style> | ||
| html, | ||
| body, | ||
| p, | ||
| div { | ||
| margin: 0; | ||
| padding: 0; | ||
| background-color: white; | ||
| } | ||
| </style> | ||
| </head> | ||
| <body> | ||
| <script type="text/javascript"> | ||
| var config = { | ||
| showFPS: false, // 显示帧频 | ||
| dpi: 2, // 分辨率 | ||
| width: 320, | ||
| height: 568, | ||
| renderType: Tiny.RENDERER_TYPE.CANVAS, | ||
| renderOptions: { | ||
| transparent: false, | ||
| autoResize: false, | ||
| backgroundColor: 0xb7eaff | ||
| }, | ||
| }; | ||
| function setTitle(title, container) { | ||
| var title = new Tiny.Text(title, { | ||
| fontSize: '18px', | ||
| fill: 'white', | ||
| }); | ||
| title.position.set(Tiny.WIN_SIZE.width / 2, 30); | ||
| title.anchor.set(0.5, 0); | ||
| container.addChild(title); | ||
| } | ||
| var app = new Tiny.Application(config); | ||
| function initGame() { | ||
| container = new Tiny.Container(); | ||
| setTitle('tinyjs - 九宫格 - 提示气泡', container); | ||
| sprite_container = new Tiny.Container(); | ||
| sprite = new Tiny.NinePatch.Sprite( | ||
| Tiny.Loader.resources['tip_bubble_png'].texture, | ||
| 300, | ||
| 100, | ||
| [96, 36, 12, 2], | ||
| 1 | ||
| ); | ||
| sprite_container.x = 10; | ||
| sprite_container.y = 200; | ||
| sprite_container.pivot.y = sprite.height; | ||
| sprite_container.addChild(sprite); | ||
| container.addChild(sprite_container); | ||
| app.run(container); | ||
| var yoyo = true; | ||
| var scale = 1; | ||
| app.onUpdate(function () { | ||
| if (scale === 1) { | ||
| yoyo = true; | ||
| } else if (scale <= 0) { | ||
| yoyo = false; | ||
| } | ||
| if (yoyo) { | ||
| scale -= 0.02; | ||
| } else { | ||
| scale += 0.02; | ||
| } | ||
| sprite_container.scale.set(scale, scale); | ||
| }) | ||
| } | ||
| Tiny.Loader | ||
| .add('tip_bubble_png', 'assets/bubble.png') | ||
| .load(function () { | ||
| initGame(); | ||
| }); | ||
| console.log(Tiny.NinePatch); | ||
| </script> | ||
| </body> | ||
| </html> |
+6
-0
@@ -0,1 +1,7 @@ | ||
| ## 0.2.3 | ||
| `2018-03-07` | ||
| 1. 增加overlapPadding参数，解决canvas渲染的时候有缝隙问题 | ||
| 2. 增加 demo/bubble.html 示例 | ||
| ## 0.2.2 | ||
@@ -2,0 +8,0 @@ |
+26
-4
@@ -5,3 +5,3 @@ /*! | ||
| * Author: 清扬陌客 | ||
| * Version: v0.2.2 | ||
| * Version: v0.2.3 | ||
| * Github: https://github.com/qingyangmoke/tinyjs-plugin-ninepatch.git | ||
@@ -140,4 +140,5 @@ */ | ||
| * @param {Array<Number>} scale9Grid - 九宫格定义 | ||
| * @param {Array<Number>} overlapPadding - canvas渲染的时候 可能会有缝隙 用这个来修复 默认是0 | ||
| */ | ||
| function Sprite(texture, width, height, scale9Grid) { | ||
| function Sprite(texture, width, height, scale9Grid, overlapPadding) { | ||
| _classCallCheck(this, Sprite); | ||
@@ -187,2 +188,7 @@ | ||
| /** | ||
| * canvas渲染的时候 可能会有缝隙 用这个来修复 默认是0 | ||
| */ | ||
| _this._overlapPadding = overlapPadding || 0; | ||
| _this._inited = false; | ||
@@ -281,2 +287,3 @@ | ||
| var overlapPadding = this.overlapPadding; | ||
| for (var row = 0; row < 3; row++) { | ||
@@ -295,4 +302,4 @@ for (var col = 0; col < 3; col++) { | ||
| child.anchor.set(0, 0); | ||
| child.x = x; | ||
| child.y = y; | ||
| child.x = x - col * overlapPadding; | ||
| child.y = y - row * overlapPadding; | ||
| child.alpha = this._debugDraw ? 0.1 + i * 0.05 : 1; | ||
@@ -377,2 +384,17 @@ child.width = w; | ||
| } | ||
| /** | ||
| * @name Tiny.NinePatch.Sprite#overlapPadding | ||
| * @property {number} overlapPadding - 九宫格之间的重合度 canvas渲染的时候 可能会有缝隙 用这个来修复 默认是0 | ||
| */ | ||
| }, { | ||
| key: 'overlapPadding', | ||
| get: function get() { | ||
| return this._overlapPadding; | ||
| }, | ||
| set: function set(value) { | ||
| this._overlapPadding = +value || 0; | ||
| this._update(); | ||
| } | ||
| }]); | ||
@@ -379,0 +401,0 @@ |
+2
-2
@@ -5,5 +5,5 @@ /*! | ||
| * Author: 清扬陌客 | ||
| * Version: v0.2.2 | ||
| * Version: v0.2.3 | ||
| * Github: https://github.com/qingyangmoke/tinyjs-plugin-ninepatch.git | ||
| */ | ||
| !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.NinePatch=e():(t.Tiny=t.Tiny||{},t.Tiny.NinePatch=e())}(this,function(){return function(t){function e(r){if(i[r])return i[r].exports;var n=i[r]={exports:{},id:r,loaded:!1};return t[r].call(n.exports,n,n.exports,e),n.loaded=!0,n.exports}var i={};return e.m=t,e.c=i,e.p="/Users/song/Develop/github/tinyjs-plugin-ninepatch/dist",e(0)}([function(t,e,i){t.exports=i(1)},function(t,e,i){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}Object.defineProperty(e,"__esModule",{value:!0}),e.Sprite=void 0;var n=i(2),u=r(n);e.Sprite=u.default},function(t,e){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function n(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0});var u=function(){function t(t,e){for(var i=0;i<e.length;i++){var r=e[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,i,r){return i&&t(e.prototype,i),r&&t(e,r),e}}(),a=function(t){function e(t,n,u,a){i(this,e);var h=r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this));return h._gridTexture=t,h._debugDraw=!1,h._textures=[],h._gridSprites=[],h._targetWidth=n||0,h._targetHeight=u||0,h._textureOrigFrame=new Tiny.Rectangle(0,0,h._gridTexture.width,h._gridTexture.height),h._scale9Grid=null,h._inited=!1,h._init(),h.scale9Grid=a,h._gridTexture.baseTexture.hasLoaded?h._onGridTextureUpdate():h._gridTexture.once("update",h._onGridTextureUpdate,h),h}return n(e,t),u(e,[{key:"_onGridTextureUpdate",value:function(){this._update()}},{key:"_init",value:function(){if(!this._inited){this._inited=!0;for(var t=0;t<9;t++){var e=new Tiny.Texture(this._gridTexture,new Tiny.Rectangle(0,0,this._gridTexture.width,this._gridTexture.height),new Tiny.Rectangle(0,0,this._gridTexture.width,this._gridTexture.height),null,0);this._textures.push(e);var i=new Tiny.Sprite(e);i.visible=!1,this._gridSprites.push(i),this.addChild(i)}}}},{key:"resize",value:function(t,e){this._targetWidth=t,this._targetHeight=e,this._update(t,e)}},{key:"_update",value:function(){if(this._gridTexture){(this.width<this._gridTexture.width||this.height<this._gridTexture.height)&&console.warn("九宫格尺寸设置异常，尺寸不能小于素材尺寸");for(var t=Math.max(this.width,this._gridTexture.width),e=Math.max(this.height,this._gridTexture.height),i=this._scale9Grid,r=i[0],n=Math.max(0,i[2]),u=Math.max(0,this._gridTexture.width-r-n),a=i[1],h=Math.max(0,i[3]),s=Math.max(0,this._gridTexture.height-a-h),o=[r,n,u],d=[0,r,r+n],c=[a,h,s],f=[0,a,a+h],_=0;_<3;_++)for(var l=0;l<3;l++){var g=3*_+l,p=this._gridSprites[g],x=new Tiny.Rectangle(d[l],f[_],o[l],c[_]);if(x.width>0&&x.height>0){var y=0===l||2===l?o[l]:Math.max(0,t-o[0]-o[2]),T=0===_||2===_?c[_]:Math.max(0,e-c[0]-c[2]),b=0===l?0:1===l?o[0]:Math.max(0,t-o[2]),w=0===_?0:1===_?c[0]:Math.max(0,e-c[2]);y>0&&T>0?(this._textures[g].frame=x,p.anchor.set(0,0),p.x=b,p.y=w,p.alpha=this._debugDraw?.1+.05*g:1,p.width=y,p.height=T,p.visible=!0):p.visible=!1}else p.visible=!1}this.emit("resize")}}},{key:"debug",get:function(){return this._debugDraw},set:function(t){this._debugDraw=t,this._update()}},{key:"scale9Grid",get:function(){return this._scale9Grid},set:function(t){if(t){var e="string"==typeof t?t.split(","):t;if(4!==e.length)return void console.error("error scale9Grid format",t);e=e.map(function(t){return parseFloat(t)}),this._scale9Grid=e}else this._scale9Grid=[0,0,0,0];this._update()}},{key:"width",get:function(){return this._targetWidth||this._gridTexture.width},set:function(t){this._targetWidth=t,this._update()}},{key:"height",get:function(){return this._targetHeight||this._gridTexture.height},set:function(t){this._targetHeight=t,this._update()}}]),e}(Tiny.Sprite);e.default=a}])}); | ||
| !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.NinePatch=e():(t.Tiny=t.Tiny||{},t.Tiny.NinePatch=e())}(this,function(){return function(t){function e(r){if(i[r])return i[r].exports;var n=i[r]={exports:{},id:r,loaded:!1};return t[r].call(n.exports,n,n.exports,e),n.loaded=!0,n.exports}var i={};return e.m=t,e.c=i,e.p="/Users/song/Develop/github/tinyjs-plugin-ninepatch/dist",e(0)}([function(t,e,i){t.exports=i(1)},function(t,e,i){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}Object.defineProperty(e,"__esModule",{value:!0}),e.Sprite=void 0;var n=i(2),a=r(n);e.Sprite=a.default},function(t,e){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function n(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0});var a=function(){function t(t,e){for(var i=0;i<e.length;i++){var r=e[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,i,r){return i&&t(e.prototype,i),r&&t(e,r),e}}(),u=function(t){function e(t,n,a,u,o){i(this,e);var s=r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this));return s._gridTexture=t,s._debugDraw=!1,s._textures=[],s._gridSprites=[],s._targetWidth=n||0,s._targetHeight=a||0,s._textureOrigFrame=new Tiny.Rectangle(0,0,s._gridTexture.width,s._gridTexture.height),s._scale9Grid=null,s._overlapPadding=o||0,s._inited=!1,s._init(),s.scale9Grid=u,s._gridTexture.baseTexture.hasLoaded?s._onGridTextureUpdate():s._gridTexture.once("update",s._onGridTextureUpdate,s),s}return n(e,t),a(e,[{key:"_onGridTextureUpdate",value:function(){this._update()}},{key:"_init",value:function(){if(!this._inited){this._inited=!0;for(var t=0;t<9;t++){var e=new Tiny.Texture(this._gridTexture,new Tiny.Rectangle(0,0,this._gridTexture.width,this._gridTexture.height),new Tiny.Rectangle(0,0,this._gridTexture.width,this._gridTexture.height),null,0);this._textures.push(e);var i=new Tiny.Sprite(e);i.visible=!1,this._gridSprites.push(i),this.addChild(i)}}}},{key:"resize",value:function(t,e){this._targetWidth=t,this._targetHeight=e,this._update(t,e)}},{key:"_update",value:function(){if(this._gridTexture){(this.width<this._gridTexture.width||this.height<this._gridTexture.height)&&console.warn("九宫格尺寸设置异常，尺寸不能小于素材尺寸");for(var t=Math.max(this.width,this._gridTexture.width),e=Math.max(this.height,this._gridTexture.height),i=this._scale9Grid,r=i[0],n=Math.max(0,i[2]),a=Math.max(0,this._gridTexture.width-r-n),u=i[1],o=Math.max(0,i[3]),s=Math.max(0,this._gridTexture.height-u-o),h=[r,n,a],d=[0,r,r+n],c=[u,o,s],f=[0,u,u+o],l=this.overlapPadding,_=0;_<3;_++)for(var g=0;g<3;g++){var p=3*_+g,x=this._gridSprites[p],y=new Tiny.Rectangle(d[g],f[_],h[g],c[_]);if(y.width>0&&y.height>0){var T=0===g||2===g?h[g]:Math.max(0,t-h[0]-h[2]),v=0===_||2===_?c[_]:Math.max(0,e-c[0]-c[2]),b=0===g?0:1===g?h[0]:Math.max(0,t-h[2]),w=0===_?0:1===_?c[0]:Math.max(0,e-c[2]);T>0&&v>0?(this._textures[p].frame=y,x.anchor.set(0,0),x.x=b-g*l,x.y=w-_*l,x.alpha=this._debugDraw?.1+.05*p:1,x.width=T,x.height=v,x.visible=!0):x.visible=!1}else x.visible=!1}this.emit("resize")}}},{key:"debug",get:function(){return this._debugDraw},set:function(t){this._debugDraw=t,this._update()}},{key:"scale9Grid",get:function(){return this._scale9Grid},set:function(t){if(t){var e="string"==typeof t?t.split(","):t;if(4!==e.length)return void console.error("error scale9Grid format",t);e=e.map(function(t){return parseFloat(t)}),this._scale9Grid=e}else this._scale9Grid=[0,0,0,0];this._update()}},{key:"width",get:function(){return this._targetWidth||this._gridTexture.width},set:function(t){this._targetWidth=t,this._update()}},{key:"height",get:function(){return this._targetHeight||this._gridTexture.height},set:function(t){this._targetHeight=t,this._update()}},{key:"overlapPadding",get:function(){return this._overlapPadding},set:function(t){this._overlapPadding=+t||0,this._update()}}]),e}(Tiny.Sprite);e.default=u}])}); |
+1
-1
| { | ||
| "name": "tinyjs-plugin-ninepatch", | ||
| "version": "0.2.2", | ||
| "version": "0.2.3", | ||
| "author": "清扬陌客", | ||
@@ -5,0 +5,0 @@ "description": "Tinyjs 九宫格图", |
+2
-2
@@ -17,4 +17,4 @@ # tinyjs-plugin-ninepatch | ||
| - https://gw.alipayobjects.com/as/g/tiny-plugins/tinyjs-plugin-ninepatch/0.2.2/index.debug.js | ||
| - https://gw.alipayobjects.com/as/g/tiny-plugins/tinyjs-plugin-ninepatch/0.2.2/index.js | ||
| - https://gw.alipayobjects.com/as/g/tiny-plugins/tinyjs-plugin-ninepatch/0.2.3/index.debug.js | ||
| - https://gw.alipayobjects.com/as/g/tiny-plugins/tinyjs-plugin-ninepatch/0.2.3/index.js | ||
@@ -21,0 +21,0 @@ ## 起步 |
+22
-3
@@ -25,4 +25,5 @@ /** | ||
| * @param {Array<Number>} scale9Grid - 九宫格定义 | ||
| * @param {Array<Number>} overlapPadding - canvas渲染的时候 可能会有缝隙 用这个来修复 默认是0 | ||
| */ | ||
| constructor(texture, width, height, scale9Grid) { | ||
| constructor(texture, width, height, scale9Grid, overlapPadding) { | ||
| super(); | ||
@@ -69,2 +70,7 @@ this._gridTexture = texture; | ||
| /** | ||
| * canvas渲染的时候 可能会有缝隙 用这个来修复 默认是0 | ||
| */ | ||
| this._overlapPadding = overlapPadding || 0; | ||
| this._inited = false; | ||
@@ -166,2 +172,14 @@ | ||
| /** | ||
| * @name Tiny.NinePatch.Sprite#overlapPadding | ||
| * @property {number} overlapPadding - 九宫格之间的重合度 canvas渲染的时候 可能会有缝隙 用这个来修复 默认是0 | ||
| */ | ||
| get overlapPadding() { | ||
| return this._overlapPadding; | ||
| } | ||
| set overlapPadding(value) { | ||
| this._overlapPadding = +value || 0; | ||
| this._update(); | ||
| } | ||
| /** | ||
| * 改变尺寸 | ||
@@ -211,2 +229,3 @@ * @private | ||
| const overlapPadding = this.overlapPadding; | ||
| for (let row = 0; row < 3; row++) { | ||
@@ -225,4 +244,4 @@ for (let col = 0; col < 3; col++) { | ||
| child.anchor.set(0, 0); | ||
| child.x = x; | ||
| child.y = y; | ||
| child.x = x - col * overlapPadding; | ||
| child.y = y - row * overlapPadding; | ||
| child.alpha = this._debugDraw ? (0.1 + i * 0.05) : 1; | ||
@@ -229,0 +248,0 @@ child.width = w; |
New alerts
Uses eval
Supply chain riskPackage uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.
Found 1 instance in 1 package
Environment variable access
Supply chain riskPackage accesses environment variables, which may be a sign of credential stuffing or data theft.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Fixed alerts
Uses eval
Supply chain riskPackage uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.
Found 1 instance in 1 package
Environment variable access
Supply chain riskPackage accesses environment variables, which may be a sign of credential stuffing or data theft.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
1081872
0.55%- Number of package files
21
10.53%- Lines of code
28924
0.12%No dependency changes