scroller標籤是跟滾動相關的標籤,bones標籤默認是沒有滾動功能的,如果標籤需要滾動那麼只要放到scroller裏 就可以支持滾動了
下面演示下如何使用scroller
先看效果圖:
在右邊的圖片上滾輪滾動可以顯示圖片未顯示的部分
首先需要把image放到scroller下
<!--垂直滾動顯示圖片-->
<scroller>
<image></image>
<event name ="onWheel" phase ="capturing" module ="test" func ="onWheel"></event>
</scroller>
image放到scroller下 再在lua中初始化就可以支持滾動了,這裏scroller響應滾輪事件是因爲 由於沒有滾動條的緣故所以需要用滾輪事件來演示效果,在早期的版本中scroller是自帶滾輪響應的,但經過考慮後還是去掉了這部分代碼 主要是考慮到scroller嵌套scroller的問題 如果自帶響應需要做一些過濾操作,比較麻煩。
lua中的初始化代碼:
function mod.onCreate(self)
self.image_ = self:getChildAt(0)
self.scroller_ = self:getChildAt(1)
--設置image標籤顯示完整的圖片
local pm_key = "lena"
local pm = bones.resource.getPixmap(pm_key)
local w, h = bones.pixmap.getSize(pm)
print(w)
self.image_:setSize(w, h)
self.image_:setContent(pm_key)
--設置scroller大小 即視口 演示 垂直滾動 水平方向可以和圖片一樣大
self.scroller_:setSize(w, h / 2)
self.scroller_:setLoc(w + 10, 10)
--需要滾動顯示image標籤大小爲圖片大小
local image = self.scroller_:getChildAt(0)
image:setSize(w, h)
image:setContent(pm_key)
--scroller垂直方向的滾動範圍是0-h/2 設置成image的高 scroller會自動計算滾動範圍
self.scroller_:setScrollInfo(h, false)
self.scroller_.image_ = self.scroller_:getChildAt(0)
end
仔細看看代碼 會發現 雖然說是滾動image,但image實際上並未滾動,而是scroller以視口的模式顯示了image的一部分
接下來還要加上滾動事件的響應來演示效果
--滾輪事件監聽放到scroller上
function mod.onWheel(self, e)
--處理滾輪事件 滾動scroller標籤
local target = e:target()
if target == self.image_ then
--滾輪值通常是120的倍數
local delta
--計算滾動的像素 水平滾動
if e:dx() ~= 0 then
delta = -e:dx() / 120 * 10;
self:setScrollPos(self:getScrollPos(true) + delta, true)
end
--垂直滾動
if e:dy() ~= 0 then
delta = -e:dy() / 120 * 10;
self:setScrollPos(self:getScrollPos(false) + delta, false)
end
end
end
到此 就可以試試在右邊的圖片上滾動滾輪來看效果了。
到目前爲止lua中的方法名和參數都與C++接口保持一致,我覺得註釋應該還算詳細,比如scroller文檔在bones.h中BonesScroller接口裏,可以看下setScrollInfo和
setScrollPos再對應上面lua腳本,應該還是很容易明白代碼意思:
/*!設置子控件可顯示的尺寸
@param[in] total 子控件可顯示的尺寸
@param[in] horizontal true則爲水平滾動屬性 false爲垂直滾動屬性
@note scroller的size作爲視口的尺寸 total 與視口的差值即爲最大滾動範圍
*/
virtual void setScrollInfo(BonesScalar total, bool horizontal) = 0;
/*!設置當前滾動值
@param[in] cur 當前滾動值
@param[in] horizontal true則爲水平滾動屬性 false爲垂直滾動屬性
*/
virtual void setScrollPos(BonesScalar cur, bool horizontal) = 0;
本篇完整代碼下載:
http://blog.csdn.net/dalixux/article/details/48830721