--- robots: noindex, nofollow --- 00 Get started: Installation : MAUI === [toc] For this course, we will be using the latest version of **Visual Studio**. We strongly advise you to uninstall any previous versions of Visual Studio. If you already have Visual Studio 2022 installed (both community, professional as enterprise will do), go to [Add Maui to an existing Visual Studio 2022 installation](#Add-Maui-to-an-existing-Visual-Studio-2022-installation). Otherwise, follow the [Fresh install of Visual Studio with Maui](#Fresh-install-of-Visual-Studio-2022-with-Maui) instructions. :::info Building apps for iOS and macOS requires a Mac. You'll need the latest Visual Studio 2022 for Mac 17.4 Preview ::: The Apple fanatics amongst us should not worry though – in [this tutorial](https://docs.microsoft.com/nl-nl/dotnet/maui/get-started/first-app?pivots=devices-ios&tabs=vsmac) you will learn to install Visual Studio with Maui on a Mac! # Fresh install of Visual Studio 2022 with Maui - Go to https://www.visualstudio.com/downloads/ - Choose the “free download” button underneath “Community”. ![](https://i.imgur.com/akc9U3Z.png) - During the installation, you will get options on what to install. The following sceenshots show what you might need during this course. Don’t worry if you forgot something; things can always be added afterwards. ![](https://i.imgur.com/7YTq3Vl.png) # Add Maui to an existing Visual Studio 2022 installation *If you followed the steps in the previous topic (fresh installation), you can skip this part and go to ‘Developer Mode’.* - Go to your start menu and search/run “Visual Studio Installer” ![](https://i.imgur.com/0uso1p6.png) - Under “Visual Studio Community 2022” (or Enterprise, or Professional), choose “Modify”. Make sure you are using Visual Studio 17.3. ![](https://i.imgur.com/Wmv8zIV.png) - Check “.NET Multi-platform App UI Development” & “Mobile development with .NET”. In the right pane, make sure everything is checked. ![](https://i.imgur.com/7YTq3Vl.png) # Developer Mode We will now set your machine to ‘Developer mode’. 1. Go to Settings → Update & Securty → For developers 2. Check the Developer mode radiobutton ![](https://i.imgur.com/rYmkzcN.png) # Setup and run your first project There are several possibilities to test and run your mobile applications. You can either use an emulator, or deploy to your own mobile phone. Based on our experiences so far, we believe that deploying to a physical device is the most stable option. However, Visual Studio offers a range of emulators you can use. ::: warning *Even if you do have a physical device you can (and wish to) use, It is **extremely** important that you go through all the steps in this part to fully test your installation and emulators! You might need the latter if your phone is dead, or during your final exams.* ::: ## Android, iOS or Windows? First of all, we will choose an operating system to test on for this course. Even though our Maui applications will target all the above, for now, it would be a waste of time to run on all of them every single time. During this course, we will be testing on **Android**, using Visual Studio Android emulators and/or physical devices. ## Create your first Maui project - Launch Visual Studio 2022, and in the start window click **Create a new project** to create a new project: ![](https://i.imgur.com/WqVPnhm.png) - In the **Create a new project** window, select **MAUI** in the **All project types** drop-down, select the **.NET MAUI App** template, and click the **Next** button: ![](https://i.imgur.com/69zonrE.png) :::info The .NET MAUI templates might not appear in Visual Studio if you also have .NET 7 Preview installed. For more information, see [.NET MAUI templates do not appear in Visual Studio](https://github.com/dotnet/maui/wiki/Known-Issues#net-maui-templates-do-not-appear-in-visual-studio). ::: - In the **Configure your new project** window, name your project, choose a suitable location for it, and click the **Next** button: :::danger **To avoid major headaches and laptops flying around the classroom, make sure you do not – we repeat – ==DO NOT== choose a folder that is either a synchronized ==Google Drive== or ==Dropbox== folder, in your user folder (eg. ==Documents!==)! Also, keep the path AS ==SHORT AS POSSIBLE==!** ::: :::warning :mega: Don’t say we didn’t warn you: Maui WILL come back to haunt you sooner or later if you choose to ignore this. ::: ![](https://i.imgur.com/atjvlYS.png) - In the **Additional information** window, click the **Create** button: ![](https://i.imgur.com/DfvhYr9.png) - Wait for the project to be created, and its dependencies to be restored: ![](https://i.imgur.com/wyJT8Ga.png) - In the Visual Studio toolbar, use the **Debug Target** drop down to select **Android Emulators** and then the **Android Emulator** entry: ![](https://i.imgur.com/isTNK3y.png) ## Deploying to an Android Emulator - In the Visual Studio toolbar, press the **Android Emulator** button: ![](https://i.imgur.com/yX9w8GK.png) Visual Studio will start to install the default Android SDK and Android Emulator. - In the **Android SDK - License Agreement** window, press the **Accept** button: ![](https://i.imgur.com/v9mpBlw.png) - In the **Android SDK - License Agreement** window, press the **Accept** button: ![](https://i.imgur.com/JPucXw6.png) - In the **User Account Control** dialog, press the **Yes** button: ![](https://i.imgur.com/H1hCFSo.png) - In the **License Acceptance** window, press the **Accept** button: ![](https://i.imgur.com/DEacTz2.png) Wait for Visual Studio to download the Android SDK and Android Emulator. - In the Visual Studio toolbar, press the **Android Emulator** button: ![](https://i.imgur.com/A8TlubT.png) Visual Studio will start to create a default Android emulator. - In the **User Account Control** dialog, press the **Yes** button: ![](https://i.imgur.com/kRVrBpu.png) - In the **New Device** window, press the **Create** button: ![](https://i.imgur.com/K3C5F5p.png) Wait for Visual Studio to download, unzip, and create an Android emulator. - Close the **Android Device Manager** window: ![](https://i.imgur.com/Q36rsup.png) - In the Visual Studio toolbar, press the **Pixel 5 - API 30 (Android 11.0 - API 30)** button to build and run the app: ![](https://i.imgur.com/M7562eO.png) Visual Studio will start the Android emulator, build the app, and deploy the app to the emulator. *** ## Enable hardware acceleration with HyperV :::warning Hardware acceleration must be enabled to maximize Android emulator performance. Failure to do this will result in the emulator running very slowly. For more information, see [How to enable hardware acceleration with Android emulators (Hyper-V & HAXM)](https://docs.microsoft.com/nl-nl/dotnet/maui/android/emulator/hardware-acceleration). ::: *** - Ok, and now the... ![](https://i.imgur.com/vbrDjpT.png) - In the running app in the Android emulator, press the **Click me** button several times and observe that the count of the number of button clicks is incremented. ![](https://i.imgur.com/zwmO8t0.png) ## Deploying to a physical android device While the Android emulator is a great way to rapidly develop and test your app, you'll want to test your apps on a real Android device. To run on a device, you'll need to enable developer mode on the device and connect it to your computer. :::warning The steps in this article are written generically, to work on as many devices as possible. If you can't find these settings on your device, consult your device manufacturer's documentation. ::: ### Enable developer mode on the device A device must enable Developer mode in order to deploy and test an Android app. Developer mode is enabled by following these steps: 01. Go to the **Settings** screen. 01. Select **About phone**. 01. Tap **Build Number** seven times until **You are now a developer!** is visible. Depending on the UI your device is running, the **About phone** option may be in a different location. Consult your device documentation if you can't find **About phone**. ![](https://i.imgur.com/Nk6U2Zd.png) ### Enable USB debugging After enabling developer mode on your device, enable USB debugging by following these steps: 01. Go to the **Settings** screen. 01. Select **Developer options**. 01. Turn on the **USB debugging** option. Depending on the UI your device is running, the **USB debugging** option may be in a different location. Consult your device documentation if you can't find **USB debugging**. ### Connect the device to the computer The final step is to connect the device to the computer. The easiest and most reliable way is to do so over USB. You'll receive a prompt to trust the computer on your device if you haven't used it for debugging before. You can also check **Always allow from this computer** to prevent requiring this prompt each time you connect the device. ![](https://i.imgur.com/vr1nRb3.png) If your computer isn't recognizing the device when it's plugged in, try installing a driver for the device. Consult your device manufacturer's support documentation. You can also try installing the Google USB Driver through the Android SDK Manager: ![](https://i.imgur.com/9SVWKhO.png) # Troubleshooting [Here](https://docs.microsoft.com/nl-nl/dotnet/maui/android/emulator/troubleshooting) they describes the most common warning messages and issues that occur while configuring and running the Android Emulator. Also, it describes solutions for resolving these errors and various troubleshooting tips to help you diagnose emulator problems. * Deployment issues on Windows * Missing Google Play Services * Performance issues * Hardware acceleration issues * HAXM issues ![](https://i.imgur.com/JUjOMIm.png) - Check the exact error message in the error or output window in the bottom part of your visual studio environment. Look it up in Google and try the suggested solutions - If you don’t get a message but your emulator doesn’t do as it should, look that up on Google. - If all else fails... call the teacher for help ###### tags: `Device Programming` `MCT` `Syllabus`