C# WPF Modern UI Flat Design Tutorial

Поділитися
Вставка
  • Опубліковано 7 вер 2024
  • C# WPF Modern UI Flat Design Tutorial this tutorial will show you how to create a flat modern ui with a flat design using WPF and C# this goes really fast and it's stunning and beautiful and professional and works well for 2020 and 2021. This is a tutorial and the source code and the project files will be available for download.
    Patreon: / payloads

КОМЕНТАРІ • 190

  • @_buffer
    @_buffer  3 роки тому +10

    There is now an official Discord server!
    discord.gg/2RNRx73aDE

  • @noturbbyy6136
    @noturbbyy6136 3 роки тому +61

    This is possibly one of the shortest, simplest and most comprehensible examples in XAML I've ever seen. I've learnt a lot of stuff about XAML in this video! I sincerely hope that you'll keep making content :) Cheers!

    • @_buffer
      @_buffer  3 роки тому +3

      Thank you so much! I really do appreciate that! And I will, I have a couple of ideas boiling at the moment! :-)

  • @idperez720
    @idperez720 3 роки тому +16

    I'm not an English native speaker but I may say that your explanation was very easy to understand. Great video, thanks!!

    • @_buffer
      @_buffer  3 роки тому +1

      Thanks a bunch! I'm glad I could help! :-)

    • @idperez720
      @idperez720 3 роки тому

      @@_buffer Great video seriously, we need more like this XD. Greetings from Colombia!!

  • @patrick.1943
    @patrick.1943 3 роки тому +48

    This video is an example how every tutorial should look like. Everything is understandable and simple. thanks for the video ! :)

    • @_buffer
      @_buffer  3 роки тому +1

      Thank you so much for the kind words! I really do appreciate it! More videos coming! :-)

    • @CodeDisease
      @CodeDisease 3 роки тому

      I agree

    • @creeperskydiver
      @creeperskydiver 2 роки тому

      It’s too hard

  • @redditcamp543
    @redditcamp543 3 роки тому +8

    omg, finally an easy tutorial with a good-looking WPF in the end. THANK YOU, YOU ARE THE BEST!

  • @augustoge71
    @augustoge71 Рік тому +1

    I'm very happy with your sharing, dear @payload... You managed to summarize a month of WPF styling research, in just 20 minutes... congratulations!

  • @jasonlapp4559
    @jasonlapp4559 3 роки тому +30

    PERFECT SPEED!!!!

    • @nwdreamer
      @nwdreamer 3 роки тому

      I agree. I usually watch all of these type videos at 1.5x and only towards the end did I realize that this was running at 1x. More WPF videos please? 😁

  • @michaelhanson5773
    @michaelhanson5773 3 роки тому +4

    Just found your tutorials and having graduated before wpf was a thing and being pretty much self taught and knowing enough to just get things done, i find your tutorials better than most i have seen. I am still new to the MVVM process but your tutorials are helping me out greatly to try to understand what it is and how it works.

  • @simplewpf
    @simplewpf 3 роки тому +10

    Wie toll dieses Design aussieht und noch perfekt erklärt. Einfach Klasse!

    • @_buffer
      @_buffer  3 роки тому

      Thank you very much! :-)

  • @vinny6935
    @vinny6935 3 роки тому +2

    I'm experienced with C# but only vaguely familiar with WPF - I'm writing XAML for the Uno Platform and tutorials like this are awesome. Thank you!

    • @_buffer
      @_buffer  3 роки тому

      You're most welcome! :-)

  • @brandonberisford
    @brandonberisford 3 роки тому +3

    This is amazing. I work with WPF at my dayjob as well as personal applications. There's always new stuff to learn! I'm def going to apply some of these tips to my personal finance app I'm developing.

    • @_buffer
      @_buffer  3 роки тому

      That's awesome to hear! Best of luck with your project!

    • @brandonberisford
      @brandonberisford 3 роки тому +1

      @@_buffer Where did you find the art/icons for this project?

    • @_buffer
      @_buffer  3 роки тому

      @@brandonberisford All of them were found using Google search :-)

  • @breynerarleybernalrojas4497
    @breynerarleybernalrojas4497 9 місяців тому +1

    Amigo yo no sé muy bien inglés
    Pero te entendí casi todo
    Eres el mejor explicando WPF de UA-cam

  • @yaaqez
    @yaaqez 3 роки тому

    i‘ve actually just started using the wpf, but because of you i already feel like a pro, thanks a lot

  • @samanthalulica
    @samanthalulica 3 роки тому +8

    Wow, so cool and beautiful.

    • @_buffer
      @_buffer  3 роки тому

      Thank you so much! :-)

  • @robertomejia3124
    @robertomejia3124 3 роки тому +6

    really awesome!
    thanks a lot! greetings from Mazatlan, Sinaloa!

    • @_buffer
      @_buffer  3 роки тому

      You're most welcome!

  • @Worthical
    @Worthical 3 роки тому +6

    A little late but im glad i found this video legggoooooo!!!!

    • @_buffer
      @_buffer  3 роки тому

      Haha thank you sooo much!

  • @snotvlek4721
    @snotvlek4721 3 роки тому +2

    The idea is great, presentation is excellent, but you forgot to inform people that you can just put all your styles in the app.xaml, makes the page less cluttered. Also, you can put your default font, fontsize, foreground, background etc. in the tag.

    • @_buffer
      @_buffer  3 роки тому +2

      All good points, but if you look at it from a realistic point of view.. Most people are too lazy to care about separation, unfortunately. However! In the video that I'm working on right now I do implement all of that. :-)

    • @flipflap4673
      @flipflap4673 Рік тому

      @@_buffer that's like saying "I'm promoting being lazy because most people are lazy". Hmmm.

  • @Tayfaan
    @Tayfaan 3 роки тому +5

    Here before this guy reaches 1M.

    • @_buffer
      @_buffer  3 роки тому +1

      Haha you're too kind! If only! :D

  • @IonicMC
    @IonicMC Рік тому +1

    Your more underrated than i thought 😅 keep up the work

    • @_buffer
      @_buffer  Рік тому

      Thank you! I really do appreciate it :-)

  • @RODLEW22
    @RODLEW22 15 днів тому

    This video is very helpful and has given me a few clues to my issue. Do you have any videos where you add a style for a combobox with rounded corners. Every time I do it I get Issues where it doesn't work or it gives me unresolved resources. Thanks for your vids. They are inspiring.

  • @ccristian1715
    @ccristian1715 3 роки тому +3

    Always wondered how I can get rid of the basic looking default border and window bar. Never thought of the Window Style. Even if am more of a "backend" oriented person, this will help me improve my basic UI :D. Thanks!

    • @_buffer
      @_buffer  3 роки тому

      That's awesome! You're most welcome! :-)

    • @johndimelu1247
      @johndimelu1247 Рік тому

      @@_buffer Hey, first time making a WPF app, doing this do we lose the close, minimize, enlarge buttons/functionalities? If not, how can we incoporate them into our app?

  • @chillbro2275
    @chillbro2275 2 роки тому +1

    You're presentation was so cool. and the application looked cool!

    • @_buffer
      @_buffer  2 роки тому

      Thank you so much! It's very appreciated!

    • @chillbro2275
      @chillbro2275 2 роки тому

      @@_buffer You're welcome! You presented things I never thought about, and never knew about like getting rid of the standard title bar. I went full anime when i saw that "usooo!"

  • @m3xpl4y
    @m3xpl4y 3 роки тому +2

    love your videos and the way you explain - please keep on doing videos

    • @_buffer
      @_buffer  3 роки тому

      Thank you so much! I will! :-)

  • @exosdel
    @exosdel 3 роки тому +3

    Great video, I´m hoping for more WPF content!

    • @_buffer
      @_buffer  3 роки тому

      I'm working on one right now that I think you will love!

  • @tobiti34
    @tobiti34 3 роки тому +4

    Love your videos dude keep it up!

    • @_buffer
      @_buffer  3 роки тому

      Thank you so much! :D

  • @brain9961
    @brain9961 3 роки тому +1

    Underrated

    • @_buffer
      @_buffer  3 роки тому

      Thank you so so much! :-)

  • @Tsachyl
    @Tsachyl 3 роки тому +1

    This ain't a tutorial - it is a fast show off!

    • @_buffer
      @_buffer  3 роки тому +1

      Spoonfeeding for 20 minutes straight.
      Call it what you want :-)

  • @GuildOfCalamity
    @GuildOfCalamity 3 роки тому

    These are fantastic tutorial videos! More please!

  • @user-fh3sr2lr2x
    @user-fh3sr2lr2x 3 роки тому

    This video gave me very nice lessons about WPF. Thanks~

  • @jvargas623
    @jvargas623 3 роки тому +8

    This was just perfect! Found some inspiration on this :D Btw, I'd love if you show how to deal with resizeable borderless windows (which are my headache) :)

    • @_buffer
      @_buffer  3 роки тому +1

      Thank you so much! I really do appreciate that! :-)

  • @rashininilukshi5103
    @rashininilukshi5103 3 роки тому

    Thank you very much for the video. You are the savior. Was very helpful for me!

  • @mjdev-i1p
    @mjdev-i1p 3 роки тому

    your videos and your coding style are Amazing!

  • @Samir-50082
    @Samir-50082 3 місяці тому +2

    Nice tutorials, but do you think about to start a course for example on Udemy. That would be nice.

    • @_buffer
      @_buffer  3 місяці тому

      Thank you! I've been considering it actually :-)

  • @oprd13
    @oprd13 3 роки тому +1

    Sick, so nice easily explained. Thanks

  • @syth-1
    @syth-1 3 роки тому

    I looked at xaml in the past and brushed it off after seeing some very daunting tutorials - having new Gained interest in learning it and ow boy - this looks much much easier than the beast I remember
    Thanks for the great tutorial - guess best way to start is actually making a start now

  • @isiahjones_33
    @isiahjones_33 3 роки тому +1

    Love it! More video please.

    • @_buffer
      @_buffer  3 роки тому

      Thank you! More coming! :-)

  • @madhuchin
    @madhuchin 2 роки тому

    Excellent tutorial and explained in simple manner. Only some codes need to be changed for UWP

  • @alifaezian4982
    @alifaezian4982 3 роки тому

    That was cool. Pls make more wpf tutorials.😍

  • @henriqueselau2987
    @henriqueselau2987 3 роки тому +4

    who are you and where did you come from?! Your videos are AWESOME! Great job!

    • @_buffer
      @_buffer  3 роки тому +1

      Haha thank you so much! I really do appreciate it! More awesome content on the way! :-)

    • @_buffer
      @_buffer  3 роки тому

      @deuxmsxs Sure! That would be a fun project!

  • @notvegy
    @notvegy 3 роки тому +1

    Can someone help me? I wanna do a Picture as Button Value (like he did with color on 10:23 ) to make a custom Picture if I hover over the Button (like he did in 11:00 with color)

  • @DaLadnoWhat
    @DaLadnoWhat Рік тому +1

    Thank bro…🙂 very nice

    • @_buffer
      @_buffer  Рік тому

      You're most welcome!

  • @user-fr7lq3no3m
    @user-fr7lq3no3m 2 роки тому

    Amazing project more like that please!

  • @avenger6038
    @avenger6038 3 роки тому

    very nice and easy thank you bro i hope you upload the projects when you done from Tutorial

  • @LisaLiel
    @LisaLiel 4 місяці тому +1

    Okay, I have to know. How do you do the colors? Do you have a chart or something that you reference? Or do you just know what they're going to be like according to the hex numbers?

    • @_buffer
      @_buffer  3 місяці тому

      Good question! It's a rough "guestimate" composed off of on the RGB values :-)

  • @nihalbayoglu9560
    @nihalbayoglu9560 Рік тому

    That's great! Keep it up, please 🙌

  • @angeldepaz6407
    @angeldepaz6407 Рік тому

    Absolutely amazing

  • @owen6571
    @owen6571 2 роки тому +1

    This tutorial is soo good

    • @_buffer
      @_buffer  2 роки тому

      Thank you so much Owen! :-)

  • @diopistacchio5037
    @diopistacchio5037 3 роки тому +2

    Great video 😉💪

    • @_buffer
      @_buffer  3 роки тому

      Thank you so much! :-)

  • @idittaibi1757
    @idittaibi1757 2 роки тому

    Beautiful idea!

  • @elementiro
    @elementiro 3 роки тому

    I would've put styles into the window's (or even app's) resource dictionary since you're reusing them many times but nevertheless the result looks nice.

  • @collinsk8754
    @collinsk8754 2 роки тому

    Great tutorial!

  • @m3xpl4y
    @m3xpl4y 3 роки тому +1

    Hi, could you make a video for WPF, how from a RichTextBox to save and load data from MySQL (formatted Text)?

  • @cockswell9076
    @cockswell9076 3 роки тому +1

    very cool design

    • @_buffer
      @_buffer  3 роки тому

      Thank you! :-)

  • @feign.8468
    @feign.8468 3 роки тому +1

    Nice work!

    • @_buffer
      @_buffer  3 роки тому +1

      Thank you! :-)

  • @aathifmahir
    @aathifmahir 3 роки тому

    Would love to see these kind of UI design using WinUI 3 win32 and Project Reunion app

  • @jaredmartinez04
    @jaredmartinez04 2 роки тому

    This is Gold! Thank you!!

    • @_buffer
      @_buffer  2 роки тому +1

      You're most welcome! :-)

  • @TheRealVinny2020
    @TheRealVinny2020 3 роки тому

    Great tutorial on customizing WPF. Thanks!

  • @lu_latsch
    @lu_latsch 3 роки тому +1

    Pretty nice!
    I am currently coding some similar windows and it makes so much fun.
    PS: Which PC/laptop do you use? The performace when starting the debugger looks pretty fast.

    • @_buffer
      @_buffer  3 роки тому +1

      That's great! I'm glad you're enjoying it!
      I'm currently running a desktop computer which has a Ryzen 3700x, 16GB RAM overclocked to 3800MHz, that should be the core which makes it compile so fast :-)

  • @humanbot5247
    @humanbot5247 3 роки тому

    Simply..WOW

  • @hmotwell
    @hmotwell 2 роки тому

    really good video by some1 I can understand!
    Just quit having some1 time u... & slow down some ;)

  • @Abner.mp4
    @Abner.mp4 3 роки тому +2

    how can i move between form to form since the menu? do you have a toturial like i ask?

    • @_buffer
      @_buffer  3 роки тому +3

      That's actually coming up in the next video! :-)

  • @michaelhanson5773
    @michaelhanson5773 3 роки тому +2

    quick question... where and how exactly do you implement your close buttons for the app since you do a WindowStyle=None you have no title bar so it doesn't have the normal "X" for close. Also you cannot move the window around by clicking it without adding a MouseDown event on the window to do the DragMove() right? Just wondering how you implement things like Close and repositioning the window in your apps that don't have the default windowStyle turned on.

    • @_buffer
      @_buffer  3 роки тому

      Hey! Very good questions!
      You're right by thinking that you can't move the windows around or close it due to the WindowStyle being set to none, but you can implement something like `App.Current.Window.Close()` Essentially getting the current windows that you're working with and then invoking "Close". As for moving it around you can databind to an event such as MouseDown on any component and then implement, as you said "DragMove()". I hope this answer was helpful! :-)

    • @michaelhanson5773
      @michaelhanson5773 3 роки тому

      @@_buffer thanks.

  • @david-thang-coder
    @david-thang-coder 3 роки тому +1

    Thank you so much for teaching me. May you let me know why my WPF does not have property name ConnerRadius? Thanks a million.

    • @_buffer
      @_buffer  3 роки тому +1

      Set the TargetType :-)

    • @david-thang-coder
      @david-thang-coder 3 роки тому

      @@_buffer I know the reason, I was mistyping "C o n n er" in stead of "C o r n e r". Thanks a lot!

  • @deianmihai8038
    @deianmihai8038 3 роки тому

    Gold video

  • @MathiasBesil
    @MathiasBesil 3 роки тому

    Hi, i have a problem, because the top bar have mouse event, then the child button at the right "Start" dont invoque the left mouse event, how can i fix this ? thanks

  • @danielmelendrez1616
    @danielmelendrez1616 3 роки тому +1

    Very noice!

    • @_buffer
      @_buffer  3 роки тому +1

      Thank you Daniel! :-)

  • @Peekcasso
    @Peekcasso 3 роки тому

    Is there a simple way to change in between pages? I have a Start Page where I can choose login or register. And after changing to the Login page I cant change to the next page which would be the Home page.

  • @CanadianMang
    @CanadianMang 2 роки тому

    I did exactly what you did for importing font and still will not work.

  • @mydronesamadvanes7854
    @mydronesamadvanes7854 2 роки тому +1

    StackPanel = StackLayout in Xamarin?

  • @8d38
    @8d38 3 роки тому +1

    Do u have a discord or something because I need help

  • @sornanunsipkhea463
    @sornanunsipkhea463 3 роки тому

    Very nice design and coding. but too fast for me :) lol. Thanks.

  • @josbexerr5166
    @josbexerr5166 3 роки тому

    Excelente mister Binary

  • @richardschofield2201
    @richardschofield2201 3 роки тому +2

    Great video.
    As someone new to WPF my first impression is it's quite a wasteful language.
    All that copying and pasting for buttons.
    If you want to change a style you then need to change each and every one of them.
    Is it not possible to set up global styles and have your buttons inherit them?

    • @_buffer
      @_buffer  3 роки тому

      That is possible yeah, check out my most recent video where I'm setting the button style explicitly, you can even make it so that ALL buttons have a specific style :-)

    • @richardschofield2201
      @richardschofield2201 3 роки тому

      @@_buffer awesome, thanks

  • @andrejfellinger8783
    @andrejfellinger8783 3 роки тому

    Can i somehow do that grid or idk how to call it (i mean that lines, borders your window...) So, can i use it using designer if yes how?

  • @MrDeylann
    @MrDeylann 3 роки тому

    More on tutorial like MVVM, integration for API

  • @zairiaimen6004
    @zairiaimen6004 3 роки тому +1

    Is there any difference between using the .net framework wpf and the .net core one?

  • @zehsofficial
    @zehsofficial 3 роки тому

    Using custom fonts doesn't work for me

  • @medicallyunexplainedsymptoms
    @medicallyunexplainedsymptoms 3 роки тому

    Interesting video, but Why do you keep saying "hashtag" as if you were using Twitter? It's just "hash". For the RGB values, the # means hexadecimal (or 'hex' for short).

  • @mrshroomas
    @mrshroomas 3 роки тому +1

    Hey, i need some help, so on the Button.Style you wrote the setter property "Background" for some reason it doesn't work for me, can somebody help?

    • @_buffer
      @_buffer  3 роки тому +1

      I would have to take a look at the code, could you hatebin it?

    • @mrshroomas
      @mrshroomas 3 роки тому +1

      @@_buffer Hey it doesn't let me comment the link
      It just deletes the message when I reload my google

  • @raoi_
    @raoi_ 3 роки тому

    I removed the top thing of the window- now how do I move the window?

  • @fanjavadevrandria4014
    @fanjavadevrandria4014 2 роки тому +1

    where is the code source please, i don't view; Thanks!

    • @_buffer
      @_buffer  2 роки тому

      www.patreon.com/payloads

  • @isaac8228
    @isaac8228 2 роки тому

    how do i make it resizable while keeping the modern ui looks?

  • @raphaelflattinger3858
    @raphaelflattinger3858 3 роки тому

    Hey, where did you inspire the design?, from flattico?

  • @user-bi1ll1wy2m
    @user-bi1ll1wy2m 2 роки тому +1

    Awesome

    • @_buffer
      @_buffer  2 роки тому +1

      You're awesome!

  • @DXX48IO
    @DXX48IO 3 роки тому

    thank you)

  • @warrenbuckley3267
    @warrenbuckley3267 3 роки тому

    Are we allowed to use Google fonts like this? Are there any licensing issues?

  • @muhammadrizotoxtasinov8592
    @muhammadrizotoxtasinov8592 3 роки тому

    can we copy past it

  • @user-fr7lq3no3m
    @user-fr7lq3no3m 2 роки тому

    Wow!

  • @zn4a419
    @zn4a419 3 роки тому +1

    15:25

  • @perforator3000
    @perforator3000 3 роки тому

    how to bind command on a button on 13:00?

  • @ramlaaal
    @ramlaaal Рік тому

    can i do it in VS code

  • @thecybertrons222
    @thecybertrons222 2 роки тому

    Love❤❤

  • @manjeet2698
    @manjeet2698 2 роки тому

    is this .net core or .net framework?

  • @vtgame12
    @vtgame12 3 роки тому

    When I see the way of this coding, It looks like coding flutter in the C#

  • @rongerardvalero813
    @rongerardvalero813 3 роки тому

    Why do i find it hard to do task in WPF?

  • @colinfurrer7169
    @colinfurrer7169 3 роки тому

    We need new uploads BB!! :)

  • @thomastomtom2010
    @thomastomtom2010 3 роки тому

    Nice video! Nederlands?

  • @Johnny8117
    @Johnny8117 3 роки тому

    Send url pls on ur background!

  • @dogstar9455
    @dogstar9455 3 роки тому

    Hi. Did you use .net 5?

  • @elrymoe
    @elrymoe 3 роки тому +1

    Modern in Title, chooses to use Framework....

    • @souleymaneba9272
      @souleymaneba9272 2 роки тому

      Lol, I had the same thought. .NET framework is today legacy.

    • @okee
      @okee 2 роки тому

      I saw you in another video too complaining about the same thing lol. Did you find a good tutorial that uses Core instead?

    • @elrymoe
      @elrymoe 2 роки тому

      @@okee Sadly not