How to Create a Modern Flat UI Design Dashboard in C# 2020

[@fahimjunayed5894]

Now the name visual studio starting to make sense.

[@dexteryt8746]

No. its jsut a random name

[@ikazuchi-san5772]

ye like dexter said its just a random name java IDEs have the same drag and drop thing as well

[@b4tty]

​@@ikazuchi-san5772 back in 1998, they called it 'Visual Studio', as its main focus was being a graphical IDE. if you look back at VS97 (first VS release), its a more of a fitting name than today. but the main reason its actually called 'Visual Studio' because 'Visual' is a microsoft name brand

[@ikazuchi-san5772]

@@b4tty thx for the info dud

[@jujo_mine2800]

@@b4tty that makes sense.

[@icphoto007]

ATTENTION! At least to me first download link my Windows defender detect ransomware!!! I really hope I don't have a problem... has it happened to anyone? Excellent video and very well explained!

[@CodeCraks]

Windows defender detect the zip file has a ransomware because it is if pure C# code on it. if so you can use the file without any fear

[@icphoto007]

@@CodeCraks Thanks for the reply. However I ended up removing the information right by watching your excellent video! Thanks to you I improved the appearance of the non-standard window. my client loved it!

[@CodeCraks]

Sounds good

[@Strakzz_]

I am being Proud. Because You are From Sri Lanka.

[@CodeCraks]

Thank you 🙌 Keep watching our videos and Subscribe us 🙂

[@lucasbrito8374]

Thank you so much, it's so difficult to find good tutorials about win form, in general just old and low quality stuff in the internet

[@stefangreve7983]

This video is also just old, low-quality stuff.

[@GoodbyeMrX]

Great, quick tutorial with structure. Love the design!

[@user35432]

Very excellent tutorial for C# UI beginners !!! I will recommend this to my friends.

[@CodeCraks]

Thank a lot

[@vicsar]

7:45 Basic Coding (Rounded Corners): using System.Runtime.InteropServices; [DllImport("Gdi32.dll", EntryPoint = "CreateRoundRectRgn")] private static extern IntPtr CreateRoundRectRgn ( int nLeftRect, int nTopRect, int nRightRect, int nBottomRect , int nWidthEllipse, int nHeightEllipse ); Region = System.Drawing.Region.FromHrgn(CreateRoundRectRgn(0, 0, Width, Height, 25, 25));

[@elishr209]

Great starting point for me, thanks for the tutorial.

[@CodeCraks]

You are always welcome

[@sebastian.B0]

Thank u so much.Greetings from Romania!

[@quebirt]

Any tutorial that says "copy/paste the code." Thanks for that explanation. Now all anyone trying to learn this needs is code that they can copy/paste for whatever else they decide to do.

[@sjm8931]

I don't think you need a explanation how to import and use a dll to get round corners. It has nothing to do with this code here.

[@knowsomething-b8d]

Thank You for not wasting my time.

[@mufthiramzeen2669]

Congrats mishaal and faslam on 1k subs❤️

[@fanboyslol6579]

there growing fast!!!! its been 2 months and they gained 3k!

[@Tambourlas]

BRUHH THIS HAS EVERYTHING I NEEEEED THANK U SO MUCHH!

[@CodeCraks]

Its my job to teach you guys

[@CodeCraks]

What we do is we just load another windows form to the panel so when you select settings the setting form pops and the dashboard will unload from the panel

[@mkmellow]

@@CodeCraks should I use vsc 2015 or can I use 2019

[@CodeCraks]

You must use VS 2015

[@CodeCraks]

You can use it but, what I recommend is to use VS 2015

[@원종세-k4r]

Thanks for sharing this video. It made me come up with an impressive idea😁

[@DimDima09]

Wow! Its amazing! Thank you!

[@kevinmaingi2762]

Why you did this in winforms in 2020 is beyond me but kudos to you.

[@hd33444]

As someone new to ui, what would you recommend?

[@AdamSmitsOfficial]

@@hd33444 Nowadays, I would take a look at Electron if you want to create a fancy UI for native desktop applications.

[@hd33444]

@@AdamSmitsOfficial ok thanks, I'll check it out!

[@sketchygfx]

@@AdamSmitsOfficial isn't electron web dev specific?

[@AdamSmitsOfficial]

@@sketchygfx it is yes, nowadays web design is used a lot for desktop applications as well; for example spotify, discord and skype are all applications that are build using html5 and css within some kind of chromium wrapper / framework like electron.

[@jared_glez]

Woow, excelente, soy programador pero no soy nada bueno diseñando, eres sorprendente, gracias y saludos! Me suscribo 👌

[@nguyendangtienat1852]

if the user doesn't press the "dashboard" button at first, there will be a bug: the background color of the "dashboard" button will not be changed when pressing other buttons until clicking it again. To fix this bug I think I should add 1 more statement on Click events of other buttons: tn_Dashboard.BackColor = Color.FromArgb(24, 30, 54);

[@marynelleaban3489]

you deserve a follow and like

[@futuresick100]

Thank you for the great tutorial. Subbed.

[@kapilpetkar1982]

Excellent video. Thank you

[@travishill3002]

The buttons changing color when selected does not work correctly if you select one of the below buttons before you select Dashboard since that's the pages default button.

[@modyradwan1966]

Amazing work, thanks for this video.

[@snapperhead6256]

Fantastic! Thank you!

[@alexandershubert573]

Awesome video - thank you indeed!

[@longo9021]

Thanks for the tutorials

[@sjm8931]

"Prograss" is nice :D. Nice, I know the manual very time-intensive way, but is there not a easier way to do that (import a style)?

[@stoneyustone]

Great video! Very intuitive! But do you think maybe WPF is a better approach to develop a dashboard?

[@stoneyustone]

Just to check if you wanna make videos about WPF in the future.

[@CodeCraks]

Yeah WPF is more customizable and used nowadays. Although WinForms is declared dead, it can be used for developing UI based applications quickly. WPF is a good approach. Maybe I'll try it in the future. 🙂👍🏻

[@nathanurinovsky3819]

Thank you very much for this video, that was very helpful.

[@aynaoutnt1105]

super cool video!!! i just wanna you to know that I can't open the link for the pictures can you help me???

[@jeffhaley9494]

Thank you. Subscribed.

[@argentmize]

WOwow! WinForms in 2020? 🤔

[@timothyb519]

Thanks so much for that - looks really good. Would there be follow-up videos to expand on the functionality - window sizing, themes etc?

[@CodeCraks]

Yeah, we are deciding to do a video with more customization using an open source UI framework.

[@mehmetcaloglu9409]

@@CodeCraks can ı make windows 10 mobile app like tihs?

[@ajaxbetter]

@@mehmetcaloglu9409 windows 10 mobile??

[@mehmetcaloglu9409]

@@ajaxbetter yeahh 🤙

[@novagames5719]

@@mehmetcaloglu9409 mobile app??

[@AlainMazy]

Thanks for this demo, i have a question, it's possible to export this application on internet like a website?

[@Светик-ш6б]

first of all thank you very much you saved my project bro! i have 2 questions either, how can i pull the window with Formborderstyle on none and how can i resize is manually? THX very much!

[@ahmadrezanavaie5382]

I like your videos creation may i ask which AI voice generator do you use for narriation?

[@GarGlingT]

Many untitled ui look so good.

[@dsedchenko]

I would recommend you to use WPF instead. Windows Forms doesn't support GPU rendering, and uses CPU. It impacts performance.

[@arss2382]

I know at least one third-party vendor uses DirectDraw hardware rendering for WinForm controls. I checked performance - faster than in WPF.

[@テッラリア]

You could create one onClick method for all buttons instead of making events for each button. Then using event args you can check what button was clicked and perform the corresponding action. Great design btw.

[@CodeCraks]

Can but most of my viewers are new to programming so it might me be bit harder to understand for them

[@upprrdimensions892]

@@CodeCraks Too Right

[@SaraSara-fr7go]

how to create one onClick method for all buttons

[@happinin]

@@SaraSara-fr7go put a second parameter in the onclick function. the action performed is depending on that parameter value and each different button adds a different parameter value. that goes to a switch statement and then performs the corresponding action.

[@stevennicholas5472]

@@SaraSara-fr7go Just cast the sender object to a button. ((Button)sender).Top etc.

[@bloodlinegaming9962]

the tutorial seems good, any reason bitdefender is detecting your download as a virus?

[@baxxmW]

Hey! This really helped me and I thank you so much for it. One question though, How can I edit the other tabs, like the calender and settings? Im kinda new to this. Thanks!

[@CodeCraks]

Watch our Part 2 on this video for that

[@baxxmW]

@@CodeCraks alright. Thank you so much!

[@hitendusseja6615]

Thanks alot bro...All I needed in a much simpler way

[@WhiskeySins]

Me, has only dabbled in python and looking at C# instead. Has never until tonight wondered how to make UI. Also me while watching this "Sure, I could probably make an entire app for work."

[@superadi2774]

Thank you! You use vs 2015, will this work on vs 2022 too?

[@cookiez999_]

@Svawes for me doesnt work

[@kavindulakmalw]

excellent video.keep it up.

[@chadheitman3646]

Thank you for the video, I learned a lot! I am wondering though, I noticed typed the values for your different visuals like “downloads” or “earnings” in yourself.. is it possible to pull values or variables from a database.. so as they change over time my dashboard would change? I am trying to find a front end for a financial database I made with python and Postgres (without learning js right now) I’m new to programming / development! Thanks again

[@connoisseurofcookies2047]

There are three things in life that are inevitable, death, taxes and Javascript. Can't avoid it but at least the syntax is easy.

[@chadheitman3646]

@@connoisseurofcookies2047 I am realizing this truth, thank you lol.

[@45i1C3D]

You can! Say, I want to change the text of a Label object with the name label1 All I need to write in the code is "label1.Text = "SomeTextHere";" And thats pretty much it! this can be called from a function as well

[@9kongkawee]

WOwww. Good jobs.

[@DavidGTech]

Thanks you bro. C# is rare

[@jcaique7]

Thank you, very good!

[@Amocles]

Lot of parts of the GUI are not showing up properly when I have my windows set to 300% scaling. Is there a way to get this to play nicely with various DPI, resolution, and scaling settings?

[@MXNUUUSH]

The rgb color is separated by semicolons ( ; )

[@DavidGTech]

Yeahhh,

[@jonashellsborn7648]

That is likely to depend on National settings. You likely have comma as decimal character. It's a common silly twap.

[@lemoviehacker4856]

Hi, Can you make publish those picture? I liked your video but I dont have any picture of it

[@SedanurKrc]

yes it's really usefull thanks ....

[@grylionxdj]

thank you so much !!!

[@lucaliuk7877]

Hi, which version of dotnet did you use? Thanks

[@ishakmco3186]

Thnaks ❤❤ But why dont use sender in 10:25

[@kagoTshabota]

Been crying about Flash apps (Action Script3) being discontinued. Now I see there's hope in Visual studio and C#.

[@Dinkleberg950]

do you have more of these blue images?

[@bob0124]

Don't go to the website. it has malicious content

[@omniphantombusiness9070]

Thank you so much for this, also how can I add a file such as a batch file that they can run by pressing a button it will set up their pc for them but how do I run it by them pressing a button that says "setup"

[@jayymovinfr]

i know im kinda late to this, but all you would do is write System.Diagnostics.Process.Start("yourbatname");

[@agahariiswarajati8836]

4:41 Have you a video tutorial how to add new font? Nirmala..its awesome, nice video tutorial btw, i follow it and i've use for my project, thx

[@ad4m874]

Hi! Can you show us how to display real account username on the top left when registered with the auth system you have posted on youtube?

[@ad4m874]

with "auth system" i mean the last video you've posted

[@CodeCraks]

Ya it's pretty easy. You just save the username in a public variable and just call it in the dashboard and display it in a label

[@ad4m874]

@@CodeCraks ok thanks

[@ad4m874]

@@CodeCraks can you also check your instagram please?

[@CodeCraks]

Ya sure

[@hamzamuhammed3]

how can you show different information on the from depending on which button is clicked?

[@alekxsander]

liked and subscribed, thanks for the code!

[@prashantmishra5691]

subbed, need more ui vids

[@CodeCraks]

Sure. More videos Coming soon

[@merrypaul6630]

i love your work so much i understand every single thing may God continue to bless u pls can you make a Tutorial for App design from scratch ? plsss

[@CodeCraks]

Ya sure in the near future

[@MrAnime-404]

Hey, I have a question. How do you bring back the drag and drop feature since the little thing on the top is missing? I want to make my application look more modern but also have the ability to move it around the window using drag and drop.

[@eonshade6297]

This looks amazing.

[@nitinkumar29]

I've downloaded the source code file and automatic windows scan find it a ransomware and automatically deletes it :(

[@CodeCraks]

Every source code has been scanned and uploaded. I guess windows blocks the file because it came from an external source. It keeps you away from executing the program.

[@ethiohealthtips639]

Would you please create a customizable Blog with template or from scratch??🙏

[@CodeCraks]

I will try my best

[@ethiohealthtips639]

@@CodeCraks Thank you 🙏

[@fatimazahrafadili8884]

Great work, please I need a codesource thank youuu

[@bakg8979]

how about a close and minimize button?

[@alexwang7557]

With the Circular Progress Bar control, you can certainly make it show something, but do you have or can you recommend a control or NuGet package that can make real nice good looking graphs?

[@Suspect.]

siticone DESKTOP UP

[@nakorns320]

Thank you for your video

[@hacistein]

12:05 when i write location as 20,17 its putting on top left on the screen, im sure putting on Form1 not on left panel, but still putting on wrong place, how u seperate 2 panel to this form and counting x=0 as left side of the right panel ? will u put another panel not showing in video ? like panel4 ?

[@77558]

The download link of the project files on the homepage links to a wrong file: It downloads the resource-pack (icons) like the other download-link does. But thanks anyway! I wonder, if it is possible to make scrollbars dark, tiny and rounded the same way -using no external packages.

[@emperorj4783]

The download link is for those stuff

[@sayedbalal541]

how can i make this functional now like how do we put the code to operate the interface based on the data we feed it

[@hacistein]

Hi, can i ask about vs or vs code. Im already used both 2 years ago (now im doing react in vs code) i need c# for 1 project and im not sure wichone i will start? what do you think about between them good for "c# project" ? And your video is amazing by the way ^^

[@CodeCraks]

Actually sorry for the late reply by the way it depends on the project you handle

[@hacistein]

@@CodeCraks i choose vs19 + devexpress, its going good now, thnx for the answer 😃

[@rogerrickon3597]

Hello, Your tutorial has been great for learning Windows Forms and C#. I'm attempting to make an application like your example and have a question. If on one of the forms, I have a text box for user input and then leave that form, is there any way for the value that was entered into the textbox to still remain when I return to the original form? any help is appreciated. thanks.

[@stoneyustone]

I think saving the entered value in external files (such as xml or json) can do the job.

[@stoneyustone]

You'll have to write a Save() method and a Load() method. Once you leave the form, Save() is triggered. And Load() is triggered when you return to the original form.

[@stoneyustone]

I think my method is pretty cumbersome, maybe there are simpler methods.

[@CodeCraks]

Oh i will try it

[@rogerrickon3597]

@@CodeCraks any luck with this?

[@palinhas007]

Thanks for the teaching, where can I download the icons? Thank you.

[@CodeCraks]

I will drop them in a drive and give you the link

[@ИИванов-ь6с]

Pictures for this program are on the site Mega?

[@CodeCraks]

Yep

[@ИИванов-ь6с]

@@CodeCraks 👌

[@justplaygames7804]

hello can i put it in node red ui dashboard

[@cvcvka588]

Are these aligned dynamically or no?

[@alphaz964]

Hello. When I start my application I only get a white screen :c 11:24

[@nguyenxuanhoangvufplhn1446]

Sorry, but where can I download those mini icons? I tried the link in the description but I can't find the exactly icon in video

[@CodeCraks]

You can find them in the resources folder on the downloaded file

[@user-46gr7i5g]

Question: Why I can't enter the color directly in the properties just like the author (example: 46, 51, 73)? I can only choose from the color palette.

[@CodeCraks]

You can enter Any RGB color value. Example for white you can enter 255,255,255

[@user-46gr7i5g]

@@CodeCraks Thx for your answer. I found the problem. I don't know why, but i have to write it with ";". (255; 255; 255) .

[@kilgoretrout6810]

Whyyy have music in the background

[@fastchipgaming6637]

I am new in UI design and i want to develop UI only for desktop apps (Mac, Windows) i do know basic C# , i saw people using WPF ,but i don't know should i learn Xamarin or .NET Maui(upcoming) or any other tool which i can use to develop UI.

[@davidlester6673]

Wow! Do people still use WinForms!

[@CodeCraks]

Of course

[@igorthelight]

Nice video, thanks! I would just add this tip: install "Enhanced Syntax Highlighting" VS extension. Thank me later ;-) P.S. "Prograss" is a good movement ;-)

[@jerardfox3036]

how you can set color in RGB for Form in 1:09?

[@omarmmf]

7:50 for the rounded corners

[@zanzajc7788]

Hi, is there anyway that I can edit the ui myself? If there is how, I'm pretty new to this sorry.

[@CodeCraks]

It's possible. You can edit it in the design view

[@zanzajc7788]

@@CodeCraks Oh, ok but how do I open it. Sorry again I'm pretty new to this so I don't know much. But thank you for the response 😃.

[@stuboy82]

Can you create these ui in the community version?

[@CodeCraks]

Yes

[@dj_xtee]

Please what type of visual studio are you using for this

[@CodeCraks]

VS 2015 Professional

[@zeidcezeyofficial]

System.Diagnostics.Process.Start(""); I want to run this command when i press a button to go to an url, but it gives me an error with 32 etc, can u help

[@TiPs-zx8bn]

D11ImprtAttibute not found error sir.how to solve it

[@pman272]

Randsomeware in download file!!!!!!!

[@med_pb]

where can i find the icons u used pls

[@CodeCraks]

You can get it in the project file

[@otherbomb1707]

I cant get the code file open? i have extracted it, even tried without extracing looked everywhere can't find it in the MEGA download.