Quick cocos2dx-Lua（V3.3R1）学习笔记（4）------创建精灵 菜单，让我们做个最简单的点击菜单显示精灵吧

概述<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">开始第4篇笔记了，感觉前面的几篇写的太少了，Quick cocos2dx 前面加个quick，就是就能让我们快速上手，快速开发......balabala</span> 一,我们来创建第一个精灵 今天我们来创建

<span >开始第4篇笔记了，感觉前面的几篇写的太少了，Quick cocos2dx 前面加个quick，就是就能让我们快速上手，快速开发......balabala</span>

一,我们来创建第一个精灵

今天我们来创建精灵，我们前面显示的外星人图片就是一个精灵。

quick给我们提供了display.newSprite这个函数来创建精灵。

我们进入display.lua中看看对这个函数的介绍说明。

哇，这么长，我怎么知道那个函数定位在哪里（不是有搜索吗，不能Ctrl+F搜索么+_+）。

我们换个方法，不用搜索，毕竟我们想要看看quicks给我们封装了那些函数，我只要看函数列表就行了。sublime text给我们提供的这个快捷键，显示函数列表，让我们快速定位到想要找的函数

<<Ctrl大法之-----Ctrl+R>>

看到了吧，这样我们就能看到quick究竟封装了那些函数给我们，毕竟现在quick的文档不是那么全面，我们可以定位过去，顺便看看函数的实现过程，这样更能使用好函数

下面就是这个函数的参数说明了

创建并返回一个 Sprite 显示对象。-- @function [parent=#display] newSprite-- @param mixed 图像名或SpriteFrame对象-- @param number x-- @param number y-- @param table params-- @return Sprite#Sprite ret (return value: cc.Sprite) -- @see Sprite--[[--创建并返回一个 Sprite 显示对象。display.newSprite() 有三种方式创建显示对象：-   从图片文件创建-   从缓存的图像帧创建-   从 SpriteFrame 对象创建

我们用第一个种方式创建

function MainScene:ctor()	display.newSprite("Hello.png")		:align(display.CENTER,display.cx,display.cy)   --设置锚点和图片坐标点		:addTo(self)								   --将生成的图片精灵加入到MainScene的子节点中end

进入模拟器，运行一下看看效果吧

显示成功。ok，我们用第二种方式创建精灵

第二种方式就是调用pList文件加载到精灵缓存中了，我们把一堆小图像打包成大图，生成pList文件，这个文件包含了我们要用的小图在大图的坐标位置

至于如何打包 请搜索TexturePacker

这个工具使用技巧自行使用谷歌百度大法

function MainScene:ctor()	display.addSpriteFrames("lqfRoleWalk.pList","lqfRoleWalk.png")	display.newSprite("#lqfRightStop.png")		:align(display.CENTER,display.cy)		:addTo(self)		:setScale(3)     --放大3倍end

注意：与上面第一个示例不同的，我们将文件载入精灵缓存中，调用display.newSprite中参数加了一个#符号，这个#符号是告诉这个函数，从缓存中加载精灵的

我们来看显示效果（我承认，因为我图太小了所以放大了3倍）

二，创建菜单 本来我想用MenuItemFont函数的，结果使用后，各种提示nil value，去论坛搜索一下，才知道，quick现在推荐用UIPushbutton来创建菜单的，其实我还是很怀念用文字菜单的，就是没找到使用方法，如果有童鞋知道的，请告知，谢谢
好吧，现在基本没游戏菜单还是用文字的吧，我们就用UIPushbutton这个按钮控件做菜单 用的就cc.ui.UIPushbutton创建按钮
举个栗子来看

function MainScene:ctor()	local button1 = cc.ui.UIPushbutton.new({normal = "button01.png",pressed = "button01pressed.png"})	button1:align(display.CENTER,display.cy)	button1:addTo(self)end

菜单按钮就这么创建，我们先看效果

-- @param table images 各种状态的图片-- @param table options 参数表 其中scale9为是否缩放

状态值:-  normal 正常状态-  pressed 按下状态-  Disabled 无效状态

我们看到上面我们第二个参数中有个scale9的参数，知道的童鞋就知道这是九宫格，不知道的请百度实现原理以及这样做的优点，我们用两段代码对比一下就能看出效果了

function MainScene:ctor()	local button1 = cc.ui.UIPushbutton.new({normal = "button01.png",display.cy)	button1:addTo(self)	button1:setbuttonSize(400,200)end

我们将菜单尺寸放大


阿西吧，真难看啊思密达！！！&……&￥#￥@（我还是会一点思密达语言的） 我们将传一个九宫格参数进去看效果

function MainScene:ctor()	local button1 = cc.ui.UIPushbutton.new({normal = "button01.png",pressed = "button01pressed.png"},{scale9 = true})	button1:align(display.CENTER,200)end

运行效果

很直白的看出不同了吧！
三,进入主题，给按钮加上回调函数，来显示隐藏图片 话说写了这么多才进入主题，我语文老师会不会打我啊！O(∩_∩)O~（语文老师：我和你们说啊，作文，开头就要点题，批卷老师哪有时间给你全看完啊。。。balabala）
按钮我们显示了出来了，现在如何给按钮加上处理函数呢，不然光点击，没效果，玩个球啊

---------------------------------- 注册用户点击监听-- @function [parent=#UIbutton] onbuttonClicked-- @param function callback 监听函数-- @return UIbutton#UIbutton -- end --function UIbutton:onbuttonClicked(callback)    self:addbuttonClickedEventListener(callback)    return selfendfunction UIbutton:addbuttonpressedEventListener(callback)    return self:addEventListener(UIbutton.pressed_EVENT,callback)end-- start ------------------------------------ 注册用户按下监听-- @function [parent=#UIbutton] onbuttonpressed-- @param function callback 监听函数-- @return UIbutton#UIbutton -- end --function UIbutton:onbuttonpressed(callback)    self:addbuttonpressedEventListener(callback)    return selfendfunction UIbutton:addbuttonReleaseEventListener(callback)    return self:addEventListener(UIbutton.RELEASE_EVENT,callback)end-- start ------------------------------------ 注册用户释放监听-- @function [parent=#UIbutton] onbuttonRelease-- @param function callback 监听函数-- @return UIbutton#UIbutton -- end --function UIbutton:onbuttonRelease(callback)    self:addbuttonReleaseEventListener(callback)    return selfendfunction UIbutton:addbuttonStateChangedEventListener(callback)    return self:addEventListener(UIbutton.STATE_CHANGED_EVENT,callback)end

（这不是UIbutton的函数么，不是UIPushbutton的啊 ？）我们在UIPushbutton.lua文件，会看见，其实这个按钮继承了UIbutton了，所以我们能调用UIbutton的函数

function MainScene:ctor()	local button1 = cc.ui.UIPushbutton.new({normal = "button01.png",display.cy)	button1:addTo(self)	button1:setbuttonSize(200,100)	button1:onbuttonClicked(function() 		print("欢迎收看xxxx")		print("大家好，我是小莫")		print("我是小小莫")	end	)end

看到效果了吧，我们开始做点击按钮显示图片了，很简单

function MainScene:ctor()	local sprite = display.newSprite("Hello.png")	sprite:align(display.CENTER,display.cy)  	sprite:addTo(self)									sprite:setVisible(false)	local button1 = cc.ui.UIPushbutton.new({normal = "button01.png",100)	button1:addTo(self)	button1:setbuttonSize(200,100)	button1.showSprIEState_ = 1	button1:setbuttonLabel("normal",cc.ui.UILabel.new({UILabelType = 2,text = "显示图片",size = 30}))	button1:setbuttonLabel("pressed",size = 30}))	button1:onbuttonClicked(function() 		if button1.showSprIEState_ == 1 then			button1.showSprIEState_ = 2			sprite:setVisible(true)			button1:setbuttonLabel("normal",text = "隐藏图片",size = 30}))			button1:setbuttonLabel("pressed",size = 30}))					else			button1.showSprIEState_ = 1			sprite:setVisible(false)			button1:setbuttonLabel("normal",size = 30}))					end			end	)end

总结

以上是内存溢出为你收集整理的Quick cocos2dx-Lua（V3.3R1）学习笔记（4）------创建精灵 菜单，让我们做个最简单的点击菜单显示精灵吧全部内容，希望文章能够帮你解决Quick cocos2dx-Lua（V3.3R1）学习笔记（4）------创建精灵 菜单，让我们做个最简单的点击菜单显示精灵吧所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。