REST API
DATA (through databinding)
DATA
Model (Data Objects)
ViewModel (Business Logic)
View (UI)
EVENTS
AppShell.xaml
used to define the navigation for a .NET MAUI Shell app.
It contains the subclassed Shell class, which is the root
element of the app's visual hierarchy. The Shell class can
contain three main hierarchical objects:
• FlyoutItem: Represents one or more items in the flyout,
and should be used when the navigation pattern for
the app requires a flyout.
• TabBar: Represents the bottom tab bar, and should be
used when the navigation pattern for the app begins
with bottom tabs and doesn't require a flyout.
• ShellContent: Represents the ContentPage objects of
each tab.
App.xaml
It contains the definition of the app's main window, as
well as the code-behind file that contains the app's
startup logic.
The App.xaml file typically contains the following
elements:
• A Window element that defines the app's main
window.
• A ContentPage element that contains the app's initial
content.
• A Startup event handler that is called when the app
starts.
MauiProgram.cs
It contains the code that is executed when the app starts
Databinding UI update when data changed
namespace ReportingApp.ViewModels
{
public class MainViewModel : INotifyPropertyChanged
{
public string Note { get; } = "LET'S GOOOOO!!!!!";
string text ;
public string Text {
get => text;
set
{
text = value;
// this OnPropertyChanged function means that when the set function is called the UI will be updated with the new values
// and if the variable is data binded that means that the set function is called and the UI is updated
OnPropertyChanged(nameof(Text));
}
}
public event PropertyChangedEventHandler PropertyChanged;
void OnPropertyChanged(string Note) =>
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(Note));
}
}
Databinding UI update when data changed shortcut (CommunityToolkit.Mvvm)
namespace ReportingApp.ViewModels
{
public partial class MainViewModel : ObservableObject
{
public string Note { get; } = "LET'S GOOOOO!!!!!";
// this [ObservableProperty] means that when the property is set or
// changed through databinding the UI will be
// updated with the new values
[ObservableProperty]
string text ;
}
}