What's new with WinForms | .NET Conf 2023

[Music] hey guys I'm Mary mall and I'm here today to tell you a little bit about what's new in Windows forms and actually I'm going to give you even more history than just what we're doing in net 8 I'm going to give you some of the background and I'm going to give you some of the future of what we're looking at to build in the in the coming update so the first thing I want to do is bring up my deck and are we good with that so there we go I see it all right so a little bit of a history lesson or a walk down memory lane for those of you that may not know Wind forms as well as I do we have it as a it's a wrapper around the Wind 32 and common controls apis and these are kind of complex to write when you need to do it in C++ net 1.0 in wind form or and Wind forms itself they were born in 2002 as part of the first net visual studio and we were able to create kind of a really popular easy mechanism for building UI apps that looked and felt like the rest of Windows now NET Framework 2.0 was the next big release and it added so many things especially uh panels tool strips data menu strips datag grid views the whole nine yards in NET Framework 4.0 through 4.8.1 we saw continuing investment for example 4.0 we added the famous chart control and in 4.8.1 we added arm 64 support so we also invested in accessibility display scaling and the whole nine yards around 2000 or to this day Wind forms itself is the number one backbone of Enterprise apps people have been using it and investing in it for something like 20 years now it's a pretty important part of the ecosystem and when net core came around and didn't have a desktop solution they asked us hey do you want to get Wind forms up there so in 2019 we open sourced net frame wind fors on net core migrated to the net platform and we've been going strong ever since Wind forms in.net is full of so many things that we didn't have in NET Framework the first my most exciting part of it is that the community gets to participate and they get to drive features into the product we've been working on performance and rendering um as we're getting further along we're modernizing our C and our interop of course we want to stay up todate with the look and feel of windows so we're continuing to improve that look and feel near and dear to my heart is accessibility and we have a ton of accessibility improvements that we've been adding release over release over the next the last few releases and in net 6 we were able to incorporate the full VB application framework into visual studio for writing vb.net apps and we've been adding data binding and other features ever since now a lot of people think of Wind forms as a an old community that doesn't really do much but I encourage you to go to / winforms you're going to see a Vibrant Community with lots of people participating as we've been improving the look of feel of Wind forms the very first PR that was merged on stage live by Scott Hanselman thank you very much was the modernization of the folder browser dialogue which was actually really cool and I'll show you that in a moment we've also changed the default font in net we are making it look more well we're making it the system font of whatever version of window Windows you're on this could make some um layout challenges in the pixel for Pixel kind of ports that people want to do so I'll show you a way around that we just added in Net 7 the ability to have previews when you're dragging and dropping documents and content across your screen uh We've also been improving layout support and like rounded Corners snap layouts um all that modern Windows n Windows 11 sort of look and feel uh recently the system. drawing API set that was brought into the winforms repo because it is a managed wrapper around windows apis like GDI GDI plus and that sorts of thing as we did that we were able to now add some new access to the modern system icons that have a lot better scaling options than the old icons that we used to have in Wind forms so the first thing I want to do is take you on a whirlwind tour of some of the stuff that we've been most excited about adding inet so let me switch over to visual studio here and the first thing I wanted to show you is my visual studio installation I've got a tool strip up here notice I have it kind of large because that's one of the benefits of the new stock icons I'm going to show you and I got a couple of controls I know in demol land especially when you're doing a live demo whatever can go wrong will go wrong so I'm keeping this as uh simple as possible the first thing to show you then is instead of setting bitmap images here I am going to when the form loads I'm going to go ahead and bring in the system icon codes that we the stock icons that we added and you can take a look at it right here oops control one anyway you can take a look at it right there where we've got the get stock icons and in this case I did a folder and a media blank CD because I want to show the folder browser dialogue and I figured we'd have two would be better than none than just one so as we build the application it loads always takes a little bit on that first time and you can see the improved system drawing icons that are better you can also see the new text that we have in you know the new font size that we've got uh that we added so how about this how about I'm going to go back to my design here I'm going to go to the second button and I'm going to show you that first ever Community PR and it really is exactly the same code that you would have done in NET Framework net core one you know 3.0 3 one but instead of having just a single U Square Windows XP style of dialogue now what you get is and let me I put it into the wrong button but here's the folder browser dialogue and I'm able to go anywhere on the PC save the folder but this is the windows 11 looking feel of the folder browser dialogue now if I've got a a report that I'm wanting to do from NET Framework 4.8 or 4.8.1 to net core we're going to notice that font is very different and it will lay make layout problems in your application so we decided to add a default font application default font property to visual St uh toet so that we can come here into my demo and I'm going to say uh you don't want to watch watch me type so I'm just going to drag this in here I'm going to set the application default font to Comic Sans Ms and 18 I'm old school I've been doing Wind forms since it was invented and when I run the application you can see it was a One-Stop shop to change the default font pretty much everywhere in the application you can now basically if you want to do the pixel for Pixel parody of your NET Framework 4.1 app you can just change it to what the system icon used to be or the system uh font used to be in Windows in the previous versions so now I talked about Visual Basic a little bit ago and we still have a very popular crew doing visual Visual Basic so I want to come over here and bring up my Visual Basic demo and let's set that one as the startup project the first thing I want to do is when when visual when visual basic.net was added for for net core we didn't have any Visual Studio experience in net 6 we were able to add the visual studio experience with your old-fashioned property pages and when you do these property Pages if I scroll down to the application framework here you've got all the same kinds of properties that you used to set in NET Framework you've got things like high DPI mode which are new uh you can set it here or you can set it in application events talk about that in a moment and I think what I'm going to demo is my splash screen so I have a VB demo splash screen and I'm going to let it go for 2,000 milliseconds and I'm going to build that I do need to kind of tell Visual Studio this is what I intend to do we're working out the Kinks on reloading this but I'm going to go to Project unload the project and save it that way we reload it and go back to running it let's go back to the VB demo and hit run there's your net logo there's the wonderful exciting VB application that I created which wasn't all that exciting so next up if you want to do the the same font situation that you had in the the C side there are a couple of ways that you can do that we haven't wired that up into the property Pages just yet we're working on it that's part of the planned in upcoming releases but what we can do is go into the application events and Visual Basic users are pretty familiar with this what I will do is go to application events and I want to point out right up here at the top the new apply application defaults this is where we're able to apply whatever defaults we want want in addition to doing it in the property Pages now we also have the apply application default um in this case I am going to uh do the default font and oops that's not the one I wanted I'm going to say um e. font equals a new font and there's a real reason why you didn't want me to be typing today so font and that's going to be whoops have an extra parentheses there um so we'll make it comic Sam Comic Sans Ms and we'll make it 18 just like we had in my app and let me make sure that I have the right capitalization just in case it gets cranky and so when I run the application there's my splash screen again and there's my Comics SS Ms um default font there's a little bit of a difference between the way the C project system and the vb.net project system work and if I go back to my VB form you're not actually going to see that default font and the reason is because we defined it in application events and the application events don't actually all fire here in the V .n net uh design environment we do have however the ability to pop into your project file your SDK style project file and set your default font right there so I've got the application default font same comic sanss Ms and I do need to tell the project that we that we need to unload it and restart the server process I'll tell you about what that is in just a second but as soon as we do that and I bring up my VB demo form and it takes just a second to load you'll see that the project setting allowed my design tool server my visual studio server process to pick up the new font and then the event in the application events allows it to be picked up at runtime now the last thing I really want to show in Visual Basic was the biggest initial um contribution a feature driven in Net 5 from start to finish by the community we all are familiar with the old win forms dialogue uh message box dialogue and it has its purpose but I'm going to be honest it's a little bit um it's a little bit dated so here what I've got is some buttons I'm going to use the new Windows Vista style task dialogue and we've got the test dialogue show dialogue and I want it with a caption a heading some text I'll show you what that expander text is here in just a second a progress bar and that handful of buttons that I created and let me make sure that I've got the right demo that I'm launching there's my splash screen again and when I click the button this is the task dialogue style messaging and it can be made extra complex and you can do pages in there it can be like a wizard you have a variety of ways that you can configure this and it's just one of the cooler features that we've been able to put to in to net and into Wind forms over the years all right so now back to my PowerPoint what I want to talk about next is the visual studio experience you got a little bit of a taste of it but you literally can't separate Wind forms from its Visual Studio experience it's the that's the cool part about Wind forms is the drag and drop design now as you may know Visual Studio needs to run your initialized component code to be able to display in the designer and when we were you're running a Net Framework app that works fine because Visual Studio is a Net Framework process so we can run right inside the visual studio process but with net we can't do that it's a net runtime versus a Net Framework runtime so we had to split out the designer and you can see that in the in the image and we created a design tools server process that contained your net app that you're trying to design and that's so you could see things like the new default fonts the new icons everything that that doesn't exist in NET Framework that you want to be able to see in your net app this really was essentially a rewrite of a 20-year-old design system and so there's it's a journey and we're getting there we have created a new extensibility model so that you can write your own complex custom controls and design experience for those for those controls now one thing I really want to talk about before we we wrap this up today is DPI unaware designing and data binding so I need to go through both of those with DPI with designing a DPI unaware or designing within Visual Studio your coordinates when you drag and drop and you draw and create your design those coordinates are set by whatever your current primary monitor is and if I'm designing on this lovely little laptop the way it is today and my partner in crime goes and tries to design the same form on a different screen with different sizes and coordinates we wind up running into places where he's serializing different things than I am without really even changing much this causes both design time and runtime issues so this animation here you'll see when we clouse my partner in crime who wasn't able to make it today designed this application and he was able to get a user control when he was running at 125% scaling and it's got quite a few items on here me I design the same form I start working on it and I runtime I've now cut off several different lines of the application that's not what we want in NET Framework the answer was you either set your DPI on your monitor to 96 DPI go to 100% scaling or restart Visual Studio in 100% or DPI unaware mode that doesn't cut it and the main reason is because Visual Studio is the entire frame is in this DPI unaware blurry mode so I cannot wait to show you this feature that we've got in 17.8 uh that's available to you today it's called DPI unaware SK DPI unaware Tab and it lets us take that that design tool server and have the whole Tab in a DPI unaware mode now the the the animation here shows you why it's important for from a runtime I'll show you just kind of the code perspective of what what the benefits really are so let me go back to my second demo and this is a beautiful app that I designed at home on 100% monitor unfortunately this is at 125% scaling and if you look at the top I get this lovely little info bar that says you should try to go into DPI unaware mode so about it today if I'm not in DPI unaware mode and I'm just doing it the way I usually do I go to CH change this button text to be Mary button logically the only thing that should have changed in the diff is the text property of that very one that single button let me go to my G changes here however I'm going to go to the resource file because I did this as a localized application and I'm going to view the comparison with the unmodified and if you look I didn't just change the text property of the button somehow I wound up changing all of the sizes and coordinates of the different items that were in the table that is not what we want that's that's today's status quo and what we're doing now let me undo those changes and close these screens up here real quick I'm going to go into my solution Explorer I'm going to go to my project properties and I am going to add uh the force designer DPI and we're working on getting the um the tool tips or the work to come through here so that so that it's autocomplete but here we've got Force DPI designer DPI unaware set that to true I'm going to restart that server process because I want you to be able to see it and the safest way to restart that server process is to unload reload this is something you'll only do once in your application because you'll save that project file setting and now let me repeat the actions that I did before I'm going to go to the button I'm going to change the button's text to just new text and what we're hoping to see and if you really zoom in here and I can't um zoom in for you you'll see that the text in here is just a little bit blurry but the rest of Visual Studio screen all around the frame that's nice and easy to see now let me go back to my git changes and compare with unmodified and this is so cool the only thing that changed now is just the text of the button so what this allows you to do is everybody on your team can configure their machines however they want and it's just this one tab of the designer experience that needs to be in a um DPI unaware mode so that everybody's doing the same thing um this is brand new in net or in 17 8.1 we can do it for any net app but net 8 is the best way to go for that um I'm I can't tell you how excited I am about it so now let me go back to the PowerPoint because I've got just a couple minutes here to talk about command binding in win forms.net so this is new really technically in net 8 we had it as a preview feature in net7 to see what worked what didn't work uh we were able to make it enabled by default for net 8 it's about 25 new apis is uh that allow us to create bindable components and this is exciting because it allows us to create components which have always been really super highly customizable this is just an animation of a special kind of button that Claus put together that has a symbol property which is brand new it's not a normal tool strip item button but we can also if you have a view model like you might use in WPF winform or WPF wi ui.net Maui wherever else you might be working with your data you can now bind that to these components and you can do it with the same UI that you might be used to doing in when forms in general um the benefit is not just buttons and Tool strips or you know buttons and text boxes being bindable but the components are bindable too so now you've got your menu strip items and your tool strip items and you can truly separate your business logic from your UI stack so that you're able to have the same business logic in your net Maui app and an Android app as well as your winforms front end for the desktop scenarios and more than that you can also create bindings for commands which is super exciting here in net 9 and this is just a sneak peek we're going to round it out so that you have a full End to End Community mvvm toolkit support is we're going to add converters windform style in our in our UI in the designer so that you're able to do that endtoend sharing of business logic and separating it from the UI layer now the I had a demo here for accessibility I'm not going to have time to do it because I got so excited about the other stuff but accessibility is something that we are very very passionate about at Microsoft we want to make sure that it's that our apps are available for everyone and winforms was built on kind of an older stat for accessibility over the last several releases we've moved to UIA for most of our work and you can do whatever it is that you want my goal goal is that wind fors is accessible by default and we've got a tool accessibility insights for Windows that can help you take a look at your app and make sure you're doing things like keeping the contrast ratios proper and keeping the the tab orders right and having all the right naming available so the last thing I want to say today is that we are created we've created a survey to get your opinions about what we've done so far in winforms and.net and how your migration is going tell us what's working what's not working and give us that feedback so that's akam mswin forms feedback and anything you tell us we're really excited to hear about thank you so much

Channel: dotnet

Views: 28,911

Keywords: .NET

Id: N1weyWS_pL0

Length: 24min 47sec (1487 seconds)

Published: Fri Nov 17 2023