Everything you need to know about WinUI

Ryan Demopoulos, Microsoft; Miguel Ramos, Microsoft

Wednesday, 20 May 2020, 9:45 to 10:15 am EST

  1. What is WinUI and what can it do for you?
  2. 1992, MFC, OO framework for Native C++.
  3. 2002, WinForms, .NET Framework.
    1. Like MFC, wrapped common controls.
    2. Left MFC for native.
  4. 2006, WPF, .NET Framework.
    1. Good for desktop.
    2. Not everybody needed all of this power, so lots of people stayed on WinForms.
  5. 2012, UWP XAML (for Windows 8), Metro/Store apps, C++ & .NET.
    1. Most advanced, state of the art UI framework.
    2. Fluid
    3. More devices and inputs.
    4. Should have replaced all the old frameworks.
    5. Not exactly.
    6. Only works with UWP apps, which doesn’t help the previous models.
    7. MFC, WinForms, WPF are Desktop (Win32) Apps.
    8. UWP XAML is for UWP Apps.
  6. WinUI is the Windows UI Library.
  7. WinUI 2
    1. Shipped in Oct 2018.
    2. Used in UWP Apps.
    3. Includes all the latest Controls and Styles.
  8. WinUI 3 combines UWP XAML and WinUI 2
    1. Ships independently of the OS.
    2. Works in any type of app: desktop, UWP.
    3. WinUI 3 will provide a state-of-the-art UX framework for every Windows developer.
      1. Cutting edge fluent controls.
      2. Implemented in C++ for any app (Native or managed).
      3. Ships separately from the OS, so you choose when to upgrade.
      4. “A” UX framework, not “the” UX framework.
      5. You choose what you use, e.g. WPF, WinForms, MFC.
      6. It doesn’t replace the ones of the past, gives you a new choice.
      7. It’s the next version of UWP XAML.
  9. What’s coming?
    1. Feb: Refreshed alpha.
      1. Inlcudes WebView2.
    2. May 2020: WinUI 3 Preview 1.
    3. Jun 2020: WinUI 3 Preview 2.
  10. Demo: Miguel
    1. Install the WinUI 3 Project Templates extension from VS.
    2. WinUI 3 with .NET 5.
    3. Microsoft.WinUI NuGet package.
    4. C# 8.
    5. Folder Inspector app (.NET Desktop WinUI 3 app)
    6. No security sandbox!
    7. It’s calling Win32 APIs!
    8. Using C++ 17!
  11. https://aka.ms/winui
  12. WinUI 3 Preview 1 Customer Highlight: esri demo
  13. Uno Platform is exploring using WinUI 3.
  14. React Native is also.
  15. chorus Encore is an example app using WinUI to help people with autism
    1. Showed a video.
  16. I OCR’d the following text out of the above image using the OCR code sample from https://github.com/microsoft/Windows-universal-samples/tree/master/Samples/OCR.
  17.  WinUI
    1. Website: https://aka.ms/winui
    2. Community Call: https://aka.ms/winui/maycall
    3. Preview 1 Notes: https://aka.ms/winui3/preview1
    4. GitHub: https://aka.ms/winui/github
    5. Preview 1 Blog: https://aka.ms/winui3/preview1blog
    6. XAML Controls Gallery (XAML Controls Gallery app): https://aka.ms/xamlcontrolsgallery
      1. Last updated for WinUI 2.2 as of 20 May 2020.
  18. Community
    1. #win-ui on Discord! https://aka.ms/winui/discord
    2. Uno Platform: https://platform.uno/
    3. Uno CH9 app: https://github.com/unoplatform/Uno.Ch9
    4. Telerik UI for WinUI: https://www.telerik.com/winui
    5. WCT using Preview 1 (Windows Community Toolkit): https://aka.ms/wct-winui3
  19. Related Sessions
    1. Live: Unifying & evolving the Windows app platform
      1. Paul Gusmorino, Jesse Bishop | INT111
        1. Tues May 19 2:45 PM-3:15 PM PDT https://aka.ms/M365INT111A
        2. Wed May 20 6:00 AM -6:30 AM PDT https://aka.ms/M365INT111B
        3. Wed May 20 11:00 PM-11:30 PM PDT https://aka.ms/M365INT111C
  20. Skilling Sessions
    1. WebView2: Bringing the best of the web to your native apps
      1. Limin Zhu | SK128 | https://aka.ms/M365sk128
    2. Fluent Design System – Building apps that feel natural on every device
      1. Paul Gildea, Chigusa Sansen | SK131 | https://aka.ms/M365sk131
    3. React Native: Build cross platform apps that target Windows, Mac, and more!
      1. Kiki Saintonge, Steven Moyes | SKI 19 | https://aka.ms/M365sk119
  21. Question: How do MAUI and WinUI relate?
    1. Answer: WinUI 3 is the native Windows framework.  Apps for Windows is WinUI.  MAUI is cross-platform.  Having conversations to overlay MAUI on WinUI 3.
  22. Question: Will any features of WinUI 3 be C++ only?
    1. Answer: No.  The Windows Community Toolkit will only work on .NET.  But they may integrate them back into WinUI.
  23. Question: Can you have different WinUI versions on the same computer?
    1. Answer: Cannot use multiple versions in the same app, but definitely on the same machine.
  24. Question: Will XAML islands be necessary.
    1. Answer: If your whole UI is WinUI, then no.  But if you’re using some WPF, etc., then yes.
  25. WinUI 3 is really the next version of UWP XAML.
    1. How do you convince someone to move to WinUI from WPF or WinForms?
  26. Question: Can you upgrade an MFC app or WinForms app to WinUI.
    1. Answer: Migration (slowly) is planned.  Separate your concerns using MVP or MVVM pattern to help.  WinUI + Islands will be ready in the future.
  27. https://aka.ms/winui/discord

Visual Studio 2019 (remote dev) tips & tricks

Mads Kristensen, Microsoft
Wednesday, 20 May 2020, 9:00 to 9:30 am EST

  1. How to work from home more effectively.
  2. Showing how to change VS 2019 pane layouts with keyboard shortcuts.
  3. Shift tabs to left-hand side so you get more vertical resolution for your code windows.
  4. You can also sort your tabs in different ways, e.g. alphabetically.
  5. If you have an under-powered PC, how can we help VS?
  6. Lots of projects loaded in your solution.
  7. The next time you open the solution, VS has to reload all that state.
  8. He changed options to not restore all that state.
    1. Rewatch to find where he changed those options.
  9. He switched to his web development window layout.
  10. Minimized tool windows are not loaded.
  11. “Reset Tool Windows” extension.
    1. Tools / Options / Startup / Reset Tool Windows
    2. Solution Explorer should be the only option you leave set to True.
    3. Visual Studio starts much faster.
  12. Clicked “Connect to Codespace” in the File menu.
  13. Opening a Git repo.
  14. Clicked “Create”.
  15. All of his updates in a local VS instance are available through the Codespace in the cloud.
  16. It will look exactly the same in both.
  17. He brought up Task Manager.
  18. Using 26% CPU.
    1. Screen sharing, broadcasting, VS, etc.
  19. He rebuilt the solution.
  20. His local machine is not affected because it’s all happening in the Codespace in the cloud!
  21. He can have multiple instances of VS running and it will have minimal impact on his machine.
  22. Some of these features are only available in the preview version of VS 2019, e.g. Codespaces.
  23. https://aka.ms/vsfutures-signup
  24. Enable preview features in Tools, Options.
  25. He install the New File extension as soon as he installs VS.
  26. Shift-F2 will create new files, will create types inferred from the name, e.g. IFoo will create an interface.
  27. Can directly type folder paths in the dialog.
  28. Watch Mads’ pre-recorded session for on-boarding a dev environment.
    1. Takes seconds!  “It’s bonkers.”
    2. “Modern development in VS 2019.”

Microsoft Edge

  1. See https://aka.ms/edge-at-build.

Modernize your Windows Server apps with containers

  1. 7:15 pm to 7:45 pm EST
  2. Taylor Brown (Speaker), Muzz Imam (Demos)
  3. App works fine, but stuck in an older app model.
    1. Rewrite the whole thing.
    2. Try a new deployment model.
    3. Rewrite parts of it.
  4. Containerize it.
    1. Use a registry.
    2. CI/CD
    3. Deploy to Kubernetes cluster.
  5. IBuySpy
    1. SQL Server
    2. IIS
  6. Create a Dockerfile
    1. Like writing down all the steps to deploy the app.
    2. MSBuild commands, etc.
  7. Demo: Windows Admin Center (WAC) makes managing your server workloads easier.
  8. Announcing an extension today to write your Dockerfile for you.
  9. Point it to your source code.
  10. Define some basic properties, e.g. .NET Framework version.
  11. You can run it from Windows Admin Center, Pull, Push, etc.
    1. Give it your Azure Subscription, where to push to, e.g. Azure Container Registry, etc.
  12. Question: the tool is focused on web apps right now, ASP.NET, etc.  Feedback will determine future capabilities.
  13. Question: can I modify the generated Dockerfile?  Yes!
  14. Question: what Windows Server versions does WAC support?
    1. Answer: Windows Server 2019 is the focus.
  15. Demo: Kubernetes
    1. Create Kubernetes cluster in the Azure portal.
    2. It has already created an agentpool on Linux (default).
    3. We need to create one for Windows.
    4. Network configuration: Select Advanced.
    5. AKS is going to create another resource group for you.
      1. Just be aware of this.
    6. Resources:
      1. SQL Server
      2. SQL Databasse
      3. Kubernetes Service
      4. Container Registry
      5. Virtual Network
    7. Connect AKS with ACR.
    8. AKS can then pull images from ACR.
    9. He’s using Az tools (Azure CLI) from a PowerShell prompt.
    10. Editing Kubernetes .yaml file in VS Code.
    11. kubectl apply -f .\ibuyspy-lm.yaml
    12. kubectl get all
    13. He showed the app running.
    14. Now what do you do?
    15. Monitoring.
    16. He can get IIS and Log Viewer logs in the Kubernetes portal blade.
      1. “Insights”
    17. He can upgrade the cluster from the portal.
  16. You can now add an ingress controller, i.e. like a router.
    1. This is a Linux container.
    2. Deploy it through Helm.
  17. Demo: Modernizing your apps.
    1. kubectl create namespace ingress-basic
    2. helm repo add stable https://kubernetes-charts.storage.googleapis.com/
    3. helm install nginx-ingress stable/nginx-ingress --namespace ingress-basic --set controller.replicaCount=2 --set controller.nodeSelect...
    4. kubectl get svc --all-namespaces
    5. You will get a 404 until you define routes between the components.
    6. Added a new sections to his .yaml file for the Ingress components.
    7. kubectl apply -f .\ibuyspy-n.yaml
    8. Browsed to his app again in the browser.
    9. Now he can perform A/B testing.
    10. Organizes your app easily.
  18. Support for Windows containers in AKS.
  19. Best practices and recommendations
  20. Question: Any plans to get Kubernetes running in Windows only?
    1. Answer: the community has aligned around Linux master and Windows worker model.
  21. Question: Support plan for GMSA (?)?
    1. Windows Authentication.

Scott Guthrie Keynote

  1. Solutions built with Azure.
  2. 61 Azure Regions now!
    1. More than AWS & Google combined.
    2. New DCs in Israel, Mexico, Spain, Poland, New Zealand.
  3. Helping with COVID-19.
  4. Amanda Silver joined, CVP for VS Family and Developer Tools.
  5. Donovan Brown
    1. Virtual Standup – Sunrise Standup app. (Is that the name?)
    2. Azure Static Webapp.
    3. Azure Functions.
    4. Sunrise app.
    5. Azure and GitHub work together using GitHub actions to create CI/CD pipelines.
    6. Every commit downloads, builds, tests code and deploys it to Azure.
    7. You can see Deployment history from the Azure portal as GitHub Actions.
    8. Amanda will add functionality to map with pins using Azure Static Webapp.
  6. Back to Amanda.
    1. She’s running locally with VS Code.
    2. Install Azure Static Webapp extension for VS Code.
    3. Lightning button lets you create an endpoint and it scaffolds out an Azure Function.
    4. You paste in your code.
    5. You can also launch Full Stack app in the menu, i.e. front end and back end.
    6. (I think she’s on a Mac)
    7. VS Code Pull Request extension.
  7. Back to Donovan.
    1. He saw the notification in Teams.
    2. Click on the link for the PR.
    3. Then he can see the code running in the staging environment.
    4. He wants to change the theme.
      1. He wants dark theme, not light theme.
    5. Codespaces turns web browsers into development environments.
    6. VS Code + Extensions + Libraries.
    7. “Color-customized version of Bulma” theme.
    8. Every machine is now a developer machine with Codespaces.
  8. Back to Amanda
    1. Announcing Azure Static Web Apps today.
  9. Jeff Hollan
    1. Azure Kubernetes Service.
    2. Lift and shift apps to Azure.
    3. Azure Private Link enables private communications for your Kubernetes apps.
    4. Cognitive Services
      1. Personalizer Apprentice Mode
      2. Speech Voice Styles – tailor the voice in your apps.
      3. Enhanced Container Support – GA for Text Analytics, General Understanding (?)
    5. httprepl
      1. Uses Swagger.
      2. Related to CosmosDB.
  10. Back to Scott.
    1. Talking about how Starbucks uses Microsoft technologies.
  11. Julia White (CVP Azure Marketing) and Gerri Martin-Flickinger (CTO Starbucks).
  12. Rohan Kumar, CVP Azure Data Engineering.
    1. Predictive Analytics and ML.
    2. Azure Synapse looks like it brings it all together.
    3. Azure Synapse Link is being announced today.

Load more