• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

dpweberza/ImpactJS-Plugins: A collection of plugins for the ImpactJS game engine ...

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称:

dpweberza/ImpactJS-Plugins

开源软件地址:

https://github.com/dpweberza/ImpactJS-Plugins

开源编程语言:

JavaScript 100.0%

开源软件介绍:

ImpactJS - Plugins

NOTICE: Unfortunately I will no longer be maintaining any ImpactJS plugins.

This means no bug fixes, pull request merging or support.

Retro High Score Name Field

Plugin Home

This plugin allows you to add a retro style high score name text field to your game. The player uses his / her keyboard to switch each character to the desired letter of the alphabet to make up his / her name.

Usage is really simple:

Include the entity in your module requires: 'game.entities.retrohighscorenamefield'

In your games init function spawn an instance of the entity by passing in two different fonts and the number of characters you need and then save the object returned so that you can ask it for the name later.

	
	this.retroNameField = ig.game.spawnEntity(EntityRetroHighsSoreNameField, x, y, {
		fontNormal: this.fontNormal,
		fontHighlighted: this.fontHighlighted,
		numberOfChars: 3, // Optional, defaults to 3
		letterSpacing: 20 // Optional, defaults to 20
	});
	

To get the name after saying the Enter key was pressed simply call getName()

	this.retroNameField.getName()

TextureAtlas, TextureAtlasAnimation and TextureAtlasImage

This plugin allows you to create a TextureAtlas from TexturePacker or ShoeBox output and then create animation objects by referring to frames of different sizes by name.

A demo has been included for your convenience, just copy in your impact folder

Usage is really simple:

  1. Add all the images you need to TexturePacker and then publish your atlas image, making sure to select JSON-ARRAY as the data format.
  2. Assign the JSON array from TexturePacker to a varaiable in packed-textures.js
    
    	// This module holds our TexturePacker exported JSON arrays
    	ig.PackedTextures = ig.Class.extend({
    		spacepods: {
    			"frames": [
    			{
    				....
    			}],
    			"meta": {
    			   ....
    			}
    		}
    	});
    	
  3. Include the plugin and your packed texure data in your main.js requires()
    
    	ig.module( 
    		'game.main' 
    	)
    	.requires(
    		'impact.game',
    		'plugins.texture-atlas', // Include the plugin
    		'plugins.packed-textures', // Include the TexturePacker JSON array for the texture atlas
    		'game.entities.pod'
    	)
    	
  4. Create a TextureAtlas object in your main.js
    
    	MyGame = ig.Game.extend({
    		textureAtlas: null,
    		textureImage: new ig.Image('media/space_pods_array.png'),
    		pod: null,
    
    	init: function() {
    		this.textureAtlas = new ig.TextureAtlas(this.textureImage, new ig.PackedTextures().spacepods); // Create the texture atlas
    		this.pod = ig.game.spawnEntity(EntityPod, 0, 0);
    	}
    });
    </code></pre>
    </li>
    <li>Lastly add an animation to your entity using the texture atlas
    <pre><code>
    EntityPod = ig.Entity.extend({
    	init: function( x, y, settings ) {
    		this.parent( x, y, settings );
    		// Entity addTextureAtlasAnim: function(textureAtlas, name, frameTime, sequence, stop, maintainFrameOffset)
    		this.addTextureAtlasAnim( ig.game.textureAtlas, 'idle', 1, ['EscapePodFemale 1.png', 'EscapePodFemale 2.png'], false); // Add texture atlas animation
    	}
    });
    </code></pre>
    </li>
    <li>Or if you just need a static image to your entity using the texture atlas
    <pre><code>
    EntityButton = ig.Entity.extend({
    	backgroundImage: null,
    	init: function( x, y, settings ) {
    		this.parent( x, y, settings );
    		// TextureAtlasImage init: function(textureAtlas, frameName, maintainFrameOffset)
    		this.backgroundImage = new ig.TextureAtlasImage(ig.game.textureAtlas, 'ButtonBg.png', true);
    	}
    });
    </code></pre>
    </li>
        <li>Or if you want to load a font using the texture atlas
    <pre><code>
    this.font = new ig.TextureAtlasFont(ig.game.textureAtlas, '04b03.font.png', true);
    </code></pre>
    </li>
    <li>If you're using ShoeBox which is awesome and free, then you will want to update your export settings
    <pre><code>
    outer: 		{"frames": [\n@loop]\n,"meta": {\n\t"app": "ShoeBox",\n\t"size": {"w":@W,"h":@H}\n}\n}
    format:		\t{\n\t\t"filename": "@id", "rotated": false,"trimmed": true,\n\t\t"frame": {"x":@x,"y":@y,"w":@w,"h":@h},\n\t\t"spriteSourceSize": {"x":@fx,"y":@fy,"w":@fw,"h":@fh},\n\t\t"sourceSize": {"w":@fw,"h":@fh}\n\t},\n
    </code></pre>
    </li>
    



鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap