{"id":38773,"date":"2022-02-15T11:18:12","date_gmt":"2022-02-15T18:18:12","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/dotnet\/?p=38773"},"modified":"2022-02-16T13:20:00","modified_gmt":"2022-02-16T20:20:00","slug":"announcing-net-maui-preview-13","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/dotnet\/announcing-net-maui-preview-13\/","title":{"rendered":"Announcing .NET MAUI Preview 13"},"content":{"rendered":"<p>The 13th preview of .NET Multi-platform App UI is now available in Visual Studio 17.2 Preview 1. In addition to quality improvements, this release includes several implementations such as <code>Label.FormattedText<\/code> as we close in on feature complete for the upcoming release.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/dotnet\/wp-content\/uploads\/sites\/10\/2022\/02\/label-formattedtext.png\" alt=\"hero image showcasing these controls\" \/><\/p>\n<p>This entire page is a single <code>Label<\/code> control, mimicking the Windows font preview!<\/p>\n<pre><code class=\"language-xaml\">&lt;Label LineBreakMode=\"NoWrap\" LineHeight=\"1.4\"&gt;\r\n    &lt;Label.FormattedText&gt;\r\n        &lt;FormattedString&gt;\r\n            &lt;Span Text=\"Font name: Default &amp;#010;\"\/&gt;\r\n            &lt;Span Text=\"Version: 1.00  &amp;#010;\"\/&gt;\r\n            &lt;Span Text=\"Digitally Signed, TrueType Outlines &amp;#010;\"\/&gt;\r\n            &lt;Span Text=\"abcdefghijklmnopqrstuvwxyz \"\/&gt;\r\n            &lt;Span Text=\"abcdefghijklmnopqrstuvwxyz &amp;#010;\" TextTransform=\"Uppercase\"\/&gt;\r\n            &lt;Span Text=\"1234567890.:,;'+-*\/=  &amp;#010;\"\/&gt;\r\n            &lt;Span Text=\"12 The quick brown fox jumps over the lazy dog. 1234567890 &amp;#010;\" FontSize=\"12\"\/&gt;\r\n            &lt;Span Text=\"18 The quick brown fox jumps over the lazy dog. 1234567890 &amp;#010;\" FontSize=\"18\"\/&gt;\r\n            &lt;Span Text=\"24 The quick brown fox jumps over the lazy dog. 1234567890 &amp;#010;\" FontSize=\"24\"\/&gt;\r\n            &lt;Span Text=\"36 The quick brown fox jumps over the lazy dog. 1234567890 &amp;#010;\" FontSize=\"36\"\/&gt;\r\n            &lt;Span Text=\"48 The quick brown fox jumps over the lazy dog. 1234567890 &amp;#010;\" FontSize=\"48\"\/&gt;\r\n            &lt;Span Text=\"60 The quick brown fox jumps over the lazy dog. 1234567890 &amp;#010;\" FontSize=\"60\"\/&gt;\r\n            &lt;Span Text=\"72 The quick brown fox jumps over the lazy dog. 1234567890 \" FontSize=\"72\"\/&gt;\r\n        &lt;\/FormattedString&gt;\r\n    &lt;\/Label.FormattedText&gt;\r\n&lt;\/Label&gt;<\/code><\/pre>\n<p>Additional highlights include:  <\/p>\n<ul>\n<li><a href=\"https:\/\/docs.microsoft.com\/dotnet\/maui\/\">New .NET MAUI documentation<\/a> for many topics from XAML fundamentals and advanced topics, to bindable and attached properties, and RelativeLayout<\/li>\n<li><a href=\"https:\/\/docs.microsoft.com\/aspnet\/core\/blazor\/hybrid\">Documentation for building Blazor Hybrid apps<\/a> with .NET MAUI, WPF, and Windows Forms.<\/li>\n<li>Label.FormattedText (<a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/3637\">#3637<\/a>)<\/li>\n<li>ListView (<a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/3916\">#3916<\/a> <a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/3817\">#3817<\/a> <a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/4193\">#4193<\/a>)<\/li>\n<li>Performance &#8211; Remove MS.Extensions.Hosting (<a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/4505\">#4505<\/a>)<\/li>\n<li>RadioButton (<a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/3784\">#3784<\/a>)<\/li>\n<li>SwipeView (<a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/3987\">#3987<\/a> <a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/4064\">#4064<\/a> <a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/4026\">#4026<\/a>)<\/li>\n<li>WinUI Flyout (<a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/3735\">#3735<\/a>)<\/li>\n<li>WinUI TabbedPage (<a href=\"https:\/\/github.com\/dotnet\/maui\/pull\/4257\">#4257<\/a>)<\/li>\n<li>WebView: CanGoBack, CanGoForward, Eval, GoBack, GoForward, Reload<\/li>\n<\/ul>\n<p>Find more details in our <a href=\"https:\/\/github.com\/dotnet\/maui\/releases\/tag\/6.0.200-preview.13.2\">release notes<\/a>, and in the <a href=\"https:\/\/github.com\/dotnet\/maui\/wiki\/Migrating-to-Preview-13\" rel=\"noopener\" target=\"_blank\">migration guide<\/a>.<\/p>\n<p>One of the key .NET alignment inspired design decisions we&#8217;ve made in .NET MAUI is to adopt the Microsoft.Extensions builder pattern for bootstrapping applications.<\/p>\n<h2>Bootstrapping in .NET MAUI: Focus on MauiProgram<\/h2>\n<p>Through the course of our previews, we have heard loud and clear that you love the startup pattern in .NET MAUI. We&#8217;ve also made adjustments along the way to improve the developer experience, polish our usage, and collaborate with other .NET app model teams to arrive at a great solution for .NET MAUI developers. In this release, we&#8217;ve made another adjustment removing Microsoft.Extensions.Hosting in favor of a faster app startup time, specifically for Android. Let&#8217;s take a closer look at how a .NET MAUI app starts up each platform, and what all you can do to configure your app.<\/p>\n<h3>Platform App Classes<\/h3>\n<p>Every platform has its own native application class where you might do platform-specific setup. On Windows this is the <code>WinUIApplication<\/code>. Each of these applications will use &#8220;MauiProgram.cs&#8221; to create your <code>MauiApp<\/code>.<\/p>\n<pre><code class=\"language-csharp\">public partial class App : MauiWinUIApplication\r\n{\r\n    public App()\r\n    {\r\n        InitializeComponent();\r\n    }\r\n\r\n    protected override MauiApp CreateMauiApp() =&gt; MauiProgram.CreateMauiApp();\r\n}<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/dotnet\/wp-content\/uploads\/sites\/10\/2022\/02\/platform-classes.png\" alt=\"platforms folder with app classes\" \/><\/p>\n<p>Android has <code>MainApplication<\/code>, and iOS and macOS use <code>AppDelegate<\/code>. While you can put code here to do specific things, we recommend instead doing everything in <code>MauiProgram<\/code>. A barebones implementation looks like this:<\/p>\n<pre><code class=\"language-csharp\">namespace WeatherTwentyOne;\r\n\r\npublic static class MauiProgram\r\n{\r\n    public static MauiApp CreateMauiApp()\r\n    {\r\n        var builder = MauiApp.CreateBuilder();\r\n        builder\r\n            .UseMauiApp&lt;App&gt;();\r\n\r\n        return builder.Build();\r\n    }\r\n}<\/code><\/pre>\n<p>So what kind of work can you do here in the <code>CreateMauiApp<\/code> method? This is where you will:<\/p>\n<ul>\n<li><code>RegisterBlazorMauiWebView<\/code> &#8211; to enable this control and related services in your app<\/li>\n<li><code>ConfigureEffects<\/code> &#8211; to register <a href=\"https:\/\/docs.microsoft.com\/xamarin\/xamarin-forms\/app-fundamentals\/effects\/\">Xamarin.Forms Effects<\/a> in this .NET MAUI handler architecture<\/li>\n<li><code>ConfigureEssentials<\/code> &#8211; to perform Essentials related setup<\/li>\n<li><code>ConfigureFonts<\/code> &#8211; to register fonts with an alias<\/li>\n<li><code>ConfigureImageSources<\/code> &#8211; to override image sources in order to perform custom work such as filetype conversion<\/li>\n<li><code>ConfigureMauiHandlers<\/code> &#8211; set a custom handler as your implementation, or a 3rd-party option<\/li>\n<\/ul>\n<p>Let&#8217;s say you want to replace the platform-specific implementation of an Entry control with the Fluent Design <code>Entry<\/code> control from the <a href=\"https:\/\/github.com\/dotnet\/Microsoft.Maui.Graphics.Controls\/\" rel=\"noopener\" target=\"_blank\">Maui.Graphics.Controls project<\/a>. After including the NuGet package in your project, you can now configure controls to use an alternate handler implementation.<\/p>\n<pre><code class=\"language-csharp\">var builder = MauiApp.CreateBuilder();\r\n    builder\r\n        .UseMauiApp&lt;App&gt;()\r\n        .ConfigureMauiHandlers(handlers =&gt; {\r\n            handlers.AddHandler(typeof(Entry), typeof(Microsoft.Maui.Graphics.Controls.EntryHandler));\r\n        })<\/code><\/pre>\n<p>To make this even more convenient, library developers can provide custom builder extensions to do this for you. If I want all of my controls to render with Maui.Graphics.Controls for a Fluent implementation, I can use a convenient extension.<\/p>\n<pre><code class=\"language-csharp\">var builder = MauiApp.CreateBuilder();\r\n    builder\r\n        .UseMauiApp&lt;App&gt;()\r\n        .ConfigureGraphicsControls(DrawableType.Fluent)<\/code><\/pre>\n<h3>Dependency Injection<\/h3>\n<p>The MauiProgram is also where you will configure your DI container. The .NET Podcast app does a clean job of demonstrating this in action with extension methods. MauiProgram.cs looks like this:<\/p>\n<pre><code class=\"language-csharp\">public static MauiApp CreateMauiApp()\r\n{\r\n    var builder = MauiApp.CreateBuilder();\r\n    builder\r\n        .RegisterBlazorMauiWebView()\r\n        .UseMauiApp&lt;App&gt;()\r\n        .ConfigureEssentials()\r\n        .ConfigureServices()\r\n        .ConfigureViewModels()\r\n        .ConfigureFonts(fonts =&gt;\r\n        {\r\n            fonts.AddFont(\"Segoe-Ui-Bold.ttf\", \"SegoeUiBold\");\r\n            fonts.AddFont(\"Segoe-Ui-Regular.ttf\", \"SegoeUiRegular\");\r\n            fonts.AddFont(\"Segoe-Ui-Semibold.ttf\", \"SegoeUiSemibold\");\r\n            fonts.AddFont(\"Segoe-Ui-Semilight.ttf\", \"SegoeUiSemilight\");\r\n        });\r\n\r\n    Barrel.ApplicationId = \"dotnetpodcasts\";\r\n\r\n    return builder.Build();\r\n}<\/code><\/pre>\n<p>Digging into <code>ConfigureServices<\/code> we see setup the BlazorWebView control, singletons, transients, scoped dependencies, and even the HttpClient implementation. View the <a href=\"https:\/\/github.com\/microsoft\/dotnet-podcasts\/blob\/main\/src\/Mobile\/Services\/ServicesExtensions.cs\">source here<\/a>.<\/p>\n<blockquote>\n<p>Shell and DI &#8211; last release we featured the new constructor injection support when using Shell as your application navigation context. Until this issue is resolved, you will need to register your pages in addition to any injectables in order for the DI to succeed.<\/p>\n<\/blockquote>\n<h3>Platform Lifecycle Events<\/h3>\n<p>When you have need to do custom setup based on platform events, .NET MAUI provides lifecycle events right in your multi-targeted code. WinUI has a property to control if your content should extend into the title bar area or not. To access, you can do this:<\/p>\n<pre><code class=\"language-csharp\">builder.ConfigureLifecycleEvents(lifecycle =&gt; {\r\n#if WINDOWS\r\n    lifecycle\r\n        .AddWindows(windows =&gt;\r\n            windows.OnNativeMessage((app, args) =&gt; {\r\n                app.ExtendsContentIntoTitleBar = false;\r\n            }));\r\n#endif\r\n});<\/code><\/pre>\n<h3>Removing Hosting and Disabling Logging<\/h3>\n<p>It was identified that Microsoft.Extensions.Hosting was not needed in a .NET MAUI app, and removing it would improve Android app started by approximately 13% on a blank application. As you can see from the examples above, you can still do the most useful things with Hosting removed. Hosting was overhead we didn&#8217;t need. For more details on this change, Eric Erhardt has provided a <a href=\"https:\/\/github.com\/dotnet\/maui\/issues\/4393\">thorough write-up here<\/a>.<\/p>\n<p>Hand in hand with this change, we have also made the change to <a href=\"https:\/\/github.com\/dotnet\/maui\/issues\/4394\">disable logging for release builds<\/a>.<\/p>\n<h2>Get Started Today<\/h2>\n<p>.NET MAUI Preview 13 is bundled with Visual Studio 17.2 Preview 1 available today with the latest productivity improvements for .NET MAUI development. If you are using Visual Studio 2022 17.1 Preview 2 or newer, you can upgrade to 17.2 Preview 1.<\/p>\n<blockquote>\n<p>If you are upgrading from an earlier version, have been using <code>maui-check<\/code>, or run into installation problems, we recommend starting from a clean slate by <a href=\"https:\/\/docs.microsoft.com\/dotnet\/core\/install\/remove-runtime-sdk-versions?pivots=os-windows#uninstall-net\">uninstalling all .NET 6<\/a> previews and <a href=\"https:\/\/docs.microsoft.com\/visualstudio\/install\/uninstall-visual-studio?view=vs-2022\">Visual Studio 2022 previews<\/a>. Please report any issues through Help > Send Feedback<\/p>\n<\/blockquote>\n<p>Starting from scratch? Install this <a href=\"https:\/\/aka.ms\/vs2022preview\">Visual Studio 2022 Preview<\/a> (17.2 Preview 1) and confirm .NET MAUI (preview) is checked under the &#8220;Mobile Development with .NET workload&#8221;.<\/p>\n<p>Ready? Open Visual Studio 2022 and create a new project. Search for and select .NET MAUI.<\/p>\n<p>Preview 13 <a href=\"https:\/\/github.com\/dotnet\/maui\/releases\/tag\/6.0.200-preview.13.2\">release notes are on GitHub<\/a>. For additional information about getting started with .NET MAUI, refer to our <a href=\"https:\/\/docs.microsoft.com\/dotnet\/maui\/get-started\/installation\">documentation<\/a>.<\/p>\n<h2>Feedback Welcome<\/h2>\n<p>Please let us know about your experiences using .NET MAUI to create new applications by engaging with us on GitHub at <a href=\"https:\/\/github.com\/dotnet\/maui\">dotnet\/maui<\/a>.<\/p>\n<p>For a look at what is coming in future .NET 6 releases, visit our <a href=\"https:\/\/github.com\/dotnet\/maui\/wiki\/roadmap\">product roadmap<\/a>, and for a status of feature completeness visit our <a href=\"https:\/\/github.com\/dotnet\/maui\/wiki\/status\">status wiki<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>.NET MAUI Preview 13 has shipped with more controls, layout updates, and performance improvements.<\/p>\n","protected":false},"author":553,"featured_media":38774,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[685,7233],"tags":[7238],"class_list":["post-38773","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dotnet","category-maui","tag-net-maui"],"acf":[],"blog_post_summary":"<p>.NET MAUI Preview 13 has shipped with more controls, layout updates, and performance improvements.<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/posts\/38773","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/users\/553"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/comments?post=38773"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/posts\/38773\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/media\/38774"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/media?parent=38773"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/categories?post=38773"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/dotnet\/wp-json\/wp\/v2\/tags?post=38773"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}