ovbarnett commented 1 year ago

Description

Please see below the xaml and the recording of how it is behaving. I am suspecting it is a bug? Might be related to the opened issue #13632 but for iOS:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="iOS_Editor_Label_in_ScollView_Issue.MainPage">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="100" />
            <RowDefinition Height="100" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <Border Grid.Row="0" Grid.Column ="0"
                    x:Name="LabelTextFrame" 
                    IsVisible="True"  
                    Padding="5" 
                    Margin="0,5,0,0" 
                    BackgroundColor="Cyan" 
                    HorizontalOptions="FillAndExpand" 
                    VerticalOptions="FillAndExpand" >

            <ScrollView Grid.Row="0" Grid.Column ="0" Orientation="Vertical" VerticalOptions="FillAndExpand">
                <Label Grid.Row="0" Grid.Column="0" 
                       x:Name="LabelText" VerticalOptions="FillAndExpand"
                       HorizontalOptions="FillAndExpand"
                       IsVisible="True"
                       FontSize="14"
                        TextColor="Black"
                        FontAutoScalingEnabled ="False"
                       Text="Line1&#xa;Line2&#xa;Line3&#xa;Line4&#xa;Line5&#xa;Line6&#xa;Line7&#xa;Line8&#xa;Line9&#xa;Line10"
                       HeightRequest="150"
                       />
            </ScrollView>
        </Border>

        <Border Grid.Row="1" Grid.Column ="0"
                    x:Name="EditorTextFrame" 
                    IsVisible="True"  
                    Padding="5" 
                    Margin="0,5,0,0" 
                    BackgroundColor="Cyan" 
                    HorizontalOptions="FillAndExpand" 
                    VerticalOptions="FillAndExpand" >

            <ScrollView Grid.Row="1" Grid.Column ="0" Orientation="Vertical" VerticalOptions="FillAndExpand">
                <Editor Grid.Row="1" Grid.Column ="0" 
                        x:Name="EditorText" 
                        VerticalOptions="FillAndExpand"
                        HorizontalOptions="FillAndExpand"
                        FontSize="14"
                        TextColor="Black"
                        FontAutoScalingEnabled ="False"
                        IsSpellCheckEnabled ="True"
                        MaxLength="2000"
                        AutoSize="TextChanges"
                        IsVisible="True" 
                        Text="Line1&#xa;Line2&#xa;Line3&#xa;Line4&#xa;Line5&#xa;Line6&#xa;Line7&#xa;Line8&#xa;Line9&#xa;Line10"
                       HeightRequest="150"
                        />

            </ScrollView>
        </Border>
    </Grid>
</ContentPage>

here is the recording

https://github.com/dotnet/maui/assets/62110195/d0b515e2-80de-47cb-a5d5-4b173e1ce51f

Steps to Reproduce

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="iOS_Editor_Label_in_ScollView_Issue.MainPage">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="100" />
            <RowDefinition Height="100" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <Border Grid.Row="0" Grid.Column ="0"
                    x:Name="LabelTextFrame" 
                    IsVisible="True"  
                    Padding="5" 
                    Margin="0,5,0,0" 
                    BackgroundColor="Cyan" 
                    HorizontalOptions="FillAndExpand" 
                    VerticalOptions="FillAndExpand" >

            <ScrollView Grid.Row="0" Grid.Column ="0" Orientation="Vertical" VerticalOptions="FillAndExpand">
                <Label Grid.Row="0" Grid.Column="0" 
                       x:Name="LabelText" VerticalOptions="FillAndExpand"
                       HorizontalOptions="FillAndExpand"
                       IsVisible="True"
                       FontSize="14"
                        TextColor="Black"
                        FontAutoScalingEnabled ="False"
                       Text="Line1&#xa;Line2&#xa;Line3&#xa;Line4&#xa;Line5&#xa;Line6&#xa;Line7&#xa;Line8&#xa;Line9&#xa;Line10"
                       HeightRequest="150"
                       />
            </ScrollView>
        </Border>

        <Border Grid.Row="1" Grid.Column ="0"
                    x:Name="EditorTextFrame" 
                    IsVisible="True"  
                    Padding="5" 
                    Margin="0,5,0,0" 
                    BackgroundColor="Cyan" 
                    HorizontalOptions="FillAndExpand" 
                    VerticalOptions="FillAndExpand" >

            <ScrollView Grid.Row="1" Grid.Column ="0" Orientation="Vertical" VerticalOptions="FillAndExpand">
                <Editor Grid.Row="1" Grid.Column ="0" 
                        x:Name="EditorText" 
                        VerticalOptions="FillAndExpand"
                        HorizontalOptions="FillAndExpand"
                        FontSize="14"
                        TextColor="Black"
                        FontAutoScalingEnabled ="False"
                        IsSpellCheckEnabled ="True"
                        MaxLength="2000"
                        AutoSize="TextChanges"
                        IsVisible="True" 
                        Text="Line1&#xa;Line2&#xa;Line3&#xa;Line4&#xa;Line5&#xa;Line6&#xa;Line7&#xa;Line8&#xa;Line9&#xa;Line10"
                       HeightRequest="150"
                        />

            </ScrollView>
        </Border>
    </Grid>
</ContentPage>

Link to public reproduction project repository

https://github.com/ovbarnett/iOS_Editor_Label_in_ScollView_Issue

Version with bug

6.0.312

Last version that worked well

6.0.312

Affected platforms

iOS

Affected platform versions

iOS 16.2

Did you find any workaround?

no

Relevant log output

n/a

cat0363 commented 1 year ago

Hi, @ovbarnett The problem that the character string of the label outside the display range disappears is probably the same as Issue #15025. If I unwrap the Border, does the label display incorrectly? I feel that the issue where the scrolling of the Editor does not work is the problem that the scrolling of the Editor placed in the ScrollView does not work. Probably the same issue as Issue #13634. However, the Editor side seems to be a compound problem of #15025, #13634.

ghost commented 1 year ago

We've added this issue to our backlog, and we will work to address it as time and resources allow. If you have any additional information or questions about this issue, please leave a comment. For additional info about issue management, please read our Triage Process.

ovbarnett commented 1 year ago

Hi @cat0363, thank you for your reply. If I comment out Border wrapping, the scrolling for the Label and the Editor controls still does not work as expected. Here is another recording. https://github.com/dotnet/maui/assets/62110195/7e39045c-fe80-4e48-b472-79596a857557

I have seen your opened Issue #13634 before I posted mine. These issues seem to be a bit different as your example does not include Label in ScrollView that's why I decided to proceed with my post as well. I have also tried a couple of suggested ideas for the workaround, but still no luck :-( https://stackoverflow.com/questions/72839872/expandable-editor-in-scrollview-cutting-text-in-maui https://stackoverflow.com/questions/73120009/scrollview-not-scrolling-in-net-maui#:~:text=It%20is%20solved%20by%20setting%20the%20scroll%20view%2cFillAndExpand%20as%20Steven%20mentioned%20in%20his%20answer%20below.

So, any other ideas to try for the workaround will be greatly appreciated!

cat0363 commented 1 year ago

Hi, @ovbarnett Why are you fixing the label HeightRequest as 150? If you unwrap the Border and remove HeightRequest=150, will the Label side work? If it works, the label side is the same issue as #15025.

Even if the Editor side unwraps the Border, it does not work. This is because scrolling on the ScrollView side has priority over scrolling on the Editor side. It looks like it's scrolling, but it's just an Editor with a height of 150 being scrolled inside a ScrollView. However, since the Editor side is wrapped with Border,