starterkit-mobile-application

About starterkit-mobile-application MAUI instructions

ERNI Academy mobile boilerplate to start a MAUI forms mobile application.

Getting Started

This boilerplate uses the well-known MVVM pattern and is based on a MAUI Forms Shell application.

The application is multilanguage so just add a new file AppResources.(TWO ISO LANGUAGE LETTER).resx with the language and then add the following code in the header of the XAML

<ContentPage
...
 xmlns:extensions="clr-namespace:Erni.Mobile.Extensions"
 />

Then you can use in a label like this:

<Label FontSize="{StaticResource HeadLine}" Text="{extensions:Translate About_Title}" />

Also has FontAwesome icons ready to use, add the following code in the header of the XAML:

<ContentPage
...
 xmlns:FontAwesome="clr-namespace:Erni.Mobile.Helpers.Fonts"
 />

Then you can use in a label like this:

<Label FontFamily="FAS" Text="{x:Static FontAwesome:FontAwesomeIcons.AddressCard}" />

Project Structure

The project contains the following projects

The folder structure

.
├── Erni.Mobile.MAUI
  ├── 📁 Properties: Contains all custom controls
  │  └── 📄 launchSettings.json: Stores configuration information. \   ├── 📂 Extensions: Contains all custom extension
  │  └── 📄 TranslateExtension.cs: Class that manages the localization culture of the application.
  ├── 📂 Helpers: Contains all custom Helpers
  │  ├── 📄 ApplicationMode.cs: Contains all helpers need to determine if application is in debug mode, UI Testing mode or release mode.
  │  ├── 📄 FontAwesomeIcons.cs: Contains all code for FontAwesome.
  │  └── 📄 LocalizationResourceManager.cs: Class that manages the localization culture of the application.
  ├── 📂 Models: Contains all Busines Models that the application uses
  │  └── 📄 Item.cs: Model class that represents a dummy object for the application.
  │  └── 📄 Language.cs: Model class that represents the language object for LanguageResourceManager.
  ├── 📁 Platforms: Contains all application resources as resx files, fonts, …
  │  └── 📁 Android: Contains all functionalities and implementations specific for Android.
  │    ├── 📁 Resources: Android specific Resources.
  │      └── 📁 values
  │        └── 📄 colors.xml: Specific color definition for Android.
  │    └── 📁 Services: Android specific implementation for the different Services.
  │      ├── 📁 Configuration
  │        └── 📄 ConfigurationFileProvider.cs: Specific implementation for the IConfigurationFileProvider.
  │    ├── 📄 AndroidManifest.xml: Describes essential information for the Android application.
  │    ├── 📄 MainActivity.cs: Class pushed to screen. First activity of the application.
  │    └── 📄 MainApplication.cs: Main application class. Entry point of the application for Android platform.
  │  └── 📁 iOS: Contains all functionalities and implementations specific for iOS.
  │    └── 📁 Services: iOS specific implementation for the different Services.
  │      ├── 📁 Configuration
  │        └── 📄 ConfigurationFileProvider.cs: Specific implementation for the IConfigurationFileProvider.
  │    ├── 📄 AppDelegate.cs: Calls the CreateMAUIApp functionality.
  │    ├── 📄 Info.plist: File of list of properties.
  │    └── 📄 Program.cs: Entry point of the application for iOS platform.
  │  └── 📁 MacCatalyst: Contains all functionalities and implementations specific for Mac.
  │    └── 📁 Services: Mac specific implementation for the different Services.
  │      ├── 📁 Configuration
  │        └── 📄 ConfigurationFileProvider.cs: Specific implementation for the IConfigurationFileProvider.
  │    ├── 📄 AppDelegate.cs: Calls the CreateMAUIApp functionality.
  │    ├── 📄 Info.plist: File of list of properties.
  │    └── 📄 Program.cs: Entry point of the application for Mac platform.
  │  └── 📁 Windows: Contains all functionalities and implementations specific for Windows.
  │    └── 📁 Services: Windows specific implementation for the different Services.
  │      ├── 📁 Configuration
  │        └── 📄 ConfigurationFileProvider.cs: Specific implementation for the IConfigurationFileProvider.
  │    ├── 📄 app.manifest: Describes essential information for the Windows application.
  │    ├── 📄 App.xaml: Entry point of the application for Windows platform.
  │    └── 📄 Package.appxmanifest: XML file used for packaging Windows apps.
  ├── 📁 Resources: Contains all application resources as resx files, fonts, …
  │  └── 📁 Fonts: Contains all fonts available for the application
  │  └── 📁 Images: Contains all images available for the application
  │  └── 📁 Raw: Contains all maui assets available for the application
  │     ├── 📄 AboutAssets.txt: Explain how to use Assets in MAUI.
  │     ├── 📄 appsettings.json: Dummy app settings file.
  │  └── 📄 appicon.svg: Icon image for the application.
  │  └── 📄 appiconfg.svg: Splash screen image.
  │  └── 📄 AppResource.resx: Base resources file for translations.
  ├── 📂 Services: Contains all services to connect to any API, DB, Queue,…
  │  ├── 📂 Configuration: Contains all services to load/read application configuration file.
  │  │  ├── 📄 ApplicationSettingsService.cs: Class to read all the configuration file.
  │  │  ├── 📄 IApplicationSettingsService.cs: Interface to read all the configuration file.
  │  │  ├── 📄 IConfigurationFileProvider.cs: Interface service that will be implemented on each platform to read the json configuration file.
  │  │  └── 📄 SettingsService.cs: Base Class to interact with the configuration json object.
  │  └── 📂 Logging: Contains all needed classes to interact with the AppCenter to log traces, events and crashes.
  │     ├── 📄 AppCenterLoggingService.cs: Class to intract with AppCenter to log traces, events and crashes.
  │     ├── 📄 Events.cs: Class that contains all the application events that will be reported to AppCenter.
  │     ├── 📄 ILoggingService.cs: Interface to intract with AppCenter to log traces, events and crashes.
  │     └── 📄 MockLoggingService.cs: Class to mock the interact with the AppCenter.
  │  └── 📄 IDataStore.cs: Interface to implement the data storage functionality.
  │  └── 📄 MockDataStore.cs: Fake data store functionality.
  ├── 📁 Style: Contains all styles used in the application
  │  ├── 📄 Colors.xaml: Contains all the colors the application needs.
  │  ├── 📄 FontSizes.xaml: Contains all the font sizes the application needs.
  │  ├── 📄 Spaces.xaml: Contains all the space sizes the application needs.
  │  ├── 📄 Styles.xaml: Unifies all the previous resources into one big dictionary with all.
  │  └── … Add personalized styles for buttons, labels, tabs, etc. in separate files and then reference them in the Style.xaml
  ├── 📁 ViewModels: Contains all the ViewModels used in the Views
  │  └── 📄 BaseViewModel.cs: All ViewModel classes must inherit from this one that implements the INotifyPropertyChanged
  │              and encapsulate the methods to work with it.
  ├── 📁 Views: Contains all the Views in the application.
  ├── 📄 App.xaml: Application main view. Entrance View for the current application.
  ├── 📄 MainPage.xaml: Shell view defining visual hierarchy and navigation.
  └── 📄 MauiProgram.cs: Starting point to register dependencies, fonts, services, …