Criar uma gridlist em dx com a "movimentação" através do scroll do mouse

[ber]

Estou fazendo um sistema de concessionária, e na parte da garagem não achei muito interessante usar aquele método via tabelas que apresenta apenas 1 item por vez e você navega entre eles usando as teclas do teclado ou clicando em uma seta.

Exemplo:

local selecionado = 1
veiculos = {
  {"GTR", 560, 50000},
  {"Skyline", 555, 30000},
}

function render()
  dxDrawText("Veículo: "..veiculos[selecionado][1], ...)
  dxDrawText("Preço: "..veiculos[selecionado][3], ...)
end

function key(tecla)
  if tecla == "arrow_l" then
    selecionado = selecionado -1
  elseif tecla == "arrow_r" then
    selecionado = selecionado +1
  end
end
bindKey("arrow_l", "down", key)
bindKey("arrow_r", "down", key)

Então pensei em usar o método de GridList, mas não faço idéia de como fazê-lo. Imagino que deve ser bem parecido com este método citado acima, porém não sei por onde começar. Se alguém puder me dar um norte, ficarei bem agradecido.

OBS: usar o guiGridList não é uma possibilidade.

[Boechat]

gridlist eu gosto de usar DGS, que é em dx. Dá uma olhada: dgsCreateGridList

[LucasST]

Opcoes = {
    {"1"},
    {"2"},
    {"3"},
    {"4"},
    {"5"},
    {"6"},
}

Pos = {
    {726, 330 , 343, 37},
    {726, 405, 343, 37},
    {726, 480, 343, 37},
    {726, 555, 343, 37},
}



Opcao1 = 1
Opcao2 = 2
Opcao3 = 3
Opcao4 = 4


function Abrir_Painel()
    if isEventHandlerAdded("onClientRender",getRootElement(), DxTest) then
        removeEventHandler("onClientRender",root,DxTest)
        showCursor(false)
    else
        addEventHandler("onClientRender",root,DxTest)
        showCursor(true)
    end
end
bindKey("l","down",Abrir_Painel)

function DxTest()
    dxDrawRectangle(724, 261, 345, 381, tocolor(1, 0, 0, 102), false)
    dxDrawRectangle(725, 258, 344, 63, tocolor(1, 0, 0, 248), false)
    for i, v in ipairs(Pos) do
        dxDrawRectangle(v[1],v[2],v[3],v[4], tocolor(1, 0, 0, 150), false)
    end
    dxDrawText(""..Opcoes[Opcao1][1].."", 900, 341, 1070, 369, tocolor(255, 254, 254, 255), 1.00, "default-bold", "left", "top", false, false, false, false, false)
    dxDrawText(""..Opcoes[Opcao2][1].."", 900, 341 +75, 1070, 369, tocolor(255, 254, 254, 255), 1.00, "default-bold", "left", "top", false, false, false, false, false)
    dxDrawText(""..Opcoes[Opcao3][1].."", 900, 341 +150, 1070, 369, tocolor(255, 254, 254, 255), 1.00, "default-bold", "left", "top", false, false, false, false, false)
    dxDrawText(""..Opcoes[Opcao4][1].."", 900, 341 +225, 1070, 369, tocolor(255, 254, 254, 255), 1.00, "default-bold", "left", "top", false, false, false, false, false)
end


function AbaixarPos(button)
    if isCursorOnElement(724, 261, 345, 381) then
        if button == "mouse_wheel_down" then
            proximaPagina = Opcao4 +1
            if proximaPagina > #Opcoes then
                return
            end
            Opcao1 = Opcao1 +1
            Opcao2 = Opcao2 +1
            Opcao3 = Opcao3 +1
            Opcao4 = Opcao4 +1
        end
    end
end
bindKey("mouse_wheel_down", "down", AbaixarPos)

function AumentarPos(button)
    if isCursorOnElement(724, 261, 345, 381) then
        if button == "mouse_wheel_up" then
            paginaAnterior = Opcao1 -1
            if paginaAnterior == 0 then
                return
            end
            Opcao1 = Opcao1 -1
            Opcao2 = Opcao2 -1
            Opcao3 = Opcao3 -1
            Opcao4 = Opcao4 -1
        end
    end
end
bindKey("mouse_wheel_up","down",AumentarPos)


function isEventHandlerAdded( sEventName, pElementAttachedTo, func )
    if type( sEventName ) == 'string' and isElement( pElementAttachedTo ) and type( func ) == 'function' then
        local aAttachedFunctions = getEventHandlers( sEventName, pElementAttachedTo )
        if type( aAttachedFunctions ) == 'table' and #aAttachedFunctions > 0 then
            for i, v in ipairs( aAttachedFunctions ) do
                if v == func then
                    return true
                end
            end
        end
    end
    return false
end

function isCursorOnElement(x, y, w, h)
	if (not isCursorShowing()) then
		return false
	end
	local mx, my = getCursorPosition()
	local fullx, fully = guiGetScreenSize()
	cursorx, cursory = mx*fullx, my*fully
	if cursorx > x and cursorx < x + w and cursory > y and cursory < y + h then
		return true
	else
		return false
	end
end

Essa foi a primeira vez que utilizei scrollbar manualmente em dx, mais provavelmente a maneiras bem mais fáceis para isso, e como o Boechat falou existem maneiras mais práticas como (GUI, DxGrid e DGS).

[ber]

13 hours ago, LucasST said:

Opcoes = {
    {"1"},
    {"2"},
    {"3"},
    {"4"},
    {"5"},
    {"6"},
}

Pos = {
    {726, 330 , 343, 37},
    {726, 405, 343, 37},
    {726, 480, 343, 37},
    {726, 555, 343, 37},
}



Opcao1 = 1
Opcao2 = 2
Opcao3 = 3
Opcao4 = 4


function Abrir_Painel()
    if isEventHandlerAdded("onClientRender",getRootElement(), DxTest) then
        removeEventHandler("onClientRender",root,DxTest)
        showCursor(false)
    else
        addEventHandler("onClientRender",root,DxTest)
        showCursor(true)
    end
end
bindKey("l","down",Abrir_Painel)

function DxTest()
    dxDrawRectangle(724, 261, 345, 381, tocolor(1, 0, 0, 102), false)
    dxDrawRectangle(725, 258, 344, 63, tocolor(1, 0, 0, 248), false)
    for i, v in ipairs(Pos) do
        dxDrawRectangle(v[1],v[2],v[3],v[4], tocolor(1, 0, 0, 150), false)
    end
    dxDrawText(""..Opcoes[Opcao1][1].."", 900, 341, 1070, 369, tocolor(255, 254, 254, 255), 1.00, "default-bold", "left", "top", false, false, false, false, false)
    dxDrawText(""..Opcoes[Opcao2][1].."", 900, 341 +75, 1070, 369, tocolor(255, 254, 254, 255), 1.00, "default-bold", "left", "top", false, false, false, false, false)
    dxDrawText(""..Opcoes[Opcao3][1].."", 900, 341 +150, 1070, 369, tocolor(255, 254, 254, 255), 1.00, "default-bold", "left", "top", false, false, false, false, false)
    dxDrawText(""..Opcoes[Opcao4][1].."", 900, 341 +225, 1070, 369, tocolor(255, 254, 254, 255), 1.00, "default-bold", "left", "top", false, false, false, false, false)
end


function AbaixarPos(button)
    if isCursorOnElement(724, 261, 345, 381) then
        if button == "mouse_wheel_down" then
            proximaPagina = Opcao4 +1
            if proximaPagina > #Opcoes then
                return
            end
            Opcao1 = Opcao1 +1
            Opcao2 = Opcao2 +1
            Opcao3 = Opcao3 +1
            Opcao4 = Opcao4 +1
        end
    end
end
bindKey("mouse_wheel_down", "down", AbaixarPos)

function AumentarPos(button)
    if isCursorOnElement(724, 261, 345, 381) then
        if button == "mouse_wheel_up" then
            paginaAnterior = Opcao1 -1
            if paginaAnterior == 0 then
                return
            end
            Opcao1 = Opcao1 -1
            Opcao2 = Opcao2 -1
            Opcao3 = Opcao3 -1
            Opcao4 = Opcao4 -1
        end
    end
end
bindKey("mouse_wheel_up","down",AumentarPos)


function isEventHandlerAdded( sEventName, pElementAttachedTo, func )
    if type( sEventName ) == 'string' and isElement( pElementAttachedTo ) and type( func ) == 'function' then
        local aAttachedFunctions = getEventHandlers( sEventName, pElementAttachedTo )
        if type( aAttachedFunctions ) == 'table' and #aAttachedFunctions > 0 then
            for i, v in ipairs( aAttachedFunctions ) do
                if v == func then
                    return true
                end
            end
        end
    end
    return false
end

function isCursorOnElement(x, y, w, h)
	if (not isCursorShowing()) then
		return false
	end
	local mx, my = getCursorPosition()
	local fullx, fully = guiGetScreenSize()
	cursorx, cursory = mx*fullx, my*fully
	if cursorx > x and cursorx < x + w and cursory > y and cursory < y + h then
		return true
	else
		return false
	end
end

Essa foi a primeira vez que utilizei scrollbar manualmente em dx, mais provavelmente a maneiras bem mais fáceis para isso, e como o Boechat falou existem maneiras mais práticas como (GUI, DxGrid e DGS).

Nossa, muito obrigado pelo exemplo, vou dar uma estudada nele. Sobre os códigos "já prontos", o meu servidor é focado para ser o mais leve possível, então evito usar o máximo de exports dentro de onClientRender (DGS) e elementData (dxGrid), por isso a necessidade de criar um próprio gridList.