毛伊岛滚动视图中的可扩展编辑器剪切文本

Question

我正在尝试创建一个行为类似于 Messenger 的编辑器字段。 那是：

• 当用户键入多行时可以展开
• 编辑器只能增长到定义的最大高度，之后可以在编辑器中滚动

编辑器将使用AutoSize="TextChanges"属性很好地扩展，但尝试添加滚动行为会使编辑器行为异常。

在文档中定义，当我们有AutoSize时，我们不能在编辑器上设置HeightRequest 。

这是我的尝试：

<?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"
             xmlns:custom="clr-namespace:MauiHandler"
             x:Class="MauiHandler.MainPage">

    <StackLayout BackgroundColor="White">

        <Label HorizontalOptions="Center" Text="Welcome to .NET MAUI" VerticalOptions="Center"></Label>

        <BoxView BackgroundColor="LightGrey" VerticalOptions="CenterAndExpand"></BoxView>

        <StackLayout Padding="8, 12"
                     BackgroundColor="White">
            <Grid Padding="12, 6"
                  ColumnDefinitions="*,Auto"
                  ColumnSpacing="10"
                  RowDefinitions="Auto">

                <ScrollView Grid.Column="0"
                            HorizontalOptions="Fill"
                            VerticalScrollBarVisibility="Never"
                            MaximumHeightRequest="150">

                    <Editor BackgroundColor="White"
                            AutoSize="TextChanges"
                            FontSize="Medium"
                            Keyboard="Chat"
                            Placeholder="Aa"
                            TextColor="Gray"></Editor>
                </ScrollView>
                
                <Button Text="Send"
                        Grid.Column="1"
                        VerticalOptions="End"
                        TextColor="Black"
                        BackgroundColor="Transparent"></Button>
            </Grid>
        </StackLayout>
    </StackLayout>
 
</ContentPage>

风景：

输入一些文字：

超过滚动高度：

在最后一张图片中，插入第二张图片（ Aaaaa ）的第一个文本从滚动视图中“截断”。

Answer 1

经过很多挫折后，我发现 ScrollView 没有正确注册内容的更改。

我通过在代码隐藏文件中添加以下内容（至少在 Android 上）解决了这个问题：

// There is a mismatch between these values. They should be equal.
// It appears the autosize does not update the inner scroll view
Console.WriteLine($"ContentSize of the ScrollView: {InnerScrollView.ContentSize}");
Console.WriteLine($"ContentSize of the Editor: {MyEditor.DesiredSize}");

 // Trigger a new layout in the scroll view. After this the content size and desired size will be equal
 Dispatcher.Dispatch(() => InnerScrollView.ForceLayout());

它可能不是最高效的解决方案，但它确实有效！