Grid Layout in MAUI

 In this example we are going to see GridLayoutEXP1 Example in MAUI.

1) Add new page and Update code as below.

<?xml version="1.0" encoding="utf-8" ?>

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"

             x:Class="MauiApp1.GridLayoutEXP1"

             Title="GridLayoutEXP1">

    <Grid>

        <Grid.RowDefinitions>

            <RowDefinition Height="50" />

            <RowDefinition Height="50" />

            <RowDefinition Height="50" />

        </Grid.RowDefinitions>

        <Grid.ColumnDefinitions>

            <ColumnDefinition Width="Auto" />

            <ColumnDefinition />

            <ColumnDefinition />

        </Grid.ColumnDefinitions>

        <Button Text="Column 0,Row 0"

           WidthRequest="200"  />

        <Button Grid.Column="1"

           Text="Column 1,Row 0" />

        <Button Grid.Row="1"

           Text="Column 0,Row 1" />

        <Button Grid.Column="1"

           Grid.Row="1"

           Text="Column 1,Row 1" />

        <Button BackgroundColor="Green"

            Grid.Row="2"

            Grid.Column="0"

           Grid.ColumnSpan="2"

           Text="Column Span" />

        <Button  BackgroundColor="Red"

            Grid.Column="2"

           Grid.RowSpan="3"

           Text="Row Span" />

    </Grid>    

</ContentPage>

Output:

Code in Github: https://github.com/adi501/MAUI