UE5 Common Ui - How to use the Common Ui Tab List

Рет қаралды 1,195

Күн бұрын

Hey everyone! In today’s video, we're going to put together a Tab List Widget in Unreal Engine 5 and connect it with a switcher so it can show different action icons depending on what button you press. It’s a cool way to make your game interface a lot more interactive and user-friendly.
I’ll walk you through the whole process from start to finish, showing you how to link everything together so that your tabs update automatically with your inputs. It’s pretty straightforward, and by the end, you’ll have a neat new feature to add to your projects. Let’s get into it!
Join my Discord: / discord
Chapters:
0:00 Introduction
1:46 Common Ui Settings
4:52 Tab List Widget Creation
11:49 Main Widget Creation
13:15 Debug Input Buttons
15:28 Widget Functions
17:09 Create Button
20:42 Tab Functions
27:08 Display full Tab List

Пікірлер: 12

@CGSky 28 күн бұрын

Your common UI tutorials are the best out there. Super helpful! Thanks for laying everything out so clearly.

@MrButiier 28 күн бұрын

Appreciate the support from a fellow dev!

@Athurito 4 сағат бұрын

my button icons are not showing i rewatched everthing but it doesnt work i created a new project and started from scratch but it will not work idk why changed viewport, controller data, enabled commonui plugin created inputdata i tried it with enhanced input and datatable but it still wont work

@Mittzys Ай бұрын

Thanks man, love this video!

@MrButiier Ай бұрын

Anytime man, thanks for the support.

@mahkhardy8588 3 ай бұрын

If you register tabs that the corresponding widget switcher index has no content, at runtime, it can crash the editor when it rebuilds the tab list. At least i think that is what happens.

@MrButiier 3 ай бұрын

Makes sense why it would, cant make a tab if the index doesn't exist lol

@ayoubrezzouk3060 3 ай бұрын

Do you know how to open the tab list at an index and have the commontablistwidget button at that index highted as well ? i mean at an index different that 0

@MrButiier 3 ай бұрын

Ah so what you would want to do is in the widget on construct -> drag off from the common tab widget and grab the node "Select Tab by ID" then drag off from the common tab widget again and do "get tab id at index" -> connect the return value from the get tab id at index and plug it into the select tab by ID.

@luuuyuuu5153 3 ай бұрын

how can I trigger a custom event when I press a button on a tab list?

@MrButiier 3 ай бұрын

There's a couple ways you could do this, if you're looking to call a custom event whenever switching tabs, you could grab the "Tab List" widget then pull off to create the node "Bind Event to On Tab Selected". That'll let you call an event whenever a tab is selected. If you wanted to do it based on 1 specific tab, It'd be easier to show you in the discord since that requires a bit more work.

@luuuyuuu5153 3 ай бұрын

@@MrButiier Thx，I made this by creating a separate CommonActiveableWidget under Swither, then I can use EventOnActivated to trigger an event.