Make Beautiful Desktop Applications in C++

See NordPass Business in action now with a 3-month free trial here (use code thecherno) ► nordpass.com/thecherno
Patreon ► / thecherno
Instagram ► / thecherno
Twitter ► / thecherno
Discord ► / discord
Walnut ► github.com/StudioCherno/Walnut
Hazel ► hazelengine.com
🕹️ Play our latest game FREE (made in Hazel!) ► studiocherno.itch.io/dichotomy
🌏 Need web hosting? ► hostinger.com/cherno
💰 Links to stuff I use:
⌨ Keyboard ► geni.us/T2J7
🐭 Mouse ► geni.us/BuY7
💻 Monitors ► geni.us/wZFSwSK
This video is sponsored by NordPass Business.

[@TheCherno]

Hope you guys enjoyed the video! Check out Walnut here ► github.com/StudioCherno/Walnut See NordPass Business in action now with a 3-month free trial here (use code thecherno) ► nordpass.com/thecherno

[@phusicus_404]

I am gooey😁

[@Tri-Technology]

Why is the default title bar always white even when I am using the dark mode theme?

[@a_spire]

I use clion 99% of the time.. Wish you could also use it in some tutorials :)

[@SefishGAMING]

Make a video on IMO gerrdy. Gerrdy in Many gimmes please make a video on this 😢😢😢

[@rezakarimi6034]

Thanks for sharing the code especially the custom titlebar part. A separate video about it is also welcomed :)

[@nixellion]

"Imagine having your game engine powering your launcher." - Godot be like 👀

[@ZiplawDev]

unreal -> epic games store does that as well lmao

[@nakoyasha]

@@ZiplawDev the funniest part about that is that it's a custom build of ue4 that *only* renders a webview and nothing else.

[@Bobbyhiddn]

I’ve been trying to figure out if this is something I should pursue. Godot for front end, Python for for backend. I don’t see why not.

[@scififan698]

​@@Bobbyhiddnif you want a heavy dependency for the front-end and a slow back-end, sure, excellent choice.

[@pearly1789]

@@scififan698 ​ The epic game store is one of the most godawful user experiences in recent memory. Unbelievably slow and just doesn't load things half the time. Now it all makes sense

[@verminology9999]

Definite yes to a whole video just cleaning up the main application file! Would love to see your thought process regarding that.

[@dragoniko55]

NC prefix stands for something like "Non-Client". Some messages have a client and non-client version to differentiate between something happening in the client portion of the window (the app) and the non-client portion (titlebar, resize handles, etc.)

[@IllumTheMessage]

Can't do enough Walnut videos. Really helpful and useful.

[@9MAS91]

that image decoding stuff looks interesting looking forward to that vid

[@samaykothari]

I love these kinds of videos and hope you will keep making more!

[@Frame4245]

"Imagine having your game engine powering your launcher." - Meanwhile Epic Games Launcher running as a full Unreal Engine game

[@CoolModderJaydonX]

Wait, really?

[@Frame4245]

@@CoolModderJaydonX yes it's a full engine build including DirectX, Crash Reporter etc. just for rendering a web view.

[@phusicus_404]

Wow that's why it is very slow on my laptop

[@CoolModderJaydonX]

@@Frame4245 Epic Games, was that necessary? I would have just used an app framework for C++ or C#.

[@flobberant]

the worst launcher in the world

[@Sh4dowOfD34th]

Instead of something like this we now get big corporations abusing JavaScript and creating bloatware that devours your ram and performs like S* just because they refuse to hire dedicated teams for cross-platform desktop. Great video as always.

[@brawldude2656]

fr man modern app guis get %15 idle on my cpu

[@Parritz]

getting a good looking UI in native C++ is an absolute nightmare, i don't blame them

[@kuhluhOG]

@@Parritz it doesn't even need to be C++ (although in this case it mainly depends on the C++ Toolkit/Framework) even JavaFX is considerably better

[@jsonkody]

it has some pretty big advantages thou .. but I wish JS were cleaner and browser would be super-lean and super-fast modular technology 😢 I need Thanos glove for make it happen xD

[@bilalarain4632]

@@jsonkody can you explain why javascript isnt cleaner?? whats extra!!

[@ThatNiceDutchGuy]

Thank you for this generosity sharing the code! 😍

[@Kazyek]

My god this bring back memories, my first public github repo was a little wrapper for WPF bundling a theme I liked and adding primary colour variants and a custom window element using it. Bring me a lot of nostalgia!

[@smokingcrimson128]

you're the best!!! with your videos im keep motivating myself to improve my programming skills in cpp and god it's so hard bad interesting, i want to make games with opengl and i'm watching your series about cpp and opengl, you're a great teacher!!!!

[@hawks3109]

I'd love a video on how the compiler and other components work to actually package and ship the game itself. How is the exe built? How are the assets "cooked and packaged"?

[@barnarddale]

Looks like a helpful toolkit. Often, when an app does not use a standard title bar, they lose some edge cases like keyboard control for accessibility. Does this toolkit have most/all of the standard features? If so, are they redirecting to the OS's window management or implementing the same functionality? Thank you!

[@pixelmasque]

how do you design your own buttons and interactivity (animated elements)? is that using illustrator or SVG code? Or do you write it all in C++?

[@mahdavimail]

You are explaining the lessons like a real professor/teacher not like a programmer. Thanks and I am self learning a lot from your contents ❤️

[@baxstart9008]

Im weeks new to C++ so a Walnut tutorial series would be highly appreciated!

[@flobuilds]

Great video and a great project hope to see more of it

[@tswdev]

The term caption is used to describe the text that explains or describes some graphical element in the early UI world (its used by Win, Qt, Swing and Delphi for example..). Title or label only really came later. Thus, the "title" or "label" of a window is its caption. In use is also the term "window header" that directly comes from physical mail letters. This last one is kind of odd because "headers" are used for other messaging constructs and thus make little sense to describe a window. Caption also no longer makes a lot of sense as its very imprecise (html uses it to describe/explain an image, instead of title it), just search for its synonyms

[@neobscura]

It's called caption cause in the win 9x days (especially 95 since there was absolutely zero "decoration" while 98 got a gradient woohoo) the caption was the titlebar text. There was no other container than this as the controlbox was drawn on top of the "titlebar". So caption was essentially "the titlebar".

[@okashikami5588]

love your videos man!!! can you show us how to made your icon in to the embed please

[@MrHaggyy]

This is awesome. As a control/system engineer i know my C/C++, but i was never happy with the effort/reward of desktop app tools in C/C++. Walnut might be the tool to let me do my engineer stuff without focusing too much on the application stuff. If you want to beef up your example with some sort of file format, save & load, do something, plot something that would be highly appreciated. Maybe a small tooling software that helps you with your game engine or fits nicely along side the engine.

[@aidanhouk]

We're making a cross-platform game that runs on Windows, macOS, Android and will run on iOS in the future. I decided not to use 3rd party framework for GUI but to create it by myselft since we did the same in my company. Right now I create everything in the code but later it will be written in external files on some markup language.

[@arthur1112132]

23:59 The C23 standard now has a new #embed preprocessor directive to do this directly within the language so that you won't need a script to pre-compute that anymore. The compiler will do this for you :)

[@ScibbieGames]

i havent seen it implemented anywhere, however. It's still C2x sadly.

[@v01d_r34l1ty]

So will this not be available in C++?

[@guckesksk5895]

@@v01d_r34l1tyYes it will be available in C++ when C++23 standard come out

[@arthur1112132]

​@@v01d_r34l1ty I guess it will be added into C++'s standards as well. Even tho C++ natively supports C's standard, so you will be able to use it once it's added to C anyway

[@anon_y_mousse]

I can hardly wait. I still use mostly C for everything.

[@GrzegorzUrbanowicz]

Great job! I would like to see cross platform version of Walnut.

[@georgemallard4120]

Love to see more about the Python PNG file to array thing

[@konradstrachan471]

Very cool, i'll have to poke around with it!

[@wtcodingproductions]

Working on creating an app atm and I have delved a bit into SFML language. Using VS 2022 x64. But... For as much C++ coding I think that I've learned and I know the more I realize... I am just at the beginning of what there is to learn and to know. Thank you for the great video, Sir Cherno !!

[@jackle3002]

Wow, all of that was so cool.

[@arturwelp1877]

Thank for thinking on the Linux support. This week my younger brother was asking for tips on creating GUI apps wit C++ on Linux

[@CarbonI4]

Something which made me steer away from imgui despite being initially excited is its handling of pop out windows and I am kind of surprised it's not been a problem for hazel/walnut. If you do any game development 2 monitors or preferably 3 are essential, seems like an extremely important feature to have correctly working pop out windows that behave correctly so that you can drag out windows and expand them to fit on second/third monitors.

[@user-sl6gn1ss8p]

I've started using imGui recently - could you elaborate on where you're having problems? And are you using the docking branch?

[@CarbonI4]

@@user-sl6gn1ss8p I was using the docking branch, but as far as I could see there was no full screen/minimize/dock to windows desktop type functionality. I suppose it could be added with custom code though. While you can drag the window outside by default it seems to behave like a sort of floating window detached from its parent. I get that it probably behaves like that for cross compatibility reasons, but surely in the case of full screen and minimize that is fairly standard across OS's?

[@nestor1208]

Is there "borderless window" mode for wallnut? Because I frequently see this in games (and use it) instead of fullscreen mode. Wouldn't it cause problems with resizing, when implementing custom resizing code? (17:20) I reckon it's not "maximized" (18:21), is it?

[@MultiLeechCZ]

I would like to see more and more about Walnut, whole series how to make nice looking application be even better.. :)

[@Kickin0u0in0the0nut]

Can you make a video about that img embedding that sounded supper interesting

[@shellgecko]

you basically figured out how is built slate (the ui framework) that unreal engine uses to render its own custom controls and 'look and feel' implementing this using C# and WPF is kinda simplier because it already provides classes to custom the window and the controls but of course is limited only to windows with C++ it is needed to build an own renderer that overrides the default used in every OS

[@TheAlexgoodlife]

Glad to see that linux support is on the table. Would love to see this go cross platform

[@user-yc9rp8mv5b]

Dear friend. Visit youtube channel "Solve My Programming Task". They create simple programs for free. I used it. I am a student.

[@random6033]

linux users will eat him for those windows

[@StevenJAckerman]

Awesome - thank you !

[@TechnicJelle]

I'm pretty interested in using Walnut to develop some desktop apps in the future. Please make some tutorials for it! :D Please support Linux soon, too. And will you support web/mobile platforms as well? Maybe with emscripten for the web?

[@AlesStibal]

I would appreciate Linux support as well!

[@kgnet8831]

Yes more Walnut please 🙏🙏

[@workethicrecords5901]

Is there a way to deveop with walnut without a dedicated GPU? I keep getting a "Vulkan error VkResult = -3", from the check_vk_result() function, and I'm not sure what that enumeration means. (The Enum VkResult only has one listed value, and last I checked -3 was 0xFFFD, not 0x7FFF) Seems like a really cool framework, but I'm not sure my Thinkpad T420 with integrated graphics is up to the task.

[@Gandalf_Le_Dev]

Nice it looks promising ! Can we create transparent topmost and click through app to create an overlay over fullscreen games ?

[@KennyTutorials]

Remembering when I wrote custom title bar for my engine, It was completely nightmare, especially with Win32 NonClient area, and custom hit situation, to move and resize window, in your custom non client area.

[@ZeroUm_]

"Imagine having your gaming engine powering your launcher." I've seen a lot more deranged people powering their apps with web browsers.

[@a_soulspark]

that would be shocking

[@v01d_r34l1ty]

@@a_soulsparkHaha! Because it’s Electron ⚡️🥴

[@modded-1.]

Man you make my way easy thx 😊

[@user-pg2ry6jx1s]

Haha, I'm crying 😂 I just love your content ❤ and it actually saved me with my work C++ project. I also watched your old imgui videos, and liked it, but unfortunately decided to go for qt (which I also dislike, but still seemed best choice für my demands)... And now you drop a new imgui video 😅

[@showmeyourcritz321]

What's wrong with Qt? I actually like it very much :) Hard to learn and master but once you get used to it, it is worth it. It's fast and cross-platform for Desktop Apps.

[@Markus_included]

Now i'm wondering how you put the native titlebar buttons in there like firefox does

[@glenneric1]

Hazel AND Walnut! This guy's nuts.

[@showmeyourcritz321]

I bet something called Peanut is in the making :D

[@mohamedbensalah5652]

I think you can inspire a solution from this in WPF to remove that white border set Glassframethickness CornerRadius and CaptionHeight to 0

[@djouze00]

I love how every application decides that their titlebar is the best and I'm the one who ends up with an inconsistent ui 🙄

[@rafal7217]

Reinventing the wheel, Qt is a great framework for creating multi-platform C++ applications.

[@toby9999]

That's more a matter of personal preference. I've worked with Qt and I hated it. I would never use it by choice.

[@realeques]

I am a Microsoft NAV/BC developer but its still mesmerizing watching you talk about anything programming related *glaze*

[@RodyDavis]

That’s why I like flutter! Every pixel ❤️🎨

[@kiwixfps]

How often is the screen refreshed in walnut?

[@luciwaves]

God bless you, but I gave it (ImGui) a try this year and having to calculate rectangles just to be able to right-align a label to a textbox is not something I'm young enough to do anymore. Great videos, tho. Thanks for all your educational work.

[@marijnstollenga1601]

Awesome rundown of Walnut, hope linux comes soon!

[@ClashBaseDeveloper]

I’m always being struggling with organising my application so started with building an application to organise my applications😂😅

[@Patrick1985McMahon]

Walnut looks so much better than the stuff Windows provides. I really like the dark theme.

[@johanrojassoderman5590]

0:43 looking at you, Epic 👀

[@s_vb]

Im just impressed how you can make half an hour video out of small library. this is talent

[@audaciousifti]

For almost all of my CS education all my programs were just CLI based and I never really understood what the purpose was if you didn't know any actual commands. So seeing this now is really cool

[@v01d_r34l1ty]

did you use c/c++ or was your class more java oriented? i know my first semester java class was entirely cli based but my second semester java class was entirely graphics based.

[@audaciousifti]

@@v01d_r34l1ty I used C++

[@mrmotomoto]

Usually you can type in the Help command or man pages to find out the commands and how to use them. They should be documented somewhere

[@maybenat]

It sucks that with Dear ImGui accessibility kinda sucks, which I partially understand, since it's not meant to be used as a general purpose UI framework (and it's not an issue many programmers care about *sigh*). It's one of the reasons why I'm not using it in "normal" GUI programs outside of internal game engine tools.

[@voxelfusion9894]

Indeed, your best bet will always be to use established, open toolkits like Qt that won't hamper cross compatibility and accessibility. Using a small and light, niche toolkit may seem nice at first, but it will backfire in the long run if you are serious about your project. Don't start off your project with that kind of technical debt.

[@marsovac]

Does Walnut support per window dpi awareness? So for example a monitor with 100% dpi, and another with 250%, and the controls/text look the same size when you drag windows across monitors?

[@aikslf]

How do you hide the IMGUI debug menu?

[@oleksandrkosar1473]

Excellent work! I would love to see it on Linux!

[@sethhankins5683]

Does it come with a file dialogue?

[@mrmaymanalt]

Nice video! Have you considered using SDL2 instead of GLFW for the windowing? It has support for Vulkan and disabling decorations, and it's very cross platform, supporting almost anything. It also has a built in 2D renderer that is incredibly fast. If you want WebAssembly support, you could add an alternative backend that uses SDL2's renderer. SDL2 also has a font loader that can draw text into a texture.

[@KleptomaniacJames]

its dummy thick though[

[@FunnyPetsInHome]

Nice tips for programming

[@MiiDev69]

This is amazing! On the same topic, what are your thoughts on frameworks like Qt?

[@SpaceTimeBeing_]

QT is excellent with qml, you can make it as modern looking as you want

[@slluxxx]

Would you mind showing how imgui can be used with threads to not hang the UI on heavy tasks? Lets say i want to download multiple images and display them as they come in. I am working on embedded systems with custom toolchains and the threading library wants me to specifically close the thread from the main thread and hangs until it is actually closed. I have no clue what the hell i am doing, how to share data and close them without having a slideshow app

[@GameskoTV]

just create new thread

[@slluxxx]

@@GameskoTV you are so funny. at least read more than the first sentence

[@dartello]

Nice work! Made me think of Borland C++ Builder 5. Back in the day the windows were treated as forms and you could change the window in the object inspector [OI] (a form in the development environment) where you could set the properties of a selected object in the form, the form itself. Properties you would find in the private list and also events you could point to the method you wrote. For a window you could choose a kind of window like a dialogbox, client or main application window etc. I would build an OI too in Walnut so settings wouldn't be scattered in the code. The OI doesn't have to be in a window but you can make a settings file like in yaml or json for starters. It's good practice to make apps in Linux. That way you can deploy microservices like Docker or Kubernetes, so developers may develop their code contained not interfering resources of a running host (and break your computer). Now I haven't used C++ Builder in years, also I changed my OS from Windows to Linux many years ago as well as that was more practical AND productive for me.

[@SpaceTimeBeing_]

Why this instead of QT

[@georgeabraham7256]

How do I drag a sprite node into it?😅

[@galaxian_hitchhiker]

Qt is the way. As long as you don’t change their code/framework, it is all on you to how to ship or sell it. And It is so capable of everything you really not to have extend the framework at all. And with much more cleaner code. Right now walnut code seems very cryptic 😄

[@names-mars]

Btw, ask one of those openai apps to generate a nice logo for your framework.

[@waymanharris1284]

Can this application run on iOS/Mac?

[@supremedeity9003]

Hmm... I guess its like the complicated scaffolding is done already so that you can do the designing part. I'll try to implement some changes to use it on Linux as it seems interesting, partially because i really like imGUI

[@JRDev4All]

Things like Im UI, and stuff that derives from it has one humongous flaw: accessibility. And I’m not talking about how widespread it is or how many systems it runs on. I’m talking accessibility in the disabilities sense of the word. There is no accessibility API’s for these libraries, which makes it impossible, if not extraordinarily difficult for developers to make their applications made in those framework accessible to anybody with disabilities

[@RockTo11]

Additionally, some platforms, like iOS/macOS only seem to allow accessibility labels (for screen readers or other things) static, so I don't think it is easy to set the alt-labels at run time - meaning that just getting a mouse event and setting the label appropriately doesn't work.

[@RockTo11]

Oh - and there are laws requiring accessibility. So if making a real application, in the US for example, there are rules in ADA.

[@JRDev4All]

With what technologies? Because if you use apples, native frameworks for iOS and macOS development, that simply doesn’t hold true. I know this because I work with them every day. They make making your apps accessible on Apple platforms extremely easy. And they give you much more stuff to work with than just accessibility labels.

[@RockTo11]

@@JRDev4All I'm agreeing with what you said.

[@Entropy67]

Sounds like a good project, if any young open source developer is willing to take on the task of making a accessibility library for im gui...

[@and_then_I_whispered]

Cherno in every video : We'll probably make another video on this or that😂

[@mikeray3993]

my betting is you paid zero attention to accessibility, and this system will be totally silent with my screen reader

[@HiImKyle]

Well I'll be damned, I just commented on a previous video about asking for this! :D Also the client area being "too big" is false, that's just Windows 11's fault.

[@dennisanderson8663]

The amount of work needed to make a Windows app in C++ is insanity.

[@buddy3852]

Welcome to unmanaged. Decompile some C# forms to see the native code

[@bennguyen1313]

Is there a GUI editor for Tk (Similar to Python + Visual TK), that can generate a design file, that can then be referenced from C++? Qt Designer generates a UML file I tried GTK + Glade / Cambalache , but had difficulty installing GTK and building in Windows Visual Code. Would love to see a video on setting up and building a gui using Imgui, nanogui, or NAppGUI!

[@NeZversSounds]

Why do you need a separate launcher for rendering settings when they should be in the game's options and available at the runtime? Every time a tweak is needed the game should be restarted?

[@christianbastien9657]

I really like your comment about the possibility of your system. Everything is possible with most platforms, i am not an engineer or a programmer, i am also getting annoyed when someone (my developers) tell me something is not possible. Last time i did the part of the project that everyone was saying is not possible. Fortunately my best programmer pick up the project before i end up destroying our program with bad code (but my face recognition program was 100% working, but with badly structured code) I hope you become a billionaire or a least multimillionaire, because being a billionaire is a lot of troubles.

[@SameerKhan-md5po]

I love your content men ❤

[@LongestYardstick]

the links you "add" in the corners don't show up -- I wonder if it's related to ad blockers...?

[@krishnakeshav23]

Is the resulting application cross platform ? (mac, win and linux)

[@saeedbarari2207]

you can use windows' built-in magnifier (win/+ & win/-) to zoom in and out

[@anon_y_mousse]

Does Windows finally have that behavior? I've had it on Linux for decades.

[@saeedbarari2207]

@@anon_y_mousse it was there from 1995. when Linux didn't even have proper desktop support

[@anon_y_mousse]

@@saeedbarari2207 That's complete bullshit. I've used Win98 and it didn't have that behavior, and CDE has existed since 1993 and gave a better desktop experience than Window, even compared to now.

[@chrismajola6065]

is it possible to use libVLC c++ with walnut?

[@igorkozlinger365]

which library i need to make custom titlebar in python like in cpp?

[@TheRealMangoDev]

looking forward to see linux support in walnut.

[@ChrisKoyo]

I was thinking about making a UI with web tech like electron js and stuff but the problem is to render vulkan through it...without using web graphics API. I think cpp gets just harder for tasks that are much easier with higher level techs

[@CalebFaith]

I've done the same with a GLFW OpenGL window embedded in a transparent electron window. Not very efficient but an easy way to get native OpenGL with a web UI. I then use named pipes for IPC between the 2 processes. Another option would be to utilise CEF OSR with shared textures - probably less janky

[@ChrisKoyo]

@@CalebFaith that solution can be clever...until it comes to the Input requirements, i.e making the buttons in the main process of the electron app interact with the render behavior...i wonder node.js can allow these, but i don't know how

[@CalebFaith]

@@ChrisKoyo yes, I have had to send keystrokes etc. to the GL window via IPC

[@ChrisKoyo]

@@CalebFaith oh okay. So you just used named pipes or others methods too? I wonder if signals could fit too

[@Bozebo]

3D game engine powering a launcher or UI is way more efficient than an entire web browser powering a launcher or UI like we tend to get, sucking up like 8 cpu cores just sitting there idle (or in the background inside a game's engine, looking at you DotA2) until they fix "bugs" then it happens again inevitably xD

[@craigslist6988]

"omg we accidentally constantly open connections from our webapp and transfer data constantly, ooops~ totally unintended, we're definitely not snooping around your system and dumping that data to sell... Noooo.. it's just a bug, ooosie"

[@shoaibzafar5663]

I would love to see when you start showcasing Nvidia physx code in hazel 💯

[@Conversion108]

how can I add fullscreen to this app?

[@PedroBorgesNH]

Does an app made with walnut runs on Windows server? Like regular VM with no graphics card? I have and serverside app that uses GDI, its a pain to work with for someone not very experienced like me.

[@v01d_r34l1ty]

If your server has a graphical user interface, it should have graphics drivers. Just make sure your graphics drivers support either the correct version of OpenGL or Vulkan (whichever Walnut uses) and you should be fine.

[@_luceoon]

"Imagine having a 3D game engine powering your little launcher"... Sounds familiar. Oh wait, thats what Epic Games did with their launcher... It's based on Unreal Engines UI...

[@alexanderrotmg]

0:43 Realm of the Mad God Exalt by Deca Games GmbH... They are using the Unity Engine to power their launcher that only works when the window is focused.

[@RichardDobkins-fm7lj]

How do you get rid of the console window? I changed the system type in linker settings to windows but it throws a couple of errors about WinMain. You have a check for the pre-processor directive but i'm not sure that's all that's needed.

[@RichardDobkins-fm7lj]

I figured it out. You have to also be on Dist build

[@tristanzanker7133]

Ive learned basics of c++, looking to move forward with some ui. But i am losing my mind trying to find what to use and where to learn it from, qnd that doesnt cost me money.