cc.sprite如何绘制图片

Posted 2023-05-09

参考技术A cc.sprite用于在Cocos Creator中绘制图片，其步骤如下：

1. 在Cocos Creator的资源管理器中创建一个Sprite（精灵）节点。

2. 选择“精灵”节点，然后在属性检查器中将其“纹理类型”设置为“图片”。

3. 选择“图片”纹理类型后，会出现一个“图片资源”的下拉列表，选择想要绘制的图片资源。

4. 确认“图片资源”已选定后，可以在“属性检查器”中设置图片的宽度、高度、透明度、旋转角度等属性。

5. 在场景中添加“精灵”节点即可看到绘制出的图片。

示例代码：

```
var sprite = node.addComponent(cc.Sprite);
var texture = cc.textureCache.addImage("your_image_path");
sprite.spriteFrame = new cc.SpriteFrame(texture);
```

其中，node为节点对象，"your_image_path"为图片路径。通过将图片路径与SpriteFrame进行绑定，可快速创建并渲染图片。

Cocos2dx-Lua中Sprite精灵的3种创建方法

---1.从图片文件创建
--适合于要显示的这张图片的全部区域或部分区域
function TestTest:CreateSprite1()
    local png = "lobby/lobby.png" --文件路径
    local sprite = cc.Sprite:create(png)
    self:addChild(sprite)

    local sprite2 = cc.Sprite:create(png,cc.rect(0,0,100,100))
    self:addChild(sprite2)
    sprite2:setPosition(display.width/2,display.height/2)
end

---2.从SpriteFrame对象创建
function TestTest:CreateSprite2()
    local resPath = "shared/shared_ui.pvr.ccz"
    local plist = "shared/shared_ui.plist"
    display.addSpriteFrames(plist,resPath)--载入图像到帧缓存

    local spriteFrame = display.newSpriteFrame("shouye_shouye_n.png")
    local sprite0 = cc.Sprite:createWithSpriteFrame(spriteFrame)
    sprite0:setPosition(display.width/2,display.height/2+200)
    self:addChild(sprite0)

    local sprite = cc.Sprite:createWithSpriteFrameName("shouye_shouye_s.png")
    sprite:setPosition(display.width/2,display.height/2+400)
    self:addChild(sprite)

    local fullPath = cc.FileUtils:getInstance():fullPathForFilename(plist)
    local dict = cc.FileUtils:getInstance():getValueMapFromFile(fullPath)
    for imgName,v in pairs(dict.frames) do
        print(imgName,v)
    end
end

---3.从缓存纹理创建
function TestTest:CreateSprite3()
    local resPath = "game/game_ui.pvr.ccz"
    local textureCache = cc.Director:getInstance():getTextureCache()
    local pTexture = textureCache:addImage(resPath)
    --上面两行= local pTexture = display.loadImage(resPath)
    local sprite = cc.Sprite:createWithTexture(pTexture)
    sprite:setPosition(display.width/2+400,display.height/2+400)
    self:addChild(sprite)
end