.NET Multi-platform App UI (.NET MAUI) is a cross-platform framework for creating native mobile and desktop apps with C# and XAML.It is the evolution of the Xamarin.Forms cross-platform framework. .NET MAUI Release Candidate 2 was made available on April 26, 2022. This means that it is supported by Microsoft for production apps.
I shall demonstrate how easy it is to get started with.NET MAUI on macOS. In order to follow on, you will need the following pre-requisites:
- You need a macOS computer with either the x64 or M1 chips
- Install Xcode 13.2 (or later)
- Download & install Android Studio
- Install .NET MAUI on macOS by following these instructions
- If you do not already have VS Code, download and install it
Getting Started
From within a terminal window on macOS, run the following command:
dotnet new --list
This should will show you the available .NET application templates for cross platform applications:
| Template | Short Name |
|---|---|
| .NET MAUI App (Preview) .NET MAUI App (Preview) | maui |
| .NET MAUI Blazor App (Preview) | maui-blazor |
| .NET MAUI Class Library (Preview) | mauilib |
| .NET MAUI ContentPage (C#) (Preview) | maui-page-csharp |
| .NET MAUI ContentPage (XAML) (Preview) | maui-page-xaml |
| .NET MAUI ContentView (C#) (Preview) | maui-view-csharp |
| .NET MAUI ContentView (XAML) (Preview) | maui-view-xaml |
| Android Activity template | android-activity |
| Android Application (Preview) | android |
| Android Class Library (Preview) | androidlib |
| Android Java Library Binding (Preview) | android-bindinglib |
| Android Layout template | android-layout |
In today's exercise, we will create an app using the first maui template.
On the mac, you will need iOS 15.2 SDK (shipped with Xcode 13.2). If you have multiple versions of Xcode, you can choose a suitable version to be used with MAUI with:
sudo xcode-select -s /Applications/Xcode-beta.app/
Let us create a new MAUI app on macOS. In a terminal window, navigate to a suitable work directory, then run the following command to create a .NET MAUI app named 'maui2022':
dotnet new maui -o maui2022cd maui2022
The full set of .NET 6 TFMs (target framework monikers), including operating-specific ones, are:
net6.0net6.0-androidnet6.0-iosnet6.0-maccatalystnet6.0-macosnet6.0-tvosnet6.0-windows
Run app on macOS
To run the sample app as a macOS application, we will use the net6.0-maccatalyst target framework moniker:
dotnet build -t:run -f net6.0-maccatalyst
The actual macOS application resides in the Debug/net6.0-maccatalyst/maccatalyst-x64 directory as shown below:
Run app on iOS simulator
To run the sample app as an iOS application, we will use the net6.0-ios target framework moniker:
The above opens the app in a default iOS simulator. If you want to target a specific simulator (say iPhone 11), start Xcode, then choose Window >> Devices and Simulators.
Right-click on your device of choice, then select “Copy Identifier”.
Run the following command with the -p switch shown below and replace the highlighted Device ID with the one just copied:
dotnet build -t:Run -f net6.0-ios -p:_DeviceName=:v2:udid=7CD70FD4-BC03-42A9-AAC7-1045F8EB9C32
Run app in Android emulator
To run the sample app as an Android application, it is necessary to open an Android emulator first. The easiest way to do so is to start Android Studio, then start the AVD Manager.
After you create a virtual device (or emulator), start it by clicking on the green arrow.
Once the emulator starts you can run the sample app in an Android environment.
We will use the net6.0-android target framework moniker to run the sample app in Android:
dotnet build -t:run -f net6.0-android
Making a tiny change
Open the application workspace in VS Code, then open MainPage.xaml.cs in the editor. Change the statement on line 14 from "count++;" to "count += 10;" such that the count increments by 10 instead of 1. When you run the app in the Android emulator, you will see that it behaves as expected.
Conclusion
In this short journey we have learned how easy it is to run the same .NET MAUI app in macOS, iOS and Android. If you are on Windows, you can also run the same app on the Windows Operating System. Having come this far, try some simple changes to the app, like:
- change the picture on the main screen
- change the application icon that appears on the phone
- change the theme color of your app
Happy .NET MAUI development.
No comments:
Post a Comment