Display a dds image in the UI

Anna Lee · 08/30/23, 11:57 AM

Hi. I’m trying to get a dds image into the ingame UI, but I can’t get it to work. Tried multiple versions of lua. and xml. codes.

At the end I ended up with this lua (see attachment):

Lua Code:

-- Create a custom addon
local addonName = "MyAddon"
local addon = {}
 
-- Event handler for addon initialization
function addon.OnAddOnLoaded(event, loadedAddonName)
    if loadedAddonName == addonName then
        
        addon.InitializeUI()
    end
end
 
-- Function to initialize the UI
function addon.InitializeUI()
    -- Create a control for the image
    local imageControl = WINDOW_MANAGER:CreateControl("MyAddonImage", GuiRoot, CT_TEXTURE)
    imageControl:SetTexture("path/to/the/.dds")
    imageControl:SetDimensions(200, 200)
    imageControl:SetAnchor(CENTER, GuiRoot, CENTER, 0, 0)
    imageControl:SetHidden(false)
end
 
-- Register the event handler
EVENT_MANAGER:RegisterForEvent(addonName, EVENT_ADD_ON_LOADED, addon.OnAddOnLoaded)

txt file:

Lua Code:

## Title: MyAddon
## APIVersion: 101036
## Author: @MyAddon
MyAddon.lua

I get no error messages with this, but the image isn’t showing either.
Is there something I’m missing out or is the code itself straight up completely false?

KLISK · 08/30/23, 12:33 PM

Everything seems to be correct. Try restarting the client, textures are not loaded on the fly.
According to a good ZoS, it would be necessary to add color filling, textures that are not loaded. But apparently they are satisfied with just emptiness.

Sharlikran · 08/30/23, 01:35 PM

imageControl:SetTexture("path/to/the/.dds")

Change that to an official game file. See if you can get an official game file to show first.

Anna Lee · 08/30/23, 04:54 PM

Added another line to the code for the color filling and changed the imageControl:SetTexture(“”) but still without success. Not sure what else I could try at this point.

Lua Code:

function addon.InitializeUI()
    -- Create a control for the image
    local imageControl = WINDOW_MANAGER:CreateControl("MyAddonImage", GuiRoot, CT_TEXTURE)
    imageControl:SetTexture("/esoui/art/ava/ava_allianceflag_neutral.dds")
    imageControl:SetDimensions(100, 100)
    imageControl:SetAnchor(CENTER, GuiRoot, CENTER, 0, 0)
    imageControl:SetHidden(false)
    imageControl:SetColor(1, 0, 0, 0.5)

Calamath · 08/30/23, 06:07 PM

Originally Posted by Anna Lee

Added another line to the code for the color filling and changed the imageControl:SetTexture(“”) but still without success. Not sure what else I could try at this point.

I'm writing this after giving up coffee before the start of work.
I think you have to create a top level control and make the texture control its child.

**Baertram** · 08/31/23, 05:18 AM

Originally Posted by Calamath

I'm writing this after giving up coffee before the start of work.
I think you have to create a top level control and make the texture control its child.

Yes, I'm pretty sure this needs to be done here.
Without a TLC the controls do not properly show, at least not at the GuiRoot!

But it would show if you do not anchor it to GuiRoot but some other existing control of the UI, like Inventory or similar.

So use

Lua Code:

CreateTopLevelWindow("YourUniqueAddonNameTLC")

It will automatically anchor to the GuiRoot.

And then anchor your texture control to YourUniqueAddonNameTLC, instead of GuiRoot
Remember to use YourUniqueAddonNameTLC:SetHidden(false) too, if needed.
The hidden state of the child controls, like your texture, will reflect the same state as the TLC (if you do not manually change it).

btw: Don't forget, in your function addon.OnAddOnLoaded(event, loadedAddonName), to unregister the event EVENT_ADD_ON_LOADED again once your addon was loaded! Else that function addon.OnAddOnLoaded will be run again and again for each next addon loaded, where there is no need to do so anymore (as that event will be executed for each addon loaded once -> that's why you compare the addonName with the parameter to detect YOUR CURRENT addon loading).

And the current APIVersion is 101039, not 101036.
It does nothing else than show you ingame "You got outdated addons" warning once after a patch, and at the addon manager it will show as outdated then if your txt (manifest) APIVersion does not match the current version.
But you should keep it updated if you create new addons or update your addons ;-)

You can get the current API version by API function GetAPIVersion() ingame.
You can use a tool addon like "merTorchbug updated" to run such functions via /tb GetAPIVersion() and see the result in chat.
torchbug is also greatt o inspect cotrols below the mouse cursor via /tbm and see it's anchors, width, height -> and even change that in the torchbug UI.
zgoo would be another tool one could use to inspect those variables and controls.

Else you would need to run it manually via /script command and to see the output use d() debug function around it like this:
/script d(GetAPIVersion())

Anna Lee · 08/31/23, 08:17 AM

Thanks everyone for replying and helping out. The TopLevelControl was the missing part for it to function.

I do have one more question about the unregister event part once the addon was loaded.

I thought I had to write it like this:

Lua Code:

function addon.OnAddOnLoaded(event, loadedAddonName)
    if loadedAddonName == addonName then
        addon.InitializeUI()
    end
    EVENT_MANAGER:UnregisterForEvent(addonName, EVENT_ADD_ON_LOADED)
end

but it’s no longer working if I leave it like this.

If I put it before the end, it’s working again but not sure if the line even has a functionality on this position.

Lua Code:

function addon.OnAddOnLoaded(event, loadedAddonName)
    if loadedAddonName == addonName then
        addon.InitializeUI()
        EVENT_MANAGER:UnregisterForEvent(addonName, EVENT_ADD_ON_LOADED)
    end
end

**Baertram** · 08/31/23, 08:22 AM

Yes correct inside the if end!
Else it would be unregistered at first ever called addon (must not be yours e.g.) and your code would never be executed properly.

EVENT_ADD_ON_LOADED will be run once for EACH addon AND library in your live/AddOns folder.
Means it will be called for e.g LibAddonMenu-2.0, LibWhatever, AddonName1, AddonName2, YourAddonNameHere, AddonName3, AddonName4 etc.
-> So to say for each txt (manifest) file that is found within live/AddOns and up to 3 subfolders depth!

That's why you need to compare the addonName with the loadedAddonName parameter of that callback function of the event, else you would load your addons code too early (e.g. you would load your code as the LibAddonMenu-2.0 get's curently loaded and at that time some needed dependencies are missing or anoher lua/XML file of your addon was not properly loaded yet etc.)
or, like in your example, unregister your EVENT_ADD_ON_LOADED again too early before your addon was processed (addon.InitializeUI() was never executed).

If your addon was found, by comparing the loadedAddonName, you can safely unregister that event's callback so the code is not executed for AddonName3 and AddonName4 etc. anymore.

Keeping the event registered would only make sense if you want to list all loaded addons (like LibDebugLogger does) or if you want to check, by the addon name, if any other addon was loaded -> But there often exist easier ways like adding an ## OptionalDependsOn: LibAddonMenu-2.0 or ## DependsOn: OtherAddonNameHere so that these addons/libraries get loaded BEFORE your addon, in the load order of the txt files.

Or you can check for any global variable like if LibAddonMenu2 then --LibAddonMenu2 was loaded end

More details about load order, txt (manifest) files, dependencies etc. can be read here:
https://wiki.esoui.com/Addon_manifest_(.txt)_format
https://wiki.esoui.com/Libraries

Or join us at the chat:
https://app.gitter.im/#/room/#esoui_esoui:gitter.im

Anna Lee · 08/31/23, 08:49 AM

Thank you very much for the quick response and explaining everything in detail. I really appreciate it.

I’m new to programming so I'm having a bit of a hard time right now understanding all the stuff

**Baertram** · 08/31/23, 09:33 AM

I cannot help with "new to programming" (I bet there are several online videos and tutorials available at UDEMY, Youtube etc.)
but for "new to eso addons" I had summarized stuff here:
https://www.esoui.com/forums/showthread.php?t=9867

There also exist a few videos for new addon devs, how eso addons are created:
https://www.esoui.com/forums/showthread.php?t=10456
https://www.esoui.com/forums/showthread.php?t=10469