tinyjs-plugin-ninepatch

0.2.4 • Public • Published

tinyjs-plugin-ninepatch

九宫格

查看demo

https://qingyangmoke.github.io/tinyjs-plugin-ninepatch/demo/

引用方法

起步

首先当然是要引入,推荐NPM方式,当然你也可以下载独立版本,先从几个例子入手吧!

1、最简单的例子

引用 Tiny.js 源码

<script src="https://gw.alipayobjects.com/as/g/tiny/tiny/1.1.5/tiny.js"></script>
var sprite = new Tiny.NinePatch.Sprite(
        Tiny.Loader.resources['rect'].texture,
        100,
        100,
        [30, 31, 40, 41]
      );

九宫格概念

  九宫格定义:  scale9Grid=[30,31,50,41]

  表示的含义为 [30:区域1 的宽度值,
              31:区域1 的高度值,
              40:区域2 的宽度值 ,
              41:区域4 的高度值]
       ------------—
       | 1 | 2 | 3 |
       -------------
       | 4 | 5 | 6 |
       -------------
       | 7 | 8 | 9 |
       -------------

注意事项

  1. sprite的宽高不要小于九宫格图片的尺寸
  2. 如果图片是半透明的 请把padding设置成0 否则重合部分有黑线

依赖

相关文档

API文档

http://tinyjs.net/#/plugins/tinyjs-plugin-ninepatch/docs

Readme

Keywords

Package Sidebar

Install

npm i tinyjs-plugin-ninepatch

Weekly Downloads

4

Version

0.2.4

License

MIT

Unpacked Size

1.08 MB

Total Files

21

Last publish

Collaborators

  • icefox0801
  • qingyangmoke