Drawings and Brushes
Learn how to construct graphic objects in MAUI by using drawings and brushes.
In UI development, a brush is a tool that allows us to paint an area or an object. For example, we can use a brush to apply a specific background color to a specific object.
In this lesson, we'll cover the usage of brushes in .NET MAUI. We'll do this with the help of the following project setup. The main page of the application contains a range of geometric figures that demonstrate how to use both simple and more advanced brushes.
<?xml version = "1.0" encoding = "UTF-8" ?>
<Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:MauiGraphicsDemo"
x:Class="MauiGraphicsDemo.App">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Resources/Styles/Colors.xaml" />
<ResourceDictionary Source="Resources/Styles/Styles.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
Using simple brushes
Simple brushes in MAUI apply solid colors to various objects. The easiest way to implement them is to assign values to various properties of the type Color on a UI element. We have this on lines 17–23 in the MainPage.xaml file in the example above. We also have a Frame element with the following properties:
<Frame Background="LightGreen"BorderColor="DarkGreen"HasShadow="True"CornerRadius="12"HeightRequest="120"WidthRequest="120"HorizontalOptions="Center" />
Here, the examples of Color properties include Background and BorderColor. We can set the color value to one of the pre-defined enum strings, such as LightGreen and DarkGreen. But we can also configure colors more precisely ...