User Interface Kit

Hello,
As I said just a bit after the quote, we found that everyone was having different questions and we couldn’t make a video to address all of them. Actually most of the questions were of general nature (about Unreal Engine). Videos for these questions, like simple project migration instructions, exist already (and are better than anything we could have done…)
Again, as previously mentioned, migrating the UI Kit specifically, is extremelly easy with no specific instructions.
The only ‘interesting’ things are:

  • Use the controller included (or parent it to your own)
  • Don’t forget to place the minimap capture actor in your map (if you need to use the minimaps…)

Then you can explore our detailed level (that showcases almost everything in the kit) and gives usage examples. You can then copy our implementations or use your own

Several other questions are already answered here, and I am very happy to answer more specific questions here or by email :slight_smile:

When I made the PrototypeUI_Controller the parent to my own controller (empty other than control BPs and Spring Arm/Camera), a host of errors occurred upon compiling.

I am using the TPS mode within UE 4.16.2

It may be my sheer ignorance, but I would rather ask than go further.

Hey,
As I can see from your screenshots, a ton of pins are disconnected. I don’t know how this happened, but my guess is that something went wrong inside UE (I’ve had blueprints get their pins disconnected from time to time). I would suggest as a first step to try the migration steps from the beginning and see if it works or (since you are using an empty controller anyway) just extend the one provided.
Worst case scenario (I hope you don’t have to do it though…) is to reconnect the pins as they are in the UI kit…
If you haven’t resolved your issue maybe you can post exactly what you did before this happened, so that I can pinpoint any probable cause.

Thanks and sorry for any inconvenience.

Instantiating extended widgets

Hi folks!
I’ve a question about instantiating “custom bars” at the start of the game. In my case I’d just made a duplicate of the existing gradient bar (with sphere / orb style) and done few additional things (like rotating a texture instead of panning, changed a color, etc.). After adding a new type of this gradient bar on my HUD I’d expected that it will be working without any issue (like just don’t forget to setup an another Bar ID, right?). So, what I’m doing wrong? Perhaps I forgot something?

Current state of blueprints you could see in attachment.

Hello! First of all, make sure the bar you created correctly inherits from GradientBar_Base. If you correctly duplicated one of the existing bars, this should be the case. Then when adding the gradient to your layout make sure you set the bar ID (case sensitive too!)
See the attachment below. If all these are correctly setup, could you include a few screenshots that show the widget settings etc? Because the ones you include seem fine. (Also make sure that the cast to TopDownCharacter works)
Finally, you should be calling “update bar” whenever your health/mana changes. In the showcase map this is done in ‘mycharacter’ blueprint (attachment below)

As I said earlier, it is a duplicate (with Ctrl+W) of the existing sphere/orb bar and slightly changed the visual part of it. Yeah, I remember that necessary to specify the “Bar ID” parameter and try to keep the same case for the whole your project (for minimizing unexpected behaviour and so on). In my case, I prefer to use words that were started with a capital letter. For this particular issue I have two different orbs: one for the character health (with “Health” value for the “Bar ID” parameter) and another for mana (with “Mana” value for the “Bar ID” parameter).

More details about it you could see on the screenshots. :slight_smile:

Well, it does seem to be set up correctly… It should be the same thing that I did when creating the all the bars. (The parent is correctly setup as the Gradient_Base, right?)
What part of this doesn’t work then? Do the bars not show at all, or aren’t they updating? If you place another bar with the same ID in its place does it work correctly? Are you actually calling the Update Bar on damage or when you are using mana (as in my second screenshot?)

Issue here that is rendering as the widget for the characters health (and real looks the same), but in my case I’m expecting that it will be rendering as widget for mana, with the appropriate visual part which I’d changed before. Although they are updating without any issues.

I’m not sure, but it looks like the issue, when you’re trying to extend/change the existing visual part one. Like… create a duplicate, change something for this duplicated GradientBar (textures, borders, etc.) and will try to use it further for your HUD. Just move on your layout HP widget (GradientBar, even it could by default), and the changed widget (the duplicate of HP widget, with the some visual changes). And as the result they are rendered or displayed as the base GradientBar (HP widget, from which we made the duplicate).

Ow, I didn’t understand what your problem was in the first place, that’s why I was asking you to set the bar ID etc. First take note that those gradient bars are rendering a material (GB_Fill_T5 to be exact). That means that any change you want to do to the rendering part should probably be done there (you could even duplicate the material). Now there are a few material parameters like color, intensity and fill, that should work correctly if you set them like we did in example layout 3…

So, could you take a look at the example layout 3? Does it work for you?
Also, make sure if you are changing stuff in the widget, prefer to do it in the material instead, maybe this is the problem?

The layout 3 works fine and I didn’t have any issue with it, but I want to replace the widget that displays mana on a custom (with the different material, that already exists).

I have separate material for a gradient bar with the custom effect, which you saw few posts ago. So that, the default gradient bar using as is and an additional - a duplicate of it with the custom visual effect (separate material in my case). I’ve tried to make a new widget (for a mana, with a whirlpool effect for it) via creating new blueprint (with a GradiantBar_Base a parent widget) and have mentioned, that it’s displaying wrong. But if I make some changes around the EventConstruct, like you will see in the following GIFs, then it will be displaying as expected, but it wasn’t updating in the game.

Current gradient bar rendering
Custom gradient bar (expected view, no updates)

Okay, after some additional investigations I found something interesting. If will go to my GradientBar_OrbMana blueprint, after it go to “Graph Edit Mode” and click on the “Class defaults” button, change in “Default” section “Gradiant Bar Material” and “Color” properties on the values which I would like, than all works good. But I’m not sure that is right way… Whether there is a better way how make it better?

Hm, changing the defaults of the blueprint seems to be a good and correct way to create your custom gradient bar. I am not sure why the color didn’t actually change when you were selecting it in your layout but if you have it work with selecting the defaults then you should totally go with it. I will investigate further why the first way didn’t work but it is quite strange since it actually works with our example… Maybe you selected something that overwrites the color on your custom widget?

No, only one thing that I was changed after was duplicating the existing bar has changed the default material on the custom with a whirlpool.

Well, i think the correct way for what you needed is to change the class defaults I guess. So, you have it working correctly now?

Sure, it works good :slight_smile:

Hey everyone! The User Interface Kit is 25% off during the Summer Sale! :slight_smile:

@Semitable

I got it all setup … but …

I am using a specific widget “w_actionbar” and it has the Actionbar T4 in it.
I have the “create actionbar” setup to “Actionbar T4” for the class and widget ref. (there is a T4 and a longer named T4, i dont have the project open at this time, but, its the longer named T4)

When i drag from the spell book, it wont stay on the actionbar. I know i probably missed something stupid here. Its literally the only part that isnt working lol.

UE4 version 4.16.2

edit:

watching the video, i just noticed your spell book in the example has different icons. the spellbook i open has 1 orange face and like 5 red ones. did i manage to manifest a different spell book?

Hello!
That’s quite strange. The spellbook you should have is the one in the video: it has 6 spells (heal, aoe, mana regen, example, fire, fly) and there’s no face icon. Is it possible you are opening the talent tree? (spellbook is the ‘P’ key) - because the talent tree has the face icons
Are you using the kit from our example level or did you first migrate it? In any case, could you try it in a fresh project, or attach a screenshot?

Thanks,

https://scontent-dft4-2.xx.fbcdn.net/v/t31.0-8/20287190_1916059221981512_5316481566586876176_o.png?oh=8098a2c144d5571cf68aa4b126613d53&oe=59FC64A4

ok, so its something in my player controller i am missing
I kept it all the same, then swapped out my playercontroller with the prototypeUI one … works
so now i am wondering, where is the error/issue?

Keeping my UI up, its now adding to my own actionbar widget when i add to the one from the prototypeUI controller …

Well, this doesn’t seem like the spellbook included, so I would say that something went wrong with the migration…

First of all, if you open the spell book widget (UI_Kit/Widgets/Window/ExampleContent/SpellBook), and click on one of the spells (they should all be red faces), is the “Spell Actor Class” variable set? (i’ll include a screenshot)
Every row should have a different class. If everything there is set correctly, is the relevant spell correctly setup? (screenshot 2)