.NET MAUI Styles

.Net Maui (.Net Multi-platform App UI)is a cross-platform framework for building native mobile & desktop applications.

Styles

Imagine we have 3 labels on a certain page & all those labels have the same text color, font size & font family. So in this case we have to define all the attributes in the label individually.

But wait, the client has changed the requirement & has asked us to change the text color of all the labels. this task will become hectic if we have 100s of labels spreading on different pages of our app.

Shown above is the syntax of styles to save our time & help us to maintain the code much more efficiently. we can define one style for a label or any other views on .Net Maui & apply that style to the desired labels. Changing one attribute in style will automatically reflect the change in all the labels where the style was used.

Types of styles

1. Implicit Styles
2. Explicit Styles
3. Global Styles
4. Style Classes

1. Implicit Styles

Styles declared at the page level without x:key attribute are called Implicit Styles.

Implicit Styles

2. Explicit Styles

Styles declared at the page level with x:key attribute are called explicit Styles.

Explicit Style

3. Global Styles

Styles declared at the Application level with or without x:Key attributes are called Global Styles.

App.xaml

MainPage.xaml

Styles are declared in App.xaml file and consumed in MainPage.xaml

Global Styles

4. Style Classes

Styles class helps us to apply multiple styles to be applied on the same supported control.

We just have to define the class attribute in the existing style. Simply consume the style in view by using StyleClass=”ClassName”.

Thanks for reading and do let me know what topics should I cover in .Net Maui more.