Imitating scrollbar behaviour

[usernotfound]

I'm trying to implement my own scrollbox (yes I know CE has one but it doesn't match my design) and can do so pretty basically with a few panels, two of which used for panning up/down of course, but how can I replicate it more accurately like having a bar in the middle you can mousedown drag and move around to scroll the main box, if it's possible?

Code: Select all

mainBox    = UDF1.CEPanel1
scrollUp   = UDF1.CEPanel2
scrollDown = UDF1.CEPanel3

scrollUp.OnClick = function()
  scrollDown.Enabled = true
  mainBox.Top = mainBox.Top + 12
  if mainBox.Top > 1 then
    scrollUp.Enabled = false
  end
end

scrollDown.OnClick = function()
  scrollUp.Enabled = true
  mainBox.Top = mainBox.Top - 12
  if mainBox.Top < -55 then
    scrollDown.Enabled = false
  end
end

[corroder]

Just a illustration and this is a stupid way (because i don't know how to do in a smart way)

Code: Select all

local f = createForm()
f.Height = 300
f.Width = 300
object = createPanel(f)
object.Height = 100
object.Width = 100
object.Top = (f.Height - object.Height) / 2
object.Left = (f.Width - object.Width) / 2
object.Color = '0x00DD0FF'

--- assign object position start
markX = object.Top
markY = object.Left
--- define draggable area
limit_l = 1
limit_r = f.Width - 1
limit_t = 1
limit_b = f.Height - 1

function Drag()
 while(markX >= limit_t) do
 markX = markX - 1
 end
-- while(markX <= limit_b) do
-- markX = markX +1
-- end
-- while(markY >= limit_l) do
-- markY = markY - 1
-- end
-- while(markY <= limit_r) do
-- markY = markY + 1
-- end
end

function unDrag()
 object.Top = markX
 object.Left = markY
end

object.onMouseDown = Drag
object.onMouseUp = unDrag
f.show()

Then, need add timer to control move/drag the object, i don't know how to do in lua.

Another illustration using Corona Labs

Code: Select all

-- create object
local myObject = display.newRect( 0, 0, 100, 100 )
myObject:setFillColor( 255 )

-- touch listener function
function myObject:touch( event )
    if event.phase == "began" then
	self.markX = self.x    -- store x location of object
        self.markY = self.y    -- store y location of object
   elseif event.phase == "moved" then
	local x = (event.x - event.xStart) + self.markX
        local y = (event.y - event.yStart) + self.markY
       self.x, self.y = x, y    -- move object based on calculations above
    end
    return true
end

-- make 'myObject' listen for touch events
myObject:addEventListener( "touch", myObject )