How to Create a Modern Flat UI Design Dashboard in C# 2020
HTML-код
- Опубликовано: 16 май 2024
- Easy and free prototyping with Wondershare Mockitt: bit.ly/3qvIe8a
How to Make Modern Flat UI Design Dashboard in C# or material design application in c# windows form?
Need some ideas or a simple design to make a Dashboard in C#.
This clean design will even work with your programming Projects or Assignments.
This tutorial is suitable for beginners and advanced users too.
If you are new to programming and you are using IDE like Visual Studio to build software, This video has shown every works step by step.
Every System or application should have a clean and clear dashboard to display the statics and details, so you can practice or look at how things work out in this tutorial.
I made a simple design of a Dashboard, if you have more creative and logical ideas you can implement them with your own codes in the system.
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Downloads:
You Can Download the Project Files and the Resources from Our Site Link Below 👇
codecraks.com/blog/
Password : codecraks.com
SUBSCRIBE TO OUR CHANNEL FOR MORE TUTORIALS
/ @codecraks
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Related Videos:
How to Create a Modern Flat UI Design Dashboard in C# (Part 2)
• How to Create a Modern...
How to Add Circular progress bar to your Visual Studio's Toolbox: • How to Create a Splash...
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Related Tags:
Dashboard in c# without frameworks
windows form application c# tutorial for beginners
C# Dashboard
Dashboard in visual studio 2015
C#, Modern Flat UI Dashboard Windows Form Visual Studio
Inspiration Modern Design UI C#
Design Dashboard
C# UI Design Dashboard
Design Dashboard in C#
C# - Designing Dashboard Form
Dashboard in WinForm App
for Point of Sales in WinForm App
Flat Dashboard WinForm C# UI Design
Modern Dashboard Designing C# UI Design
Dashboard - Visual Studio | C#
How to Create a Modern Flat UI Design Dashboard in C#
c# ui design tutorial
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Video Section:
0:00 introduction
0:48 Basic Form Designing
1:19 Navigation Menu Designing
7:43 Basic Coding
8:39 Navigation Menu Coding
11:38 Dashboard Designing
20:36 Outro
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Follow Us
/ mishaal._.ahmd
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Support Us
Our Website: codecraks.com/
Email: contact@codecraks.com
Facebook: / iweb.makers.3
Instagram: / iwebmakers
LinkedIn: / iewb-make. .
If You Have Any Questions Comment us
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Music info:
Song: Ikson - Blue Sky (Vlog No Copyright Music)
Music promoted by Vlog No Copyright Music.
Video Link: • Ikson - Blue Sky (Vlog...
Song: MBB - Beach (Vlog No Copyright Music)
Music provided by Vlog No Copyright Music.
Video Link: • MBB - Beach (Vlog No C...
Other:
Infographic vector created by freepik - www.freepik.com: www.freepik.com/free-photos-v...
#programming #iwebmakers #visualstudio #dashboard #windowsform #UIdesign #howto #C# #codecraks 
Хобби
Great, quick tutorial with structure.
Love the design!
Now the name visual studio starting to make sense.
No. its jsut a random name
ye like dexter said its just a random name
java IDEs have the same drag and drop thing as well
@@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
@@b4tty thx for the info dud
@@b4tty that makes sense.
Woow, excelente, soy programador pero no soy nada bueno diseñando, eres sorprendente, gracias y saludos! Me suscribo 👌
Thanks for sharing this video. It made me come up with an impressive idea😁
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.
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
This video is also just old, low-quality stuff.
Thank you very much for this video, that was very helpful.
Amazing work, thanks for this video.
Thank you for the great tutorial. Subbed.
Great starting point for me, thanks for the tutorial.
You are always welcome
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!
Wow! Its amazing! Thank you!
Thanks for the tutorials
Very excellent tutorial for C# UI beginners !!! I will recommend this to my friends.
Thank a lot
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.
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!
Watch our Part 2 on this video for that
@@CodeCraks alright. Thank you so much!
Thanks so much for that - looks really good. Would there be follow-up videos to expand on the functionality - window sizing, themes etc?
Yeah, we are deciding to do a video with more customization using an open source UI framework.
@@CodeCraks can ı make windows 10 mobile app like tihs?
@@mehmetcaloglu9409 windows 10 mobile??
@@ajaxbetter yeahh 🤙
@@mehmetcaloglu9409 mobile app??
Thanks for this demo, i have a question, it's possible to export this application on internet like a website?
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?
siticone DESKTOP UP
how can you show different information on the from depending on which button is clicked?
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 ?
Are these aligned dynamically or no?
Thank you. Subscribed.
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
There are three things in life that are inevitable, death, taxes and Javascript. Can't avoid it but at least the syntax is easy.
@@connoisseurofcookies2047 I am realizing this truth, thank you lol.
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
Thank You for not wasting my time.
Thanks alot bro...All I needed in a much simpler way
Thank you, very good!
Hi, which version of dotnet did you use? Thanks
Congrats mishaal and faslam on 1k subs❤️
there growing fast!!!! its been 2 months and they gained 3k!
Excellent video. Thank you
Awesome video - thank you indeed!
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);
Thanks you bro. C# is rare
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!
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
@@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!
Sounds good
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.
the tutorial seems good, any reason bitdefender is detecting your download as a virus?
super cool video!!!
i just wanna you to know that I can't open the link for the pictures can you help me???
you deserve a follow and like
Fantastic! Thank you!
"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)?
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
Great video! Very intuitive! But do you think maybe WPF is a better approach to develop a dashboard?
Just to check if you wanna make videos about WPF in the future.
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. 🙂👍🏻
yes it's really usefull thanks ....
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.
The download link is for those stuff
This looks amazing.
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.
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.
I think saving the entered value in external files (such as xml or json) can do the job.
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.
I think my method is pretty cumbersome, maybe there are simpler methods.
Oh i will try it
@@CodeCraks any luck with this?
if my program is on java can I link them??
do you have more of these blue images?
Been crying about Flash apps (Action Script3) being discontinued. Now I see there's hope in Visual studio and C#.
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"
i know im kinda late to this, but all you would do is write System.Diagnostics.Process.Start("yourbatname");
in my project i made the menu at the top of the menu, when i start the program it doesnt work..
Hi, great job, thanks for sharing :) I just wonder, can this UI be applied for Arduino sensor monitoring or for ESP32/8266. To read data from usb port :)
Yes it can, but have a look at Thingsboard :)
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.
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.
thank you so much !!!
Hi, Can you make publish those picture? I liked your video but I dont have any picture of it
liked and subscribed, thanks for the code!
I've downloaded the source code file and automatic windows scan find it a ransomware and automatically deletes it :(
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.
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 ^^
Actually sorry for the late reply by the way it depends on the project you handle
@@CodeCraks i choose vs19 + devexpress, its going good now, thnx for the answer 😃
BRUHH THIS HAS EVERYTHING I NEEEEED THANK U SO MUCHH!
Its my job to teach you guys
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
@@CodeCraks should I use vsc 2015 or can I use 2019
You must use VS 2015
You can use it but, what I recommend is to use VS 2015
I am being Proud. Because You are From Sri Lanka.
Thank you 🙌
Keep watching our videos and Subscribe us 🙂
Can you make a script with a login and they can change it automatically?
Thank you so much :D like from me :D
excellent video.keep it up.
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
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.
Can but most of my viewers are new to programming so it might me be bit harder to understand for them
@@CodeCraks Too Right
how to create one onClick method for all buttons
@@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.
@@SaraSara-fr7go Just cast the sender object to a button. ((Button)sender).Top etc.
hey some one might help i want to change the backcolor to the value in the video but it give me hard time 43,51,71
Does this work in Visual Studio 2015?
Thank u so much.Greetings from Romania!
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
Many untitled ui look so good.
Thnaks ❤❤
But why dont use sender in 10:25
subbed, need more ui vids
Sure. More videos Coming soon
how you can set color in RGB for Form in 1:09?
hello can i put it in node red ui dashboard
Thank you! You use vs 2015, will this work on vs 2022 too?
@Svawes for me doesnt work
Hello. When I start my application I only get a white screen :c 11:24
how about a close and minimize button?
Hi, I have a question. When I was using the picturebox, I can only use the local resource to let the image display. If I import the image to the project resource file, the right side will add a .png file under the Resources but the image cannot display on the screen and I check the property of image which was still none. How can I resolve the problem? Thank you so much.
Check the picture size mode property in the picturebox and set it to Zoom
@@CodeCraks Thanks a lot.
Why you did this in winforms in 2020 is beyond me but kudos to you.
As someone new to ui, what would you recommend?
@@hd33444 Nowadays, I would take a look at Electron if you want to create a fancy UI for native desktop applications.
@@AdamSmitsOfficial ok thanks, I'll check it out!
@@AdamSmitsOfficial isn't electron web dev specific?
@@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.
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.
You can enter Any RGB color value.
Example for white you can enter
255,255,255
@@CodeCraks Thx for your answer. I found the problem. I don't know why, but i have to write it with ";". (255; 255; 255) .
Thank you for your video
thanks
couldnt download the files because my pc detected ransomware, how should I get the source files?
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
Ya sure in the near future
I would recommend you to use WPF instead. Windows Forms doesn't support GPU rendering, and uses CPU. It impacts performance.
I know at least one third-party vendor uses DirectDraw hardware rendering for WinForm controls. I checked performance - faster than in WPF.
I recently started using C# it reminds of html and CSS but better
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."
my anti virus detected threats in your files...
D11ImprtAttibute not found error sir.how to solve it
Please what type of visual studio are you using for this
VS 2015 Professional
where i find graphics?
Great work, please I need a codesource thank youuu
Awesome
Pretty cool~~!
The rgb color is separated by semicolons ( ; )
Yeahhh,
That is likely to depend on National settings. You likely have comma as decimal character. It's a common silly twap.
Isn't Forms a legacy technology anymore?
The resource download is corrupted
I have Runtime error D11Import is error line
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?
with "auth system" i mean the last video you've posted
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
@@CodeCraks ok thanks
@@CodeCraks can you also check your instagram please?
Ya sure
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 ;-)