如何防止Editor在Xamarin.Forms中落后于键盘? [英] How to prevent Editor to go behind the keyboard in Xamarin.Forms?

问题描述

我有一个聊天应用程序.当前，有一个用于添加聊天文本的Entry控件.现在，我想提供类似Whatsapp的多行Entry.

I have a Chat app. Currently, there is an Entry control for add chat text. Now I want to provide multiline Entry, same like Whatsapp.

• 如果用户键入多行，则应自动将文本换行到下一行.
• 如果用户单击移动键盘中的下一行"按钮，则应转到下一行.
• 输入高度应自动增加到3行，如果用户删除文本，输入高度也应减小.

为此，我尝试将Entry替换为Editor并实现以下功能.

To do that I have tried to replace Entry with Editor and implement following functionality.

1-将编辑器替换为Entry. 2-实施使键盘保持打开状态的功能，直到用户单击消息列表"屏幕或后退"按钮为止.

1- Put an Editor in place of Entry. 2- Implement a functionality that keep keyboard open until user click on Message list screen or back button.

现在，我正在尝试实现自动高度功能，但是当用户尝试键入内容时，Editor会移到键盘后面.有人可以建议我如何保持编辑器打开和自动调整大小吗?

Now I am trying to implement auto height functioanlity but when user try to type, Editor goes behind the keyboard. Can anybody please suggest me how to keep Editor open and auto size?

当前代码:

XAML:

<Grid x:Name="MessageControls" RowSpacing="1" ColumnSpacing="2" Padding="5"
 Grid.Row="1" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="auto" />
    </Grid.ColumnDefinitions>
    <local:ChatEditorWithPlaceholder  x:Name="txtMessage" Grid.Column="0"  TextChanged="EnableSend" Text="{Binding OutGoingText}"/>
    <Frame x:Name="SendButton" Grid.Column="1" Margin= "0" Padding="0" HasShadow="false" HeightRequest="25"
BackgroundColor="Transparent" HorizontalOptions="FillAndExpand">
        <Frame.GestureRecognizers>
            <TapGestureRecognizer Tapped="SendMessage_Click" NumberOfTapsRequired="1" />
        </Frame.GestureRecognizers>
        <Label Text="Send" x:Name="sendButton" TextColor="#1f88b7" HeightRequest="20"
    HorizontalOptions="Center" VerticalOptions="Center"/>
    </Frame>
</Grid>

编辑器

public class ChatEditorWithPlaceholder : Editor
{
    public ChatEditorWithPlaceholder()
    {
        this.TextChanged += (sender, e) => { this.InvalidateMeasure(); };
    }
}

编辑器渲染器:

public class ChatEditorRenderer : EditorRenderer
{
    protected override void OnElementPropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
    {
        base.OnElementPropertyChanged(sender, e);
    }
}

protected override void OnElementChanged(ElementChangedEventArgs<Editor> e)
{
    base.OnElementChanged(e);
    if(Control != null) {
        Control.ScrollEnabled = false;
    }
    var element = this.Element as ChatEditorWithPlaceholder;

    Control.InputAccessoryView = null;
    Control.ShouldEndEditing += DisableHidingKeyboard;

    MessagingCenter.Subscribe<ConversationPage>(this, "FocusKeyboardStatus", (sender) =>
    {

        if (Control != null)
        {
            Control.ShouldEndEditing += EnableHidingKeyboard;
        }

        MessagingCenter.Unsubscribe<ConversationPage>(this, "FocusKeyboardStatus");
    });
}
private bool DisableHidingKeyboard(UITextView textView)
{
    return false;
}

private bool EnableHidingKeyboard(UITextView textView)
{
    return true;
}

屏幕截图:

推荐答案

尝试使用此ios渲染器.

Try this renderer for ios.

using System;  
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;   

[assembly:ExportRenderer( typeof(CustomEditor), typeof(CustomEditorRenderer))]
namespace YourNameSpace.iOS
{
    public class CustomEditorRenderer: EditorRenderer
    {
        public ChatEntryRenderer()
        {   
            UIKeyboard.Notifications.ObserveWillShow ((sender, args) => {

                if (Element != null)
                {
                    Element.Margin = new Thickness(0,0,0, args.FrameEnd.Height); //push the entry up to keyboard height when keyboard is activated
                }
            });

            UIKeyboard.Notifications.ObserveWillHide ((sender, args) => {

                if (Element != null)
                {
                       Element.Margin = new Thickness(0); //set the margins to zero when keyboard is dismissed
                }

            }); 
        }
    }
}

对于android，将此添加到MainActivity中

for android add this in MainActivity

 App.Current.On<Xamarin.Forms.PlatformConfiguration.Android>().
    UseWindowSoftInputModeAdjust(WindowSoftInputModeAdjust.Resize);

这篇关于如何防止Editor在Xamarin.Forms中落后于键盘?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！