Progress® Telerik® UI for .NET MAUI Feedback Portal
Back to Feed
Request a Feature Report a Bug
Unplanned
Last Updated: 30 Apr 2025 10:13 by Luis
Luis
Created on: 14 Apr 2025 06:42
Category: WrapLayout
Type: Bug Report
1
WrapLayout: The layout is miscalculated and blank row is added when items cannot fit
Create a blank telerik project (I've not used shell);
Update maui to 9.0.50 (for more relevance with current code);
Replace the contents of MainPage.xaml with the xaml shown below;
Remove unnecessary code from MainPage.xaml.cs to allow app to build and run;
OBSERVE:
Test 1.2 fails - items are shown on a single row when they should not fit.
Test 1.3 fails - items are shown on a single row when they should not fit, and the wrap layout is extended to two rows.
Test 2.1 fails - items are show on two rows when they should fit a single one.
Attached Files:
4 comments
Luis
Posted on: 30 Apr 2025 10:13 
 <ContentPage.Resources>
        <ResourceDictionary>
            <Style TargetType="Button">
                <Setter Property="WidthRequest" Value="253" />
                <Setter Property="HeightRequest" Value="77" />
                <Setter Property="Background" Value="Green" />
                <Setter Property="TextColor" Value="White" />
                <Setter Property="Margin" Value="1,1,1,1" />
                <Setter Property="Text" Value="Witdh 253, Margin 1,1,1,1" />
            </Style>

            <Style x:Key="NoMargin" TargetType="Button">
                <Setter Property="WidthRequest" Value="255" />
                <Setter Property="Margin" Value="0" />
                <Setter Property="Text" Value="Witdh 255, Margin 0" />
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>

    <ScrollView>
        <VerticalStackLayout Margin="30,0" VerticalOptions="Center">
            <!--  FIRST TEST  -->
            <Label Margin="30" HorizontalOptions="Center" Text="The layout below at width 765 should fit all its items on a single row" />
            <telerik:RadWrapLayout Background="DarkGreen" StretchLastChild="False" WidthRequest="765">
                <Button />
                <Button />
                <Button />
            </telerik:RadWrapLayout>
            <Label Margin="30" HorizontalOptions="Center" Text="The layout below at width 764.5 shows items in a single row (when they shouldn't fit)" />
            <telerik:RadWrapLayout Background="DarkRed" StretchLastChild="False" WidthRequest="764.5">
                <Button />
                <Button />
                <Button />
            </telerik:RadWrapLayout>
            <Label Margin="30" HorizontalOptions="Center" Text="The layout below at width 764.4 shows items in a single row (when they shouldn't fit) and presents a blank row" />
            <telerik:RadWrapLayout Background="DarkRed" StretchLastChild="False" WidthRequest="764.4">
                <Button />
                <Button />
                <Button />
            </telerik:RadWrapLayout>
            <Label Margin="30" HorizontalOptions="Center" Text="The layout below at width 764.3 shows items in two rows, as expected" />
            <telerik:RadWrapLayout Background="DarkGreen" StretchLastChild="False" WidthRequest="764.3">
                <Button />
                <Button />
                <Button />
            </telerik:RadWrapLayout>

            <!--  SECOND TEST  -->
            <Label Margin="30" HorizontalOptions="Center" Text="Second test" />
            <Label Margin="30" HorizontalOptions="Center" Text="The layout below at width 765 should fit all its items on a single row, but doesn't" />
            <telerik:RadWrapLayout Background="DarkRed" StretchLastChild="False" WidthRequest="765">
                <Button Style="{StaticResource NoMargin}" />
                <Button Style="{StaticResource NoMargin}" />
                <Button Style="{StaticResource NoMargin}" />
            </telerik:RadWrapLayout>
            <Label Margin="30" HorizontalOptions="Center" Text="The layout below at width 764.5 shows items in two rows" />
            <telerik:RadWrapLayout Background="DarkGreen" StretchLastChild="False" WidthRequest="764.5">
                <Button Style="{StaticResource NoMargin}" />
                <Button Style="{StaticResource NoMargin}" />
                <Button Style="{StaticResource NoMargin}" />
            </telerik:RadWrapLayout>
            <Label Margin="30" HorizontalOptions="Center" Text="The layout below at width 764.4 shows items in two rows" />
            <telerik:RadWrapLayout Background="DarkGreen" StretchLastChild="False" WidthRequest="764.4">
                <Button Style="{StaticResource NoMargin}" />
                <Button Style="{StaticResource NoMargin}" />
                <Button Style="{StaticResource NoMargin}" />
            </telerik:RadWrapLayout>
            <Label Margin="30" HorizontalOptions="Center" Text="The layout below at width 764.3 shows items in two rows" />
            <telerik:RadWrapLayout Background="DarkGreen" StretchLastChild="False" WidthRequest="764.3">
                <Button Style="{StaticResource NoMargin}" />
                <Button Style="{StaticResource NoMargin}" />
                <Button Style="{StaticResource NoMargin}" />
            </telerik:RadWrapLayout>
        </VerticalStackLayout>
    </ScrollView>
ADMIN
Didi
Posted on: 14 Apr 2025 07:53

Status was changed. Thank you for the follow up message.

Regarding to the images, both in the feedback item here and in the forum show the issue.

Regards,
Didi
Progress Telerik

Enjoyed our products? Share your experience on G2 and receive a $25 Amazon gift card for a limited time!

Luis
Posted on: 14 Apr 2025 07:52
the images posted above also show different results to what I got on my test, so please check the images on the forum post that I've linked to check them.
Luis
Posted on: 14 Apr 2025 07:50

link to the forum post where I initially posted this.
WrapLayout miscalculates its layout and presents blank rows or items inside rows where they shouldn't fit in UI for .NET MAUI | Telerik Forums

not sure why this is logged as a feature request, it is clearly a bug...

Create an account Log In
View
Type
Status
Category