When I open DatePicker control the UI get disturbed in .Net MAUI 8

86 views Asked by At

In iOS, when I click on the DatePicker control the screen headers get disturb and ui behaves weirdly. If I close DatePicker the UI get back in the correct form.

UI structure on page:

<Grid
    HorizontalOptions="Fill"
    RowDefinitions="Auto,*,Auto"
    VerticalOptions="Fill">

    <customControl:InspectionHeaderView Title="{Binding Path=Title}" Grid.Row="0" />

    <ScrollView
        x:Name="scrollView"
        Grid.Row="1"
        HorizontalOptions="Fill"
        IsVisible="{Binding IsBusy, Converter={StaticResource InvertedBoolConverter}}"
        VerticalOptions="Fill"
        VerticalScrollBarVisibility="Always">
        <!--Other ui components with DatePicker-->
    </ScrollView>
        
    <Grid
        Grid.Row="2"
        BackgroundColor="{StaticResource WhiteSmoke}"
        ColumnDefinitions="Auto,*"
        VerticalOptions="End">
        <!--Bottom bar-->
    </Grid>

 </Grid>

HeaderView control


<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="Mobile.UI.Controls.InspectionHeaderView"
             x:Name="contentView">
    <VerticalStackLayout HorizontalOptions="Fill">
        <Grid ColumnDefinitions="Auto,*" HeightRequest="60" ColumnSpacing="15" Margin="10,0">
            <ImageButton
                Grid.Column="0"
                WidthRequest="22"
                VerticalOptions="Center"
                Clicked="ImageButton_Clicked"
                Style="{StaticResource NavigationHeaderImageButtonStyle}" />
            <Label
                x:Name="title"
                Text="{Binding Path=Title,Source={x:Reference contentView}}"
                Grid.Column="1"
                VerticalOptions="Center"
                FontSize="16"
                Style="{StaticResource FieldValueLabelStyle}" />
        </Grid>
        <BoxView Style="{StaticResource BoxViewStyle}"/>
    </VerticalStackLayout>
</ContentView>

As shown in the attached screenshot, when I open DatePicker it header part got shrink and shows white space there.

I have set ios:Page.UseSafeArea="True" and tried False as well, but still the same result.

Anyone know how to fix this issue?

enter image description here

0

There are 0 answers