How to show materials as an image in UI/Widget?

I want to show materials from a folder in a widget dynamically. The automated list already works fine, but I can’t find out, whats the easiest way, to add the materials as an image to that list.
I’m happy about any help :slight_smile:

you mean…:

Q1.) Showing a List of all Materials inside a Folder as Text/Button Objects in the Widget?

Q2.) Showing the Material itself as Rect/Quad Image inside a Widget?

A2:) Simply open the Brush of your Image and chose a Material as Brush Image.

A1:) Cannot be done automatically… since in a packaged project your Assets are not located as in a Windows/Mac Directory/Explorer…
Soo… there is manual work to do.

  1. Create a new Variable of Type >Material<
  2. Make this Variable an Array
  3. Add Fields to the Array and put in the Materials of your Wishes
  4. Iterate over this array with a Foreach Loop and add filler Widgets inside your List
1 Like


I should have added the image in first place. I already have that dynamic list with the material-elements, which works fine. I just can’t find a way to replace the images with the according material-images.


When I use a material as the image, I get this message “this material does not use the UI material…; Change the Material Domain?”


I clicked on “Change the Material Domain?” - and nothing happens.


I also changed the Material-Domain in the Parent-Material, but still, it doesn’t work and every Material Instance in my map becomes black.

yes… thats because a Material, inside the UMG Widgets, needs to have its Type set to User Interface

And User Interface Materials… are not meant to be used with Meshes ^^"

So… more Handwork… create a second array, according to your Material Array, filled with Texture2Ds…

And when iterating over your materials… check if the foreach index is a valid index in the Texture Array… if yes… SetBrushFromTexture to your Image, the Get Texture of the Array…

Means… you need to manually make Icons of your Materials and drop them in the array.

Making Icons manually is what I want to avoid. That’s why I asked that question ^^ Because users of my project should be able to add further materials, without any effort.
Is there another way to solve this issue?

Not really… Since the not important stuff, like thumbnails, are not packed with the game… So they won’t be available to your users.

You may could reout out a directory of your project for pak files, that your users can creaze with UE by themselves, that needs to contain a MatThumb Image as Texture and the User Material itself… And then, load this Pak at rumtime of the game… So its content gehts available to be used…
But this means, you need to add each MatThumb and each UserMat to your array, too.

@anonymous_user_7fc53b1c , did you discover a way to do it ? I´m in the same page… a lot of materials but need the preview image to help navigate and find them via widget…

I think you could handle this by making a flat UI version of your master material and setting the brush of the image to that material. You could also write a script to pre export render target textures of all of the applicable materials.