Namespace: Tiny

Classes

Action

AnimatedSprite

Application

BaseRenderTexture

BaseTexture

BinaryLoader

Bounds

Buffer

CanvasMaskManager

CanvasRenderer

CanvasRenderTarget

CanvasTinter

Circle

Container

DisplayObject

Ellipse

EventEmitter

Filter

FilterManager

Graphics

GraphicsData

GraphicsRenderer

GroupD8

MaskManager

Matrix

ObjectRenderer

ObservablePoint

Point

Polygon

Quad

Rectangle

RenderTarget

RenderTexture

RoundedRectangle

Sprite

SpriteMaskFilter

Spritesheet

StencilManager

SystemRenderer

Text

TextMetrics

TextStyle

Texture

TextureGarbageCollector

TextureManager

TextureTransform

Transform

TransformBase

TransformStatic

Transition

VideoBaseTexture

WebGLManager

WebGLRenderer

WebGLState

Namespaces

loaders

settings

ticker

Members

static,constantTiny.BLEND_MODESobject

Various blend modes supported.


IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes.
Anything else will silently act like NORMAL.

Properties:

Name	Type	Description
NORMAL	number
ADD	number
MULTIPLY	number
SCREEN	number
OVERLAY	number
DARKEN	number
LIGHTEN	number
COLOR_DODGE	number
COLOR_BURN	number
HARD_LIGHT	number
SOFT_LIGHT	number
DIFFERENCE	number
EXCLUSION	number
HUE	number
SATURATION	number
COLOR	number
LUMINOSITY	number

static,constantTiny.configobject

默认配置参数

Properties:

Name	Type	Default	Description
width	number	window.innerWidth	宽度
height	number	window.innerHeight	高度
referWidth	number	320	基准参考宽度，如：320、375，默认：320
fixSize	Boolean	false	是否固定尺寸为传入的宽高
canvasId	string	'TinyCanvas'	canvas的DOM
orientation	Boolean	0	横竖屏 [0: 竖屏, 1: 横屏]
dpi	number	1	分辨率
fps	number	60	帧频，接受传入：10、20、30、40、50、60
showFPS	boolean	false	是否显示帧频
renderType	number	0	渲染类型 [0: 自动识别, 1: WEBGL, 2: CANVAS]
renderOptions	object		渲染参数，见Tiny.settings.RENDER_OPTIONS
autoRender	number	1	是否自动渲染 [0: 手动, 1: 自动]

static,constantTiny.DATA_URIRegExp string

Regexp for data URI.
Based on: https://github.com/ragingwind/data-uri-regex

example

data:image/png;base64

static,constanttiny.deg_to_radnumber

constant conversion factor for converting degrees to radians

static,constanttiny.draw_modesobject

various webgl draw modes. these can be used to specify which gl drawmode to use
under certain situations and renderers.

properties:

name	type	description
points	number
lines	number
line_loop	number
line_strip	number
triangles	number
triangle_strip	number
triangle_fan	number

static,constanttiny.gc_modesobject

the gc modes that are supported by tiny.

the Tiny.settings.GC_MODE Garbage Collection mode for Tiny textures is AUTO
If set to GC_MODE, the renderer will occasianally check textures usage. If they are not
used for a specified period of time they will be removed from the GPU. They will of course
be uploaded again when they are required. This is a silent behind the scenes process that
should ensure that the GPU does not get filled up.

Handy for mobile devices!
This property only affects WebGL.

Properties:

Name	Type	Description
AUTO	number	Garbage collection will happen periodically automatically
MANUAL	number	Garbage collection will need to be called manually

staticTiny.LoaderTiny.loaders.Loader

A premade instance of the loader that can be used to load resources.

Example

var resources = [..];
Tiny.Loader.run({
  resources: resources,
  onProgress: function (pre) {
    console.log("percent:", pre + "%");
  },
  onAllComplete: function () {
    console.log('all complete');
    Tiny.app.run(new MenuLayer());
  }
});

static,constantTiny.PI_2number

Math.PI * 2

static,constantTiny.PRECISIONobject

Constants that specify float precision in shaders.

Properties:

Name	Type	Default	Description
LOW	string	'lowp'
MEDIUM	string	'mediump'
HIGH	string	'highp'

static,constantTiny.RAD_TO_DEGnumber

Constant conversion factor for converting radians to degrees

static,constantTiny.RENDERER_TYPEobject

Constant to identify the Renderer Type.

Properties:

Name	Type	Description
UNKNOWN	number	Unknown render type.
WEBGL	number	WebGL render type.
CANVAS	number	Canvas render type.

static,constantTiny.SCALE_MODESobject

The scale modes that are supported.

The Tiny.settings.SCALE_MODE scale mode affects the default scaling mode of future operations.
It can be re-assigned to either LINEAR or NEAREST, depending upon suitability.

Properties:

Name	Type	Description
LINEAR	number	Smooth scaling
NEAREST	number	Pixelating scaling

static,constantTiny.SHAPESobject

Constants that identify shapes, mainly to prevent instanceof calls.

Properties:

Name	Type	Description
POLY	number	Polygon
RECT	number	Rectangle
CIRC	number	Circle
ELIP	number	Ellipse
RREC	number	Rounded Rectangle

static,constantTiny.SVG_SIZERegExp string

Regexp for SVG size.

Example

<svg width="100" height="100"></svg>

static,constantTiny.TEXT_GRADIENTobject

Constants that define the type of gradient on text.

Properties:

Name	Type	Description
LINEAR_VERTICAL	number	Vertical gradient
LINEAR_HORIZONTAL	number	Linear gradient

static,constantTiny.TRANSFORM_MODEobject

Constants that specify the transform type.

Properties:

Name	Type	Description
STATIC	number
DYNAMIC	number

staticTiny.TWEENobject

See:

• https://github.com/tweenjs/tween.js

static,constanttiny.update_priorityobject

represents the update priorities used by internal tiny classes when registered with
the Tiny.ticker.Ticker object. Higher priority items are updated first and lower
priority items, such as render, should go later.

Properties:

Name	Type	Default	Description
INTERACTION	number	50	Highest priority, used for Tiny.interaction.InteractionManager
HIGH	number	25	High priority updating, Tiny.VideoBaseTexture and Tiny.AnimatedSprite
NORMAL	number	0	Default priority for ticker events, see Tiny.ticker.Ticker#add.
LOW	number	-25	Low priority used for Tiny.Application rendering.
UTILITY	number	-50	Lowest priority used for Tiny.prepare.BasePrepare utility.

static,constantTiny.VERSIONstring

String of the current Tiny version.

static,constantTiny.WIN_SIZEobject

主界面尺寸

Properties:

Name	Type	Description
width	number	宽
height	number	高

static,constantTiny.WRAP_MODESobject

The wrap modes that are supported.

The Tiny.settings.WRAP_MODE wrap mode affects the default wraping mode of future operations.
It can be re-assigned to either CLAMP or REPEAT, depending upon suitability.
If the texture is non power of two then clamp will be used regardless as webGL can
only use REPEAT if the texture is po2.

This property only affects WebGL.

Properties:

Name	Type	Description
CLAMP	number	The textures uvs are clamped
REPEAT	number	The texture uvs tile and repeat
MIRRORED_REPEAT	number	The texture uvs tile and repeat with mirroring

Methods

staticTiny.arrayRemoveObject(arr, delObj)

tiny/core/utils/index.js, line 541

从数组中移除某个对象

Name	Type	Description
arr	array.<object>
delObj	object

staticTiny.Back(action) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 395

原动作返回

Name	Type	Description
action	Tiny.Action

Returns:

Type	Description
Tiny.Action

staticTiny.Blink(hideDuration, showDuration) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 173

Name	Type	Description
hideDuration	number
showDuration	number

Returns:

Type	Description
Tiny.Action

staticTiny.clearTextureCache()

tiny/core/utils/index.js, line 712

Removes all textures from cache, but does not destroy them

staticTiny.decomposeDataUri(dataUri) ❯ {DecomposedDataUri|undefined}

tiny/core/utils/index.js, line 422

Split a data URI into components. Returns undefined if parameter dataUri is not a valid data URI.

Name	Type	Description
dataUri	string	the data URI to check

Returns:

Type	Description
DecomposedDataUri | undefined	The decomposed data uri or undefined

staticTiny.deg2radian(deg) ❯ {number}

tiny/core/utils/index.js, line 348

角度值转弧度

Name	Type	Description
deg

Returns:

Type	Description
number

staticTiny.destroyTextureCache()

tiny/core/utils/index.js, line 694

Destroys all texture in the cache

staticTiny.detect(obj, iterator, context, arg1, arg2) ❯ {boolean}

tiny/core/utils/index.js, line 558

Looks through each value in the list, returning the first one that passes a truth test (predicate), or undefined if no value passes the test. The function returns as soon as it finds an acceptable element, and doesn't traverse the entire list.

Name	Type	Description
obj	object
iterator	function
context	object
arg1
arg2

Returns:

Type	Description
boolean

Example

var even = Tiny.detect([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
 //=> 2

staticTiny.exports.color2hex(color)

tiny/core/utils/index.js, line 321

转换 color 对象为二进制颜色值

Name	Type	Description
color

Version:

• 1.0.2

Example

var color = Tiny.color(255, 255, 0);
var hex = Tiny.color2hex(color);
//=> 16776960
//等于 0xffff00

staticTiny.FadeIn(duration) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 225

Name	Type	Description
duration	number

Returns:

Type	Description
Tiny.Action

staticTiny.FadeOut(duration) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 236

Name	Type	Description
duration	number

Returns:

Type	Description
Tiny.Action

staticTiny.FadeTo(duration, to) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 203

Name	Type	Description
duration	number
to	number

Returns:

Type	Description
Tiny.Action

staticTiny.getResolutionOfUrl(url, defaultValue) ❯ {number}

tiny/core/utils/index.js, line 392

get the resolution / device pixel ratio of an asset by looking for the prefix
used by spritesheets and image urls

Name	Type	Default	Description
url	string		the image path
defaultValue	number	1	optional the defaultValue if no filename prefix is set.

Returns:

Type	Description
number	resolution / device pixel ratio of an asset

staticTiny.getSvgSize(svgString) ❯ {Size|undefined}

tiny/core/utils/index.js, line 471

Get size from an svg string using regexp.

Name	Type	Description
svgString	string	a serialized svg element

Returns:

Type	Description
Size | undefined	image extension

staticTiny.getTime() ❯ {number}

tiny/core/utils/index.js, line 155

高精度获取当前时间，比 Date.now() 的精度高1000倍，为考虑不同性能场景下的时间获取，建议使用此方法来替代 Date.now()。

Returns:

Type	Description
number

staticTiny.getUrlFileExtension(url) ❯ {string|undefined}

tiny/core/utils/index.js, line 445

Get type of the image by regexp for extension. Returns undefined for unknown extensions.

Name	Type	Description
url	string	the image path

Returns:

Type	Description
string | undefined	image extension

staticTiny.hex2rgb(hex, out) ❯ {Array.<number>}

tiny/core/utils/index.js, line 261

Converts a hex color number to an [R, G, B] array

Name	Type	Default	Description
hex	number		The number to convert
out	Array.<number>	[]	optional If supplied, this array will be used rather than returning a new one

Returns:

Type	Description
Array.<number>	An array representing the [R, G, B] of the color.

staticTiny.hex2string(hex) ❯ {string}

tiny/core/utils/index.js, line 280

Converts a hex color number to a string.

Name	Type	Description
hex	number	Number in hex

Returns:

Type	Description
string	The string color.

staticTiny.isArray(obj) ❯ {Boolean}

tiny/core/utils/index.js, line 77

判断对象是否是Array类型

Name	Type	Description
obj	Object	要判断的对象

Returns:

Type	Description
Boolean

staticTiny.isFunction(obj) ❯ {Boolean}

tiny/core/utils/index.js, line 90

判断对象是否是函数类型

Name	Type	Description
obj	Object	要判断的对象

Returns:

Type	Description
Boolean

staticTiny.isMobile() ❯ {object}

tiny/core/utils/index.js, line 22

See:

• https://github.com/kaimallea/ismobile

returns:

type	description
object

statictiny.isnumber(obj) ❯ {boolean}

tiny/core/utils/index.js, line 103

判断对象是否是Number类型

Name	Type	Description
obj	Object	要判断的对象

Returns:

Type	Description
Boolean

staticTiny.isObject(obj) ❯ {boolean}

tiny/core/utils/index.js, line 142

判断对象是否是Object类型

Name	Type	Description
obj	Object	要判断的对象

Returns:

Type	Description
boolean

staticTiny.isPixelCollision(first, x, y, isFirstCentred, other, x2, y2, isOtherCentred) ❯ {boolean}

tiny/core/utils/decide.js, line 195

像素检测判断是否碰撞

Tiny.js 的这个方法用于JavaScript HTML5 Canvas Image 纯像素级的碰撞检测。
作者是：JOE

Name	Type	Description
first	Tiny.DisplayObject
x	number
y	number
isFirstCentred	boolean
other	Tiny.DisplayObject
x2	number
y2	number
isOtherCentred	boolean

See:

• http://www.playmycode.com/blog/2011/08/javascript-per-pixel-html5-canvas-image-collision-detection/

Returns:

Type	Description
boolean

staticTiny.isString(obj) ❯ {Boolean}

tiny/core/utils/index.js, line 116

判断对象是否是String类型

Name	Type	Description
obj	Object	要判断的对象

Returns:

Type	Description
Boolean

staticTiny.isUndefined(obj) ❯ {boolean}

tiny/core/utils/index.js, line 129

判断对象是否是Undefined类型

Name	Type	Description
obj

Returns:

Type	Description
boolean

staticTiny.isWebGLSupported() ❯ {boolean}

tiny/core/utils/index.js, line 491

Helper for checking for webgl support

Returns:

Type	Description
boolean	is webgl supported

staticTiny.JumpTo(duration, to, height, times) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 136

Name	Type	Description
duration	number
to	object
height	number
times	number

Returns:

Type	Description
Tiny.Action

staticTiny.MoveBy(duration, to) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 4

Name	Type	Description
duration	number
to	object	Name Type Description x number y number

Returns:

Type	Description
Tiny.Action

staticTiny.MoveTo(duration, to) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 30

Name	Type	Description
duration	number
to	object	Name Type Description x number y number

Returns:

Type	Description
Tiny.Action

staticTiny.pluginTarget(obj)

tiny/core/utils/pluginTarget.js, line 12

Mixins functionality to make an object have "plugins".

Name	Type	Description
obj	object	The object to mix into.

Example

function MyObject() {}

 pluginTarget.mixin(MyObject);

staticTiny.point(x, y) ❯ {object}

tiny/core/utils/index.js, line 600

转化坐标值

Name	Type	Description
x	number
y	number	如果不传，则等于 x

Returns:

Type	Description
object

Example

Tiny.point(100, 200);
 //=> {x: 100, y: 200}

staticTiny.radian2deg(radian) ❯ {number}

tiny/core/utils/index.js, line 360

弧度值转角度

Name	Type	Description
radian

Returns:

Type	Description
number

staticTiny.random(min, max) ❯ {number}

tiny/core/utils/index.js, line 167

生成数字区间内的随机整型数据

Name	Type	Description
min
max

Returns:

Type	Description
number

Example

Tiny.random(10, 18);
 //=> 15

staticTiny.randomBool(chance) ❯ {boolean}

tiny/core/utils/index.js, line 216

生成随机的Boolean类型数据

Name	Type	Description
chance	number	生成 true 的几率，默认值：0.5

Returns:

Type	Description
boolean

staticTiny.randomFloat(min, max) ❯ {number}

tiny/core/utils/index.js, line 202

返回区间内的随机浮点类型数字

Name	Type	Description
min
max

Returns:

Type	Description
number

staticTiny.randomFromArray(arr) ❯ {object}

tiny/core/utils/index.js, line 249

随机返回数组中的任意对象

Name	Type	Description
arr	array.<object>

Returns:

Type	Description
object

staticTiny.randomInt() ❯ {boolean}

tiny/core/utils/index.js, line 190

Tiny.random 的别名

Returns:

Type	Description
boolean

staticTiny.randomPM(chance) ❯ {number}

tiny/core/utils/index.js, line 230

随机生成 {-1, 1} 两个值

Name	Type	Description
chance	number	生成 -1 的几率，默认值：0.5

Returns:

Type	Description
number

Example

Tiny.randomPM(0.8);
 //=> -1

staticTiny.rectContainsPoint(rect, point) ❯ {boolean}

tiny/core/utils/decide.js, line 113

检测一个点是否在一个显示对象内部

注意：边缘重叠始终返回fasle

Name	Type	Description
rect	Tiny.Rectangle
point	Tiny.Point

Returns:

Type	Description
boolean

Example

var rect = new Tiny.Rectangle(10, 10, 50, 50);
var p = new Tiny.Point(49, 62);
Tiny.rectContainsPoint(rect, p);
//=> true

staticTiny.rectContainsRect(rect1, rect2) ❯ {boolean}

tiny/core/utils/decide.js, line 3

检测一个显示对象是否在另一个显示对象内部

注意：边缘重叠始终返回fasle

Name	Type	Description
rect1	Tiny.Rectangle
rect2	Tiny.Rectangle

Returns:

Type	Description
boolean

Example

var rect1 = new Tiny.Rectangle(10, 10, 100, 100);
var rect2 = new Tiny.Rectangle(30, 30, 50, 50);
Tiny.rectContainsRect(rect1, rect2);
//=> true

staticTiny.rectGetMaxX(rect) ❯ {number}

tiny/core/utils/decide.js, line 35

获取显示对象的横向最大值

Name	Type	Description
rect	Tiny.Rectangle

Returns:

Type	Description
number

staticTiny.rectGetMaxY(rect) ❯ {number}

tiny/core/utils/decide.js, line 74

获取显示对象的纵向最大值

Name	Type	Description
rect	Tiny.Rectangle

Returns:

Type	Description
number

staticTiny.rectGetMidX(rect) ❯ {number}

tiny/core/utils/decide.js, line 48

获取显示对象的横向中心值

Name	Type	Description
rect	Tiny.Rectangle

Returns:

Type	Description
number

staticTiny.rectGetMidY(rect) ❯ {number}

tiny/core/utils/decide.js, line 87

获取显示对象的纵向中心值

Name	Type	Description
rect	Tiny.Rectangle

Returns:

Type	Description
number

staticTiny.rectGetMinX(rect) ❯ {number}

tiny/core/utils/decide.js, line 61

获取显示对象的横向最小值

Name	Type	Description
rect	Tiny.Rectangle

Returns:

Type	Description
number

staticTiny.rectGetMinY(rect) ❯ {number}

tiny/core/utils/decide.js, line 100

获取显示对象的纵向最小值

Name	Type	Description
rect	Tiny.Rectangle

Returns:

Type	Description
number

staticTiny.rectIntersectsRect(rectA, rectB) ❯ {boolean}

tiny/core/utils/decide.js, line 139

检测两个显示对象是否相交，一般用于检测碰撞

注意：边缘重叠始终返回true

Name	Type	Description
rectA	Tiny.Rectangle
rectB	Tiny.Rectangle

Returns:

Type	Description
boolean

Example

var rect1 = new Tiny.Rectangle(10, 10, 50, 50);
var rect2 = new Tiny.Rectangle(50, 30, 50, 50);
Tiny.rectIntersectsRect(rect1, rect2);
//=> true

staticTiny.rectUnion(rectA, rectB) ❯ {Tiny.Rectangle}

tiny/core/utils/decide.js, line 167

返回两个显示对象的总区域

Name	Type	Description
rectA	Tiny.Rectangle
rectB	Tiny.Rectangle

Returns:

Type	Description
Tiny.Rectangle

Example

var rect1 = new Tiny.Rectangle(10, 10, 50, 50);
var rect2 = new Tiny.Rectangle(33, 34, 50, 50);
Tiny.rectUnion(rect1, rect2);
//=> Tiny.Rectangle(10, 10, 73, 74)

staticTiny.removeItems(arr, startIdx, removeCount) ❯ {object}

tiny/core/utils/index.js, line 30

Name	Type	Description
arr	array.<object>	源数组
startIdx	number	起始位
removeCount	number	移除的数量

See:

• https://github.com/mreinstein/remove-array-items

returns:

type	description
object

example

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
removeitems(arr, 3, 4);
//=> [1, 2, 3, 8, 9]

statictiny.repeat(times, action, delay) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 335

重复

Name	Type	Description
times	number	重复次数
action	Tiny.Action	要重复的 Action
delay	number	延迟（ms）

Returns:

Type	Description
Tiny.Action

staticTiny.RepeatForever(action, delay) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 321

永久重复

Name	Type	Description
action	Tiny.Action	要重复的 Action
delay	number	延迟（ms）

Returns:

Type	Description
Tiny.Action

staticTiny.rgb2hex(rgb) ❯ {number}

tiny/core/utils/index.js, line 295

Converts a color as an [R, G, B] array to a hex number

Name	Type	Description
rgb	Array.<number>	rgb array

Returns:

Type	Description
number	The color number

staticTiny.RotateBy(duration, to) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 94

Name	Type	Description
duration	number
to	object	Name Type Description rotation number

Returns:

Type	Description
Tiny.Action

staticTiny.RotateTo(duration, to) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 118

Name	Type	Description
duration	number
to	object	Name Type Description rotation number

Returns:

Type	Description
Tiny.Action

staticTiny.scale(x, y) ❯ {object}

tiny/core/utils/index.js, line 622

转化缩放值

Name	Type	Description
x	number
y	number	如果不传，则等于 x

Returns:

Type	Description
object

Example

Tiny.scale(2, 1.5);
 //=> {scaleX: 2, scaleY: 1.5}

staticTiny.ScaleBy(duration, to) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 49

Name	Type	Description
duration	number
to	object	Name Type Description scaleX object scaleY object

Returns:

Type	Description
Tiny.Action

staticTiny.ScaleTo(duration, to) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 75

Name	Type	Description
duration	number
to	object	Name Type Description scaleX object scaleY object

Returns:

Type	Description
Tiny.Action

staticTiny.sign(n) ❯ {number}

tiny/core/utils/index.js, line 527

Returns sign of number

Name	Type	Description
n	number	the number to check the sign of

Returns:

Type	Description
number	0 if n is 0, -1 if n is negative, 1 if n is positive

staticTiny.TintBy(duration, color) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 247

注意：差值计算时，R、G、B三个通道，无论加减多少，最后的结果最少是0，最多是255。

Name	Type	Description
duration	number
color	number | Tiny.color	此处的 color 虽然是 Tiny.color 类型，但是并不代表某个色值，而是色值与色值直接要做的差值

Returns:

Type	Description
Tiny.Action

Example

var action = Tiny.TintBy(1000, Tiny.color(-85, 0, 85));
sprite.runAction(action);
//=> sprite.tint 等于 0xaaffff（即：[170, 255, 255]）

staticTiny.TintTo(duration, color) ❯ {Tiny.Action}

tiny/actions/ActionInterval.js, line 288

Name	Type	Description
duration	number
color	number | Tiny.color

Returns:

Type	Description
Tiny.Action

Examples

var action = Tiny.TintTo(1000, 0xFFFF00);
sprite.tint = 0xFF0000;
sprite.runAction(action);

// [255, 102, 0] 即橙色（#FF6600）
var action = Tiny.TintTo(1000, Tiny.color(255, 102, 0));
sprite.runAction(action);

staticTiny.uid() ❯ {number}

tiny/core/utils/index.js, line 65

Gets the next unique identifier

Returns:

Type	Description
number	The next unique identifier to use.