Welcome to Sands of MAUI, a newsletter that brings together the latest .NET MAUI content relevant to developers.
Sand particles—small and harmless. But when you put a lot of sand particles together, something big—something big enough to fight back. The smallest grains of sand come together to form huge beaches, dunes, and deserts.
.NET developers are excited about the reality of .NET Multiplatform App UI (.NET MAUI), the latest evolution of the .NET cross-platform developer technology stack. With robust tooling and a rich ecosystem, .NET MAUI brings web technologies into the mix while enabling developers to build native cross-platform apps for mobile and desktop from a single shared codebase.
It may be a long flight to the sandy beaches of MAUI, but developers can feel the excitement for .NET MAUI with all the content they create. Like a grain of sand, every news/article/article/video/tutorial/livestream contributes to the developer experience on .NET MAUI, and we grow a community/ecosystem that is willing to learn and help.
Sands of MAUI is a humble attempt to bring together all the great features of .NET MAUI in one place. Here are some highlights this week: August 5, 2024:
VS Code Settings
.NET MAUI is built to enable .NET developers to build cross-platform apps for Android, iOS, macOS, and Windows, with deep native integration, platform-native UI, and hybrid experiences. As its stability has improved and its ecosystem has grown, more and more developers are building cross-platform apps with .NET MAUI, and many of them are looking for a consistent build experience across their Windows, macOS, and Linux developer machines. The answer is Visual Studio Code, and the .NET MAUI developer experience in VS Code is constantly improving. James Montemagno I’ve created a helpful video that provides a complete setup guide for .NET MAUI development in VS Code.
VS Code is a popular lightweight code editor that works seamlessly across Windows/macOS/Linux, offers a rich ecosystem of extensions, and provides a consistent developer experience. James starts with the basics of installing the .NET/.NET MAUI workloads and setting up VS Code with the .NET MAUI extension. The .NET MAUI extension builds on the C# Dev Kit and C# extensions, providing Solution Explorer, C# Hot Reload, powerful C# IntelliSense, and more. James provides XCode and Android dependencies, and presents a complete .NET MAUI development/debugging experience for building cross-platform apps in VS Code, where developer productivity wins.
Follow your curiosity
Based on an idea originally started by Steven Thewissen for Xamarin, MAUI UI July is a month-long community-driven event where anyone can share their passion and enthusiasm for .NET MAUI. Run by Matt Goldman, this event was a great opportunity for .NET MAUI developers to learn from each other. MAUI UI July took place in July 2024. The following articles are David Ortinau He wrote a touching piece to mark his 50th birthday, which piques my curiosity.
David has great advice for anyone writing software: Embrace curiosity and the constant learning it inspires. Curiosity often makes us want to push the boundaries of what is possible. For example, using Microsoft.Maui.Graphics to create the UI and ribbon for a .NET MAUI app.
David dives deep into IWindowOverlay in Microsoft.Maui.Graphics, a mysterious graphics canvas used to paint and manage Windows overlays. David starts by adding circles to your UI with IWindowOverlayElement, then dives deep into creating colorful ribbons that overlay .NET MAUI apps. Thanks for the inspiration, David, and here’s to the next 50 new adventures.
UI Markup
.NET MAUI is the evolution of the modern .NET cross-platform development stack, enabling developers to reach mobile and desktop form factors from a single shared codebase. And the July issue of MAUI UI perfectly celebrates developer excitement for .NET MAUI. We’ve got new content ready to bookmark every day throughout July. The following MAUI UI July articles are available at: Brandon Minnick I wrote a very practical article on upgrading from Xamarin.CommunityToolkit.Markup to CommunityToolkit.Maui.Markup.
While XAML has a long and checkered history as a UI markup language, many modern .NET MAUI developers may prefer another option: building the UI visual tree entirely in C#. The CommunityToolkit.Maui.Markup package helps developers with all the plumbing necessary to build a .NET MAUI UI in C#, and Brandon has written a guide to getting started with CommunityToolkit.Maui.Markup.
As part of the .NET MAUI Community Toolkit, developers can easily get started with the NuGet package dependency and get inspired by Brandon’s re-creation of the basic template UI in C# instead of XAML. Brandon also points out the key differences between .NET MAUI and the Xamarin markup package. Developers should have a good understanding of how to use Typed Bindings and Relative Bindings.
Manage screen size
.NET MAUI is the evolution of the modern .NET cross-platform development stack, allowing developers to reach mobile and desktop form factors from a single shared codebase. While it’s great that a single codebase can power apps across multiple platforms, the sheer variety of screen sizes on devices can be a challenge for developers. Developers may need to meet app requirements that require UI elements to be proportional to each other across multiple screen sizes. Potential solutions include considering status/navigation bars and app scaling. Ed Mold I wrote a great article that might help you with managing screen size in your .NET MAUI app.
Ed was developing a Smart Letter Board .NET MAUI app where UI elements were large and had to be proportional to the screen size. Device size alone was not enough. Different mobile/desktop platforms use different sizes for status, navigation, and tab bars. Ed decided to use the OnSizeAllocated() method of .NET MAUI ContentPages. The reported width/height represents the drawable area of ​​the page, which is then applied when the page is resized.
However, developers should not chain performance-intensive operations in the OnSizeAllocated event handler, which is called continuously during resize. To scale UI elements proportionally based on screen size, Ed starts with default style pixels and scales the UI using a multiplier. Ed shows how to use the Factory and Observable patterns to efficiently and elegantly manage screen size in a .NET MAUI app. Thanks for the advice.
Inject AI
This is the era of artificial intelligence. AI is slowly changing the way we live and work, and its popularity is driving adoption in enterprise and consumer apps. AI offers .NET developers a huge opportunity to infuse their apps with solutions powered by generative AI and large-scale language models (LLMs). Bruno Capuano I wrote a great post to make it easier for developers to leverage the smarts of AI: How to easily add AI to your .NET apps using Prompty.
Prompty is a powerful new tool for developers looking to inject AI into their .NET apps, and is a Visual Studio Code extension designed to facilitate the integration of LLMs like GPT-4o. Developed by Microsoft, Prompty provides an intuitive interface for interacting with LLMs directly from the development environment, making it easy for developers to add AI capabilities to their projects.
After going through a typical developer workflow for installing/configuring Prompty, Bruno walks through a real-world use case, a sample WebAPI app that brings AI smarts to the table. With easy setup and automatic code generation using Semantic Kernel/Langchain, Prompty takes the pain out of integrating AI services for developers. It’s a great tool for any .NET and .NET MAUI developer.
I’ll end it here for now.
We’ll be back next week with more great .NET MAUI content!
Thank you, developers!