一步一步图文介绍SpriteKit使用TexturePacker导出的纹理集Altas

一、为何要使用纹理集?

游戏是一种很耗费资源的应用,特别是在移动设备中的游戏,性能优化是很是重要的web

纹理集是将多张小图合成一张大图,使用纹理集有如下优势:swift

一、减小内存占用,减小磁盘占用;性能优化

二、减小磁盘读取次数,一次性读取一张大图比屡次读取多张小图速度更快
一张大图:打开-读取小图-读取小图-读取小图-关闭;
多张小图:打开-关闭,打开-关闭,打开-关闭,打开-关闭;ide

三、减小OpenGL绘制次数;
OpenGL ES 1.1仅仅可以使用2的n次幂大小的图片(即宽度或者高度是二、四、八、64...)。若是采用小图片OpenGL ES1.1会分配给每一个图片2的n次幂大小的内存空间,即便这张图片达不到这样的宽度和高度也会分配大于此图片的2的n次幂大小的空间。那么运用这种图片集的方式将会减小内存碎片。虽然在Cocos2d-x v2.0后使用了OpenGL ES 2.0,它不会再分配2的几回幂的内存块了,可是减小读取次数和绘制的优点依然存在。性能

二、SpriteKit导入SKTexturePacker的纹理集

上官网 www.codeandweb.com 下载 TexturePacker优化

1_texturePacker下载_www.codeandweb.com.png
1_texturePacker下载_www.codeandweb.com.png

 

没有去除空白边角的原始图片动画


1_texturePacker用法.png
1_texturePacker用法.png

直接把图片文件夹拖入软件左侧的导航栏ui


2_texturePacker用法_拖动.png
2_texturePacker用法_拖动.png

TexturePacker直接剪切图片变生成一张大图spa


3_texturePacker用法_自动剪切.png
3_texturePacker用法_自动剪切.png

点击右下角高级设置 Advanced settings>>code


4_texturePacker用法_高级设置.png
4_texturePacker用法_高级设置.png

选择 Data Format 为SpriteKit,并生成Altas及Swift


5_texturePacker用法_生成Atlas.png
5_texturePacker用法_生成Atlas.png

并生成Altas及Swift 以前能够全选左侧导航栏的全部图片,并点击"Anim preview" 预览动画


6_texturePacker用法_预览动画.png
6_texturePacker用法_预览动画.png

命名Altas文件夹名称及Swift文件名(class为首字母大写)


7_texturePacker用法_生成Atals_swift.png
7_texturePacker用法_生成Atals_swift.png

发布Altas及Swift


8_texturePacker用法_发布.png
8_texturePacker用法_发布.png

发布Altas及Swift 成功 ,查看发布结果


9_texturePacker用法_发布结果.png
9_texturePacker用法_发布结果.png

把Altas及Swift拖进XCode工程内


10_texturePacker用法_导入atlasc及swift文件.png
10_texturePacker用法_导入atlasc及swift文件.png

类JumpRight为class类,首字母应为大写


11_texturePacker用法_swift类Class首写字母为大写.png
11_texturePacker用法_swift类Class首写字母为大写.png

JumpRight内的代码


12_texturePacker用法_JumpRight类.png
12_texturePacker用法_JumpRight类.png

定位SpriteKitNode精灵节点在场景中的位置


13_texturePacker用法_scene定位精灵.png
13_texturePacker用法_scene定位精灵.png

实例化一个类 并代码调用


14_texturePacker用法_代码调用.png
14_texturePacker用法_代码调用.png

SpriteKit 调用TexturePacker 的最终效果


15_texturePacker用法_最终效果.png
15_texturePacker用法_最终效果.png

SpriteKit 调用TexturePacker 的源代码

// // GameScene.swift // BabeKitten // Copyright © 2018 iFiero.com. All rights reserved. // import SpriteKit import GameplayKit class GameScene: SKScene { let catJumpRight = JumpRight() private var cat:SKSpriteNode! private var catJump:SKSpriteNode! override func didMove(to view: SKView) { cat = SKSpriteNode(texture:catJumpRight.jumpRight01()) // 调用图片 cat.position = CGPoint(x: CGFloat(-450), y: CGFloat(-400)) cat.setScale(0.5) cat.zPosition = 1 self.addChild(cat) catJump = SKSpriteNode(texture: catJumpRight.jumpRight01()) // 调用图片1 catJump.position = CGPoint(x: CGFloat(370), y: CGFloat(-400)) catJump.setScale(0.5) catJump.zPosition = 1 self.addChild(catJump) let jumpAction = SKAction.animate(with: catJumpRight.jumpRight(), timePerFrame: TimeInterval(0.05)) let repeatAction = SKAction.repeatForever(jumpAction) catJump.run(repeatAction) } override func update(_ currentTime: TimeInterval) { // Called before each frame is rendered } } 

以上就是使用TexturePacker的全部步聚及源码!

源码传送门:http://www.iFIERO.com/uploads/babeKitten.zip
更多游戏教学:http://www.iFIERO.com

相关文章
相关标签/搜索