Dx Scroll and Text [HELP]

[FlyingSpoon]

local x, y = guiGetScreenSize() 
local myRenderTarget = dxCreateRenderTarget(381, 419, true) 
local offset = 0 
  
showCursor(true)
  
function lobby() 
  
  
    if myRenderTarget then   
        dxSetRenderTarget( myRenderTarget, true )  
        dxSetRenderTarget() 
     
        dxDrawRectangle(432 , 134 , 381, 419, tocolor(0, 0, 0, 164), false) --- DX Background 

		dxDrawImage(432, 134, 381, 419, myRenderTarget, 0, 0, 0, tocolor(255, 255, 255, 255), false) 
         
		dxDrawText("THIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT\nTHIS IS SOME RANDOM TEXT", 443, 149+offset, 803, 537, tocolor(255, 255, 255, 255), 1.00, "default", "left", "top", false, false, false, false, false)      
        dxDrawRectangle(878, 70, 22, 530, tocolor(68, 68, 68, 255), false) -- DX Scroll
         
         
    end  
end 
addEventHandler("onClientRender", root, lobby) 
  
  
function scrollUP() 
offset = offset - 5
end 
  
function scrollDOWN() 
offset = offset + 5 
end 
bindKey("mouse_wheel_up","down",scrollUP) 
bindKey("mouse_wheel_down","down",scrollDOWN) 

How can I make it so, it doesn't just scroll out of the screen and scrolls only until the end of the 'DX Background' and disappears, and how do I make the 'DX Scroll' so the person can click on the rectangle and scroll up and down using or using the scroll on their mouse.

[Addlibs]

You need to render the text and stuff inside the render target and then draw the render target (dxDrawImage). Scrolling should move the individual parts in the render target, not the whole render target.

[FlyingSpoon]

Not sure how I would do that, first time using render targets.

[Addlibs]

Everything you want to be drawn in your render target instead of the screen should be placed between 

dxSetRenderTarget(myRenderTarget, true) --render to myRenderTarget (2nd argument: clear the render target before setting it, if you're drawing per frame you'll usually want this set to true)
-- your DX draws such as text
dxSetRenderTarget() --render to no rendertarget, i.e. to the screen
dxDrawImage(..., myRenderTarget, ...) --draw the render target on the screen

(Remember that you must imagine the render target as a different screen with different screen size, you no longer use dxGetScreenSize but rather getMaterialSize of the render target)

Edited February 23, 2017 by MrTasty

[FlyingSpoon]

Can I have an example maybe? I don't get the dxDrawImage part, I did that on my own code, or did I do it wrong?

[Addlibs]

dxDrawImage is just to draw that rendertarget as if were an image.

For example, you have a render target of a size of 600 by 400 pixels. You draw a line across (0,300) to (400,300), which is a straight line across the middle of the screen height from 0 to 400 on the horizontal axis. You can then draw that rendertarget as if it was an image onto the screen position of (screenWidth/4, screenHeight/2), any size (keep in original 6:4 ratio to avoid stretching).

[FlyingSpoon]

How would I make it so, if the text goes out of the render target it disappears, like while scrolling up and down.

[Addlibs]

When drawing to rendertarget, whatever falls outside of its size does not get drawn. This means you can draw text 20px-high text at Y position 10px lower than the render target's height, the bottom part will be cut off, because it's outside the render target. Think of it as if it was just an image on which you can draw with dxDraw* stuff.