dxDrawText get the value of the clicked text?

[thund3rbird23]

Can I get the value of the clicked text somehow with dxDrawText? I mean I have a table with values: "Test 1", "Test 2", "Test 3" and if I click to the "Give" text for ex.: next to "Test 2" text then output "Test 2" in the chatbox and so on...

Or I must use GuiGridListGetSelectedItem?

I draw the panel, this will add 3 row with the items table and add "Give" buttons next to them.

function drawPanel()
local items = {{"Test"},{"Test1"},{"Test2"},}
	          for i = currentCell + 1, maxRows + currentCell do
        	local value = items[i]
            local key = i - currentCell - 1
        	if value ~= nil then
        		dxDrawRectangle(screenW * 0.7499, screenH * 0.3269+((key)*27), screenW * 0.2380, screenH * 0.0250, tocolor(1, 2, 3, 90), false)
        		dxDrawText(value[1], screenW * 0.759, screenH * 0.3269+(key*54), screenW * 0.2380, screenH * 0.3519, tocolor(255, 255, 255, 255), 1.00, "default-bold", "left", "center", false, false, false, false, false)
			dxDrawText("Give", screenW * 0.920, screenH * 0.3269+(key*54), screenW * 0.2380, screenH * 0.3519, tocolor(255, 255, 255 ,255), 1.00, "default-bold", "left", "center", false, false, false, false, false)
    		end
		end
end
addEventHandler("onClientRender", root, drawPanel ) 

This is handle the click on the Give button:

addEventHandler("onClientClick", root,
function(button, state)

		if isCursorOnElement(screenW * 0.920, screenH * 0.3269, screenW * 0.2380, screenH * 0.3519) then
			if button == "left" and state == "down" then
				outputChatBox("Clicked")
			end
		end
end)

This is working but I want to output which value I clicked on.

[thund3rbird23]

@IIYAMA Can you help please if you understand what I want to do?

[Ceeser]

There are a few things unknown to us, so its hard to help you at all.

For example, how does currentCell gets defined / clicked / selected?
Why are you looping through in a numeric for-loop and (as it seems) above the maximum => "maxRows + currentCell"?

If you used only snippets, better post the complete code, at least with all important stuff thats needed for what you wanna do.

[IIYAMA]

30 minutes ago, thund3rbird23 said:

@IIYAMA Can you help please if you understand what I want to do?

 

You need this part of you previous code:

local items = {{"Test"},{"Test1"},{"Test2"},}
for i = currentCell + 1, maxRows + currentCell do
	local value = items[i]
	local key = i - currentCell - 1
	if value ~= nil then
    	-- check cursor here
	end
end

 

You need the position of the rectangle:

dxDrawRectangle ( float startX, float startY, float width, float height )

screenW * 0.7499, screenH * 0.3269+((key)*27), screenW * 0.2380, screenH * 0.025

Combine that with this useful function (don't forget to copy the function from that wiki page):

https://wiki.multitheftauto.com/wiki/IsMouseInPosition

isMouseInPosition ( int x, int y, int width, int height )

 

And you need a break to stop the loop:

--for i=1, 100 do
	--if something then
  		--outputChatBox("found")
		break
	--end
--end

 

Can you build it with all the bricks from above?

 

 

 

 

 

 

 

Edited August 12, 2020 by IIYAMA

[thund3rbird23]

13 minutes ago, IIYAMA said:

 

You need this part of you previous code:

local items = {{"Test"},{"Test1"},{"Test2"},}
for i = currentCell + 1, maxRows + currentCell do
	local value = items[i]
	local key = i - currentCell - 1
	if value ~= nil then
    	-- check cursor here
	end
end

 

You need the math of the rectangle:

screenW * 0.7499, screenH * 0.3269+((key)*27), screenW * 0.2380, screenH * 0.025

dxDrawRectangle ( float startX, float startY, float width, float height )

Combine that with this useful function (don't forget to copy the function from that wiki page):

https://wiki.multitheftauto.com/wiki/IsMouseInPosition

isMouseInPosition ( int x, int y, int width, int height )

 

And you need a break to stop the loop:

--for i=1, 100 do
	--if something then
  		--outputChatBox("found")
		break
	--end
--end

 

Can you build it with all the bricks from above?

 

 

 

 

 

 

 

Ummm I can do that if I click on the dxRectangle or on the dxDraw then output something. But I want to output the value from the items table.

Assume that I do a button next to each items with dxRectangle  (test, test1, test2) and if I click on that button then output the value from the items table.

So if I click next to test2 button then output test2 from items table... and so on but I can't determine what will be in the items table because that's will be random numbers, these just examples for more clear understanding...

Take a look at this I want to do almost the same but without GuiCreateGridList and guiGridListGetSelectedItem:

Edited August 12, 2020 by thund3rbird23

[IIYAMA]

9 minutes ago, thund3rbird23 said:

So if I click next to test2 button then output test2 from items table... and so on but I can't determine what will be in the items table because that's will be random numbers, these just examples for more clear understanding...

Do first all the steps from above.

 

---

 

Then structure your table and sub-tables like this:

local items = {
  {
    label = "Test1",
    value = 1
  },
  {
    label = "Test2",
    value = 2
  },
  {
    label = "Test3",
    value = 3
  }
}

local item = items[1]
iprint("The label is:", item.label, " and the value is: ", item.value)

 

Main table:

local items = {
  {
    label = "Test1",
    value = 1
  },
  {
    label = "Test2",
    value = 2
  },
  {
    label = "Test3",
    value = 3
  }
}

 

Sub-tables:

local items = {
  {
    label = "Test1",
    value = 1
  },
  {
    label = "Test2",
    value = 2
  },
  {
    label = "Test3",
    value = 3
  }
}

 

 

 

 

Edited August 12, 2020 by IIYAMA

[thund3rbird23]

3 minutes ago, IIYAMA said:

Do first all the steps from above.

 

---

 

Then structure your table and sub-tables like this:

local items = {
  {
    label = "Test1",
    value = 1
  },
  {
    label = "Test2",
    value = 2
  },
  {
    label = "Test3",
    value = 3
  }
}

local item = items[1]
iprint("The label is:", item.label, " and the value is: ", item.value)

 

Main table:

local items = {
  {
    label = "Test1",
    value = 1
  },
  {
    label = "Test2",
    value = 2
  },
  {
    label = "Test3",
    value = 3
  }
}

 

Sub-tables:

local items = {
  {
    label = "Test1",
    value = 1
  },
  {
    label = "Test2",
    value = 2
  },
  {
    label = "Test3",
    value = 3
  }
}

 

 

 

 

Oh, I understand but what about if I can't determine what will be the label's value?

I want to do this for the previously asked topic which you solved for me.

I getting the weaponmodels from mysql then save with setElementData and getting with GetElementData

local items = getElementData(localPlayer, "weaponmodel")

-- output --

{{123}, {321}, {231}, {312}, {132}}

How can I refer to these random values if I click to the button next to any of them without knowing what they will be?

 

[IIYAMA]

2 hours ago, thund3rbird23 said:

How can I refer to these random values if I click to the button next to any of them without knowing what they will be?

Ask your self first: "how do I refer to any of these values?"

Inspect your table:

iprint(items )

Until you are able to get the first and the second value.

 

---

 

After that (tell me when you are ready) we are going to take the easy route: guiCreateGridList. Because the concept of "dx items" seems to be a too high level for now.

 

 

[thund3rbird23]

I'm trying to make with guiCreateGridList but I have some problems.

1) I can't select the item on gridlist and can't click to the button
2) Only one item are shown instead of 5 items or more depends on how much weapons the player have
3) My FPS is dropping to 2 if the gridlist are shown

I figured out the 1) problem... it just because I display the gridlist with onClientRender event , if I do the same with onResourceStart event then I can select the item, etc... but I want to display only if the openPanel is true

function drawPanel()
if openPanel == true then
        local items = getElementData(localPlayer, "weaponmodel")
	    gridlist = guiCreateGridList(screenW - 177 - 10, (screenH - 177) / 2, 177, 177, false)
        guiGridListAddColumn(gridlist, "Weapons", 0.9)
		for k, v in ipairs(items) do
        guiGridListAddRow(gridlist)
        guiGridListSetItemText(gridlist, 0, 1, v[1], false, false)
		button = guiCreateButton(0.62, 0.82, 0.32, 0.12, "Sell", true, gridlist) 
        end
	
end
end
addEventHandler("onClientRender", root, drawPanel )

 

I'm trying to make with guiCreateGridList but I have some problems.

1) I can't select the item on gridlist and can't click to the button
2) Only one item are shown instead of 5 items or more depends on how much weapons the player have

If I debug the items variable then I got table with the items like this:

{{"123"},{"231"},{"321"},{"132"},{"213"}}

but the gridlist only shows the last (213) item...

3) My FPS is dropping to 2 if the gridlist are shown

 

I figured out the 1) problem... it just because I display the gridlist with onClientRender event , if I do the same with onResourceStart event then I can select the item, etc... but I want to display only if the openPanel is true

function drawPanel()
if openPanel == true then
        local items = getElementData(localPlayer, "weaponmodel")
	    gridlist = guiCreateGridList(screenW - 177 - 10, (screenH - 177) / 2, 177, 177, false)
        guiGridListAddColumn(gridlist, "Weapons", 0.9)
		for k, v in ipairs(items) do
        guiGridListAddRow(gridlist)
        guiGridListSetItemText(gridlist, 0, 1, v[1], false, false)
		button = guiCreateButton(0.62, 0.82, 0.32, 0.12, "Sell", true, gridlist) 
        end
	
end
end
addEventHandler("onClientRender", root, drawPanel )

 

Edited August 17, 2020 by thund3rbird23

[IIYAMA]

7 hours ago, thund3rbird23 said:

I figured out the 1) problem... it just because I display the gridlist with onClientRender event , if I do the same with onResourceStart event then I can select the item, etc... but I want to display only if the openPanel is true

Yes, when you use onClientRender, it will create the same GUI every frame. So if you have 60 fps, you will create 60 GUI's per second.

The big difference between DX and GUI? DX is just an effect drawn on the te screen(every frame), while a GUI is actually a ready to use user interface.

 

Use the following function on your GUI element(s).

https://wiki.multitheftauto.com/wiki/GuiSetVisible

To show and hide them.

 

A variable state "openPanel", can be handy for the current state, but a variable value change will not be able to automatically close or open the gridlist. The function call 'guiSetVisible' is required.

[thund3rbird23]

4 hours ago, IIYAMA said:

Yes, when you use onClientRender, it will create the same GUI every frame. So if you have 60 fps, you will create 60 GUI's per second.

The big difference between DX and GUI? DX is just an effect drawn on the te screen(every frame), while a GUI is actually a ready to use user interface.

 

Use the following function on your GUI element(s).

https://wiki.multitheftauto.com/wiki/GuiSetVisible

To show and hide them.

 

A variable state "openPanel", can be handy for the current state, but a variable value change will not be able to automatically close or open the gridlist. The function call 'guiSetVisible' is required.

Thank you. Everything works fine now but with the GUI elements... that's a little bit ugly.

I just want to know how can I do this without the GUI gridlist? This was my main problem when I opened the thread

local weapons = guiGridListGetItemText ( weapgridlist, guiGridListGetSelectedItem ( weapgridlist ), 1 )

 

[IIYAMA]

52 minutes ago, thund3rbird23 said:

I just want to know how can I do this without the GUI gridlist? This was my main problem when I opened the thread

I already gave you the components that are in my first post. I don't think I can explain it any better, unless you ask specific questions.

DX is an (after) effect, not an element, therefore those rectangle/text things on your screen are nothing but "AIR". Which means that if you want to check if you clicked on them, you need to check if the cursor position is within the position of the things you are about to draw.

 

If the concept of DX-UI is unclear, how about you try something that shows DX and but works as a GUI? There is also a whole wiki . @thisdp did a very good job including all features from the original GUI and more.

 

 

Edited August 18, 2020 by IIYAMA

[thund3rbird23]

3 hours ago, IIYAMA said:

I already gave you the components that are in my first post. I don't think I can explain it any better, unless you ask specific questions.

DX is an (after) effect, not an element, therefore those rectangle/text things on your screen are nothing but "AIR". Which means that if you want to check if you clicked on them, you need to check if the cursor position is within the position of the things you are about to draw.

 

If the concept of DX-UI is unclear, how about you try something that shows DX and but works as a GUI? There is also a whole wiki . @thisdp did a very good job including all features from the original GUI and more.

 

 

Thanks. I trying with thisdp's DX GUI System but for some reason it's display "clicked" multiple times in chatbox when I click to the "Sell" button... What do I doing wrong?

I need to check the button left or right & the state of the button?

function test()
        window = DGS:dgsCreateWindow(screenW - 278 - 10, (screenH - 237) / 2, 278, 237,"Your weapon list",false)
        gridlist = DGS:dgsCreateGridList (0.04, 0.11, 0.92, 0.78, true, window )
        column = DGS:dgsGridListAddColumn(gridlist, "Weapons", 0.5)
        for k, v in ipairs(items) do
        row = DGS:dgsGridListAddRow(gridlist, v[1]) 
		DGS:dgsGridListSetItemText ( gridlist, row, column, v[1] )
        end
		button = DGS:dgsCreateButton(0.62, 0.88, 0.34, 0.08, "Sell", true, gridlist)
		addEventHandler ( "onDgsMouseClick", button, BttnClick, false )
		
end
addEventHandler ( "onClientResourceStart", resourceRoot, test )

function BttnClick()
		outputChatBox("clicked")
end

 

Edited August 18, 2020 by thund3rbird23

[IIYAMA]

1 minute ago, thund3rbird23 said:

What do I doing wrong?

There is an up and down state. (press/release)

https://wiki.multitheftauto.com/wiki/OnDgsMouseClick

function BttnClick(button, state)
	-- button: left/right/middle
	-- state: up/down
	if button == "left" and state == "down" then
    
	end
end

 

[thund3rbird23]

5 minutes ago, IIYAMA said:

There is an up and down state. (press/release)

https://wiki.multitheftauto.com/wiki/OnDgsMouseClick

function BttnClick(button, state)
	-- button: left/right/middle
	-- state: up/down
	if button == "left" and state == "down" then
    
	end
end

 

Yes.. I wrote the question first then thought about that ... sorry  and thank you. You helped me a lot