Creating a Custom Tab System in Unity

Рет қаралды 229,572

Күн бұрын

In this video we take a look at how to build a Tab System for a UI Menu. We create a flexible Tab Group and Tab Button behaviour system that allows to easily switch between GameObjects or execute custom code when a Tab in the group is activated or deactivated.
Be sure to LIKE and SUBSCRIBE if you enjoyed this guide! Share the video for extra love!
--------------------------------------------------------------------------------
Want to support the channel?
Get the GameDevGuide mug and other merch! ☕ - www.gamedevguide.store
Use these links to grab some cool assets from the asset store:
Get the Must Have Assets! - assetstore.unity.com/top-asse...
Free Unity Assets! - assetstore.unity.com/top-asse...
New on the Asset Store! - assetstore.unity.com/top-asse...
Top Paid Asset Store Packages - assetstore.unity.com/top-asse...
Asset Store Partners - assetstore.unity.com/lists/as...
--------------------------------------------------------------------------------
Socials and Other Stuff:
• Subscribe - kzfaq.info?...
• Join the Discord - / discord
• Twitter - / gamedevguideyt
• Facebook - / gamedevguideyt
• Instagram - / gamedevguideyt

Пікірлер: 226

@BlakeGillman 3 жыл бұрын

I didn't even need to watch the video, just seeing the title made me realize I needed something I didn't have before. I always just programmed tabs separately depending on what system I'm making, it never even occurred to me just to make a generic tab system lol. I should do that.

@buzz1ebee 4 жыл бұрын

Really good tutorial. Straight to the point whilst not missing out on any explanations. Instant subscribe. Keep up the good work!

@Assasin1618 5 жыл бұрын

I am so glad this was in my recommended! So much better than most tutorial videos on game dev around KZfaq. Keep it up!

4 жыл бұрын

This is... amazing. So clear and direct to target. You are the master dude. Instant sub!

@LuRybz 4 жыл бұрын

Man, this is amazing. Really cool and organized way of doing this. God Bless you and thank you for such content.

@jdmozo 4 жыл бұрын

Man you're a genius, I'm lucky to find your channel!!! Thanks a lot for the tutorial!

@storiesstrauss3402 3 жыл бұрын

Your tutorials are awesome! I really enjoy your thought process and how articulate you are when explaining it.

@BlueGooGames 4 жыл бұрын

Perfect, thanks a lot! The small little trick with using an image in an event to turn it on and off was great. Now the main menu of Space Chef is starting to look and work really well! :)

@TheHyvin 2 жыл бұрын

Great video. Quite refreshing to see some well organized code that doesn't feel hacked together. I subscribed in hopes of seeing more like this.

@PyroOfZen 4 жыл бұрын

"You could do this manually with buttons, but that's tedious" *recreates buttons from scratch*

@SaiCharanKommana 3 жыл бұрын

Exactly...

@myriadtechrepair1191 3 жыл бұрын

Recreating only the functionality you need in a way that scales better is the hallmark of a good system's engineer.

@manavarora7644 3 жыл бұрын

@@myriadtechrepair1191 TRUE.

@bodietripp8218 2 жыл бұрын

I guess Im randomly asking but does anyone know a trick to get back into an instagram account? I somehow forgot the login password. I would love any tricks you can offer me!

@nilla_studios 2 жыл бұрын

+ can't navigate using keyboard

@KhrisKruel 5 жыл бұрын

hey man, great guide! Looking forward to more stuff. While I might know how to do basic things, the way you go about things brings a lot of ideas and new ways of thinking to solve my game dev problems, and is a lot cleaner as well.

@Gathrey 5 жыл бұрын

This video is great! Hoping for more tutorials :) Definitely right up there when it comes to clear and concise explanation and format. SUBSCRIBED!

@nericarcasci9919 3 жыл бұрын

Your tutorials are always so clear, keep it up man!!

@hernandonj 3 жыл бұрын

Wonderful video. Precise, direct, focused, lean, and very well explained. Thanks a lot!

@eggsareliquidchicken5615 2 жыл бұрын

Great video! I'm making my own UI toolkit and your videos have been really useful.

@TheErusPrime 2 жыл бұрын

This is exactly what I needed for my generic table top character builder and tracker. Thank you

@TipToeTiger 4 жыл бұрын

Great tutorial, really appreciate the effort you put in. Keep it up!

@Dymangel 3 жыл бұрын

Ok nice tutorial, you have my like. This helped me to make something rly simple in the UI

@nemlinkacompany7577 4 жыл бұрын

Again amazing, I love all your content and this one helped me strait away. I found few "make your tab" tutorial, but after seeing your, I had to change whole logic, because it is much more clear, and feel really profesional. I hope your views will skyrocket because there is few channel with such heigh quality tutorials. Wish you the best. And many thanks for any of yours video

@davidsesto1224 4 жыл бұрын

Amazing video! I love how you explain everything in such a way that can be abstracted and used in different contexts, not with the specific use of the demo in your videos. In case anyone is having trouble with the trigger of OnPointerClick (both OnPointerEnter and OnPointerExit work for me, but OnPointerClick does), I've read on other sites that adding a Button to the Tabs could solve the issue. It does for me, although I still do not understand why the two first events work, while the third doesn't.

@egamer8116 4 жыл бұрын

I had the same problem ! I've tried everything on internet to fix it and it still not working. but After some test, I found out that It was the UI's (or images layers) problem, the OnPointerClick function works after I replace tab buttons.

@ashishdandge5587 4 жыл бұрын

Thank you for making such high quality contents. Huge Respect.😊

@Ophelos 4 жыл бұрын

I know that this video is a few months old now, but you got a new sub because of it.

@thiagobr12 4 жыл бұрын

Thank you so much for this awesome video! Helped me a lot

@thepolygonpilgrimage 5 жыл бұрын

Another beautifully explained and well paced guide. Excellent work! I'd like to reach out and see if we can collaborate on something. You deserve WAY more subscribers for this hard work and solid content.

@jxvisn8551 4 жыл бұрын

This... this content I like :D. Great video man

@wanderergrim 2 жыл бұрын

Thank you this video was extremely helpful as I am making a game for my final year project of my Computing Degree

@tuanoful 5 жыл бұрын

This was great, thanks!

@user-ix7pe5oo6h 2 жыл бұрын

I was stuck with creating tabs in Unity, but this well-organized tutorial helped me.

@YoutuberUser002 3 ай бұрын

It's just a button and enabling and disabling UI how bad are you? 😂

@RiorXD 4 жыл бұрын

Hold the phone.... 3:00all the years ive been using unity and i Never knew you could change the icon of the scripts and objects.....

@besportscrazy 4 жыл бұрын

5.5+ and still didn't know :D

@FireJojoBoy 4 жыл бұрын

Ikr this is so usefull and professional

@martin-gaming 4 жыл бұрын

same

@chrheca 4 жыл бұрын

WOT DA HELL

@breakfastboi3344 4 жыл бұрын

I’ve basically anyways knew it

@farvardinmainyu1961 3 жыл бұрын

It's Quite really good! The code is simple and clean.

@jiehongjiang5826 4 жыл бұрын

This channel deserves more subscribers!

@error04 4 жыл бұрын

Whyyyyy do you have so few followers??Your videos are really great and useful. I wish you a speedy prosperity of your channel, you clearly deserve it!

@ChrisNoeth 2 жыл бұрын

This was really helpful! Thank you! :)

@victormr1601 3 жыл бұрын

This was very helpful, thanks!!

@gustavo.saraiva 5 жыл бұрын

Guy this videos is awesome, congrats 👏👏👏

@CodemasterJamal 4 жыл бұрын

Wow, this is a really useful script. It can be used in different projects rather easily.

@chakanshu 4 ай бұрын

Things free on youtube not on unity X| huh. Thanks so much matt yes? I've been watching your videos and learning so much and my boss is really impressed with me because of these solutions.

@maxbauerv 2 жыл бұрын

Thank you so much! Great tutorial

@RealFakePhD 2 жыл бұрын

this is slick. great work partner

@my_namejeff9770 3 жыл бұрын

this looks like magic. great video btw..

@eldanridley7 4 жыл бұрын

really helpful video, thank you!

@MansGottaCode Жыл бұрын

Outstanding. Thank you so much!

@dmitriysparrow 4 жыл бұрын

sumptuously! Thank you

@daicarft1765 Күн бұрын

thank you for the video really healped me out

@rekss9252 3 жыл бұрын

Thanks man this is so amazing

@rimoldi98 5 жыл бұрын

Great vid! Found you out through reddit and damn... You need more subs dude, great quality and very well explained, learned a lot with it, keep up!

@MaksMikhnevych 4 жыл бұрын

Don't hesitate to share the video on your social media, this way you will help getting more subs to dude.

@CraftBasti 4 жыл бұрын

Where in reddit did you find him?

@casualbachgiagame4552 4 жыл бұрын

Great tutorial! It help me alot.

@tranvilap4713 4 жыл бұрын

This was great, you deserve more subscribes. keep up!!!!

@MaksMikhnevych 4 жыл бұрын

If you want to bring more subscribers and not only point out to low count you could, well, share this video for example ☺

@enolya 4 жыл бұрын

Referencing! Keep it up :D

@aneetnadella1123 3 жыл бұрын

Awesome tutorial!

@muratkk1096 Жыл бұрын

great tutorial, thanks a lot

@namoviot 3 жыл бұрын

thanks for this super helpful tutorial

@lavizpandey9957 2 жыл бұрын

Good one,Thanks

@BenjaminK123 4 жыл бұрын

This is a great video nice and easy code thank you

@adnansiddiquegd7186 3 жыл бұрын

thanks it is really helpful

@joaovitordias1 2 жыл бұрын

THIS IS AMAZING

@rodrigomulinarioramos7504 2 жыл бұрын

Ohhh I was really looking for the first type of tab! hahaha

@irfanyigitbaysal7894 4 жыл бұрын

you deserve more than 25k subscriber

@jiaqili1644 4 жыл бұрын

That's perfect for my app Thanks for exist :3

@RenCode 4 жыл бұрын

beautiful !!

@ROCKSMASHER 7 күн бұрын

Nice man

@erikponti1753 2 жыл бұрын

LOVE IT!

@paulwolf8799 6 ай бұрын

May you get a gazzilion subscribers, this is priceless.

@danielbird2182 4 жыл бұрын

Super helpful! Would be great to get anyone's advice on the best way to deselect a Tab and Page on the second click (a click on the same tab as the first click).

@ai.one.prompt 2 жыл бұрын

thx for ideas for game.

@themirlabs 2 жыл бұрын

This is a very clean system. i really like it. Only issue i have is there is allot of public variables and funcs. allot of them could be private or [serilizedfield] private. Other then that im subbing for more.

@TheNamesJT 4 жыл бұрын

Yeah, I have watched many unity tutorials trying to learn c# watch the beginners/intermedia and advanced unity c# playlists and other KZfaqrs unity based c# playlists even purchased some Udemy course on unity and still would have never been able to think about doing this.

@joelperpetua3929 4 жыл бұрын

Knowing a programming language does not imply knowing how to program

@dormitando 16 күн бұрын

@@joelperpetua3929 its been 4 years, did u already figure out the difference between a language and a framework?

@breme248 3 жыл бұрын

You gained a sub

@Cefaun666 3 жыл бұрын

Thanks for all you great work! I've learned tricks from your vids that save me hours of effort in the long run (particularly adding functions to the right mouse click menu). However, I was wondering if you could point me in the right direction to make this tab system more controller/keyboard friendly? I've tried a few things with the event system, but can't seem to make the submit button show each tab.

@TheMonyarm 5 жыл бұрын

Subbed.

@sevovideo 4 жыл бұрын

Hey, great tutorial. Can you tell me, what should I do somewhere at 12:27, when I want to invoke onTabDeselected, when I click on selected tab again?

@madmanga64 4 жыл бұрын

Awesome

@sigvist6228 2 жыл бұрын

You are a cool guy

@EddiePenta 4 жыл бұрын

This is a great video! Any reason why you loop through objectsToSwap instead of just deactivating the previous selectedTab and activating the newly selected tab?

@Kokomo78 4 жыл бұрын

Wow. Thank you for your clip. I thought I know well enough about Unity. But after watching your clip, I realized I know nothing about Unity.

@codingog5554 4 жыл бұрын

0:55 scared me there mate xD

@luciojcp 2 жыл бұрын

Excellent video. Nice work! Subscribed!!! I have 1 question... And when you have so many tabs in your screen (mobile for example, 5-6 tabs are wider the screen width), how to make a horizontal scroll for the tabs, keeping the content at the same place, changing when clicking on the tabs? Can you make another video? Thx

@Distortion3933 4 жыл бұрын

Awesome video, but now I want to know what the song is that's playing in the background

@zakkaioken2812 4 жыл бұрын

good video

@cesarsampedro_dev Жыл бұрын

So cool!, Where I can get those tab icons for the editor?

@joshuarobinson7422 3 жыл бұрын

You could also use Enums

@danipuig8830 3 жыл бұрын

how can select one of this tabs when Start() function runs? Thanks, good video man!

@WalterMan 2 жыл бұрын

Great video! But how do I make it so Tab One is selected by default? Thanks

@BleachWizz 4 жыл бұрын

Amazing video, this helps a lot for a quick project and understanding. But I still see a lot of bad practices that wouldn't scale well... Fact is I'm also one who has a lot of trouble with it. Would you be interested in making a video showing how could you get these 2 tabs you made into abstract classes and inherit it to recreate what you just did, plis how you can have 2 kinds of tab systems on the same project using theses classes? This is something that's rarelly shown and I'm sure I'm not the only one who struggles with it. C=

@aktchungrabanio6467 Жыл бұрын

Which bad practices?

@magnustips 4 жыл бұрын

Cool

@slhdfg3256 4 жыл бұрын

Goooood

@evgenyi232 4 жыл бұрын

Can i see the video how you built that tab menu?

@TrueIndian 4 жыл бұрын

Awesoooooooooooooooome...

@nickmalialis6 4 жыл бұрын

Hello. Great tutorial. One question, how do select / define which tab is selected on start up. Tab in index 0, is not what auto selects, it is usually 3 or 4.

@GeeCeeAte 3 жыл бұрын

same problem here. You ever fix it?

@stergiosk6424 3 жыл бұрын

Late reply, but if anyone still wondering, I found a solution. On TabButton script, use a public bool variable and set it to false and add on Start method: if (variable){ tabGroup.OnTabSelected(this)}. Then on unity, for the tab you want to be selected on start up, just set the bool variable to true (by checking the box). Hope it helps!

@troisot1107 3 жыл бұрын

How to make that book in inventory readable ?

@jasoneider7589 Жыл бұрын

Hey! Would you still recommend creating your own scripts over using Unity's built-in toggle system in it's current state (2022+)? I'm wondering if they have improved it enough that you would recommend it.

@ast_rsk 4 жыл бұрын

I like how you don't waste memory with an empty list until you actually need it. Great detail.

@liamvisionary9608 Жыл бұрын

Love these videos, but just wish that proper naming conventions were used. I'm having trouble figuring out if something should remain public or be set as a private member

@sampleee 4 жыл бұрын

You should have made it use a dictionary instead of just getting the index, that just makes it a lot more user friendly and readable

@beigecozygirl 4 жыл бұрын

Are Tab Area and Page Area panels?

@myriadtechrepair1191 3 жыл бұрын

I just wanted to point out that in line 27 at 8:45 you check either for selectedTab==null and button!=selectedTab. The ==null case is redundant, isn't it? If the first case is true, then that means the second case must also be true.

@jtherussian 2 жыл бұрын

What if I wanted to have all pages enabled instead of disabled in the Scene? How do I make the Page 1,2,3,4,5 all stay enabled when starting the game?