[Help] DrawSprite Custom Image?

FiveM Resource Development & Modding Discussion
1

Building inventory without using NUI and attempting to draw images at the moment.

function testSprite()
    local txd = CreateRuntimeTxd('textures')
    local tx = CreateRuntimeTextureFromImage(txd, 'water', 'waterbottle.png')
    DrawSprite("textures", "water", 0.5, 0.5, 0.1, 0.1, 0, 0, 0, 0, 120)
end

This is my current code. The .lua is in a folder and inside is another folder named “textures” where watterbottle.png is located. I presume I’m not understanding the correct way to go to the file path. Any ideas?

2

The best way to do that is to create a YTD file and stream it from your stream/ folder.
What you are trying to achieve aims to replace textures in the world like billboards, floor texture etc… It is better to stream and add your own textures

2 Likes
3

My question then would be, how am I meant to pull those textures out on client side and display them? DrawSprite could work great if it were actually showing the image. The plus side to Draw Sprite is it also creates a box behind it and is basically exactly what I was going for.

1 Like
4

You can still use DrawSprite with your custom textures, just don’t forget to load it with REQUEST_STREAMED_TEXTURE_DICT

5

So, to clarify for future reference:
There is no way to pull an image from a folder in the folder your .lua is in FiveM
The picture cannot be a .png, it must be a .YDT

I am still curious how the file path will look like with REQUEST_STREAMED_TEXTURE_DICT.
RequestStreamedTextureDict(assets) ? It can’t be this simple.

6

With NUI it is.
Might be possible to use the CreateRuntime stuff but I would definitively not recommend it for something like a menu as it is relatively more demanding than a single DrawSprite. Yeah just make your own YTD

7

And calling to the assets would be: RequestStreamedTextureDict(stream)? I’m struggling to find how I need to define the file path here, there’s no way it’s this easy. It’s in my resources folder, then assets, then stream. I presume it would look something like @resources/assets/stream?

8

The file path is not relevant here. Just name your custom YTD with a unique name like ‘inventory_menu’ and then request, draw this texture from the YTD inventory_menu. Finally with DrawSprite use inventory_menu as the textureDict and your texture name. (YTD can include multiple textures)

1 Like
9

I’ll give that a shot, I appreciate the info.

If anyone does have a way to use the .pngs I would like to know how to correctly use the CreateRunTime natives if anyone has any insight, just for reference.

10 
function testSprite()
    local txtd= RequestStreamedTextureDict("inventory_menu.ytd")
    DrawSprite(txtd, txtd, 0.5, 0.5, 0.5, 0.5, 0, 0, 0, 0, 120)
end

Citizen.CreateThread(function()
    while true do
        Citizen.Wait(0)
        testSprite()
    end
end)

This is the code I’m attempting to use to pull the .ytd.

Below is the file structure:
image

image

Below is the fxmanifest:
image

Below is the server.cfg (tried to get inventory_menu in two different ways):
image

Below is what I see in game:

image
image1554×837 253 KB

I still am not able to pull the file, is there something that I’m still missing?

11

Hello, I just found this github repo that do what you ask,

load the ressource and use the export like this

local txd = CreateRuntimeTxd("example_txd")
local rt = CreateRuntimeTexture(txd, "cool_stuff", 350, 150)
exports['image-to-txn']:AddImage("https://via.placeholder.com/350x150", rt, function()
  while true do
    Wait(0)
    DrawSprite("example_txd", "cool_stuff", 0.5, 0.5, 0.5, 0.5, 0.0, 255, 255, 255, 255)
  end
end)
2 Likes