Hello! I tried to do something similar, but even without animation, the code came out hard to read. I'm sure it's not optimal, but at least it works.
Sorry, but my knowledge is hardly enough to create an animation. But I can try if you still need it!
Video:
Code:
local image = dxCreateTexture(":nfsmw/assets/icon.png")
local selected = 1
local count = 5
local elementOffset = 10*scaleValue --padding between items in a menu list
local w, h = 100*scaleValue, 100*scaleValue
local offsetX, offsetY = 550*scaleValue, 50*scaleValue
local x, y = getScreenStartPositionFromBox(w, h, offsetX, offsetY, "right", "bottom")
function render()
local selectedPos = x
for i=1, count do
local difference = i-selected --get the difference between the selected element and the rendered element
local differenceCopy = difference
if difference < 0 then differenceCopy = -difference end
local height = h - (differenceCopy*20*scaleValue) --here we decrease the size as we move away from the selected element
local width = w - (differenceCopy*20*scaleValue)
local offset = 0
local step = 1
if difference < 0 then step = -step end
if difference ~= 0 then
for k=0, difference, step do --the loop calculates the offset using the width for each element. I didn't come up with a formula how to calculate it without a loop
offset = offset + (20*scaleValue)*k
end
end
if difference > 0 then offset = offset - 20*scaleValue*differenceCopy end --if the element is further than the selected one, then we decrease the offset by one point. without it, elements after the selected one have an offset one point less than required
local xImage = selectedPos + (w*difference) - offset + 10*scaleValue*difference --the actual position of the x-axis of the element
local yImage = y+(h-height)/2 --the actual y-axis position of the element
local alpha = 255 - 100*(differenceCopy) --transparency decreases with distance from the selected element
if alpha < 0 then alpha = 0 end
dxDrawImage(xImage, yImage, width, height, image, _, _, tocolor(255,255,255,alpha)) --element rendering
end
end
function startRender()
addEventHandler("onClientRender", root, render)
end
startRender()
function selectElementInMenu(key, keyState, turn) --element select function
if turn == "right" then
if selected >= count then
selected = count
return
end
selected = selected + 1
elseif turn == "left" then
if selected <= 1 then
selected = 1
return
end
selected = selected - 1
end
end
bindKey("o", "up", moveMenu, "right")
bindKey("i", "up", moveMenu, "left")