quick-cocos2d-x教程10:實現血條效果。

血條是常見功能，可以通過一個血條背景和一個不斷改變的血條寬度，來實現少血。

在MainScence.lua中，先改代碼：

function MainScene:ctor()
    local bg = display.newSprite("bg01.jpg")
    bg:setPosition(display.cx, display.cy)
    self:addChild(bg)
    --
    local barBg = display.newSprite("barBg.png")
    barBg:setPosition(display.cx, display.cy)
    self:addChild(barBg)
    --血條的原始尺寸，是185*100，可以定時改寬度185的值
    local barBlood = display.newScale9Sprite("barBlood.png",0,0,CCSize(185, 10))
    barBlood:setPosition(display.cx, display.cy)
    self:addChild(barBlood)
end

• bg01.jpg是背景圖，上個例子已經寫了
• barBg.jpg血條的背景圖，主要是美觀好看。
• barBlood是綠色的血條，注意他是九宮格的圖，就是可以拉昇不變形的
• 我們看下display.lua中的例子：
• ~~~ lua
  
  -- 創建一個 Scale9 圖像，並拉伸到 400, 300 點大小
  local sprite = display.newScale9Sprite("Box.png", 0, 0, CCSize(400, 300))
  
  ~~~
  
  @param string filename 圖像名
  @param integer x
  @param integer y
  @param CCSize size
  
  @return CCSprite9Scale CCSprite9Scale顯示對象
  
  ]]
  function display.newScale9Sprite(filename, x, y, size)
      return display.newSprite(filename, x, y, {class = CCScale9Sprite, size = size})
  end
  
  
• 我們可以把CCSize(185, 10)寬度調整，比如改成CCSize(90, 10)，然後每次被擊中，就動態改這個值，就實現血條功能。
• 注意，如果這個血條原始圖片過長，但你壓縮成一半的尺寸，會出現不縮小的情況。如果我們把這個血條的尺寸改成寬1的像素，那拉伸和縮小就沒有問題。