.net maui change graphics view width and height to size of window or screen

Question

I have simple graphics view

<VerticalStackLayout>
    <GraphicsView x:Name="modelerArea"
        Drawable="{StaticResource drawable}"
                  HeightRequest="1000"
                  WidthRequest="1000" />

And I want to set width and height to size of window or screen. How can I achieve that?
From xaml.cs file I tried something like this but I get error because field its readonly

    double height = DeviceDisplay.MainDisplayInfo.Height;
    double width = DeviceDisplay.MainDisplayInfo.Width;
    modelerArea.Width = width;
    modelerArea.Height = height;

Thanks for any hints.

Answer 1

One way to fill the entire available space would be to simply use the GraphicsView as the only content item and use the HorizontalOptions and VerticalOptions to stretch it:

<ContentPage ...>
    <GraphicsView x:Name="modelerArea"
                  Drawable="{StaticResource drawable}"
                  HorizontalOptions="Fill"
                  VerticalOptions="Fill"/>
</ContentPage>

More information on this: https://learn.microsoft.com/en-us/dotnet/maui/user-interface/align-position?view=net-maui-7.0

Alternatively, in your code-behind you could also use the WidthRequest and HeightRequest properties of the GraphicsView:

modelerArea.WidthRequest = width;
modelerArea.HeightRequest = height;

This is necessary, because Width and Height are read-only properties that only provide the actually calculated on-screen dimensions. The values of WidthRequest and HeightRequest are not guaranteed.

Note: You cannot use both approaches at the same time, because the HorizontalOptions="Fill" and VerticalOptions="Fill" will override the requested width and height values.