Ytukyg

I'm trying to build a Chat app UI, the idea of the Layout was pretty simple:

When the input bar is focused, keyboard show up and "push" up the chat bar, as it's a grid, the ListView will resize to fit the screen:

I update the input bar's margin to "push" it up:

NSValue result = (NSValue)args.Notification.UserInfo.ObjectForKey(new NSString(UIKeyboard.FrameEndUserInfoKey));

CGSize keyboardSize = result.RectangleFValue.Size;

if (Element != null){

Element.Margin = new Thickness(0, 0, 0,keyboardSize.Height); //push the entry up to keyboard height when keyboard is activated

}

And this is the result:
https://drive.google.com/file/d/1S9yQ6ks15BRH3hH0j_M8awpDJFRFitUi/view?usp=sharing

The view did push up and the ListView also resized as expected, however there are two issues that I had no idea how to solve it:

1. How can I retain the ListView scroll position after resize?


2. Lack of animation to push up the view

I have search over the web, tried IQKeyboardManager and KeyboardOverLap, The push up animation is nice and smooth, however strange things happened:

https://drive.google.com/file/d/1Zm0lMKB3wq07ve67wlcvLuNM_6Waad7R/view?usp=sharing

1. Instead of resizing the ListView, this approach Push the entire ListView up, that I cannot see the first few items, of course the scroll bar can be scroll out of screen


2. Extra strange spaces at the bottom of the ListView

Any help will be appreciated, thank you!

Solution:

  void OnKeyboardShow(object sender, UIKeyboardEventArgs args)

    {

        NSValue result = (NSValue)args.Notification.UserInfo.ObjectForKey(new NSString(UIKeyboard.FrameEndUserInfoKey));

        CGSize keyboardSize = result.RectangleFValue.Size;

        if (Control != null)

        {

            int bottomMargin = 0;

            var sa = UIApplication.SharedApplication.KeyWindow.SafeAreaInsets;

            bottomMargin = (int)sa.Bottom;



            CGPoint offset = Control.ContentOffset;

            var difference = keyboardSize.Height - bottomMargin;



            if (Control.ContentSize.Height > Control.Frame.Height)

            {

                offset.Y += difference;

                Control.SetContentOffset(offset, true);

            }

            else if (Control.ContentSize.Height + keyboardSize.Height > Control.Frame.Height)

            {

                offset.Y += Control.ContentSize.Height + keyboardSize.Height - Control.Frame.Height - bottomMargin;

                Control.SetContentOffset(offset, true);

            }



            Control.ContentInset = new UIEdgeInsets(0, 0, difference, 0);

            Control.ScrollIndicatorInsets = Control.ContentInset;



        }



    }



    void OnKeyboardHide(object sender, UIKeyboardEventArgs args)

    {

        if (Control != null)

        {

            Control.ContentInset = new UIEdgeInsets(0, 0, 0, 0);

            Control.ScrollIndicatorInsets = new UIEdgeInsets(0, 0, 0, 0);

        }



    }

Solution:

Refer the following code

in iOS Custom Renderer

protected override void OnElementChanged(ElementChangedEventArgs<ListView> e)

{

  base.OnElementChanged(e);



  if(Control!=null)

  {

     Control.KeyboardDismissMode = UIScrollViewKeyboardDismissMode.OnDrag;



     NSNotificationCenter.DefaultCenter.AddObserver(this, new Selector("KeyBoardWillShow:"), new NSString("UIKeyboardWillShowNotification"), null);



     NSNotificationCenter.DefaultCenter.AddObserver(this, new Selector("KeyBoardWillHide:"), new NSString("UIKeyboardWillHideNotification"), null);



  }



}





[Export("KeyBoardWillShow:")]

void KeyBoardWillShow(NSNotification note)

{

  NSValue keyboardRect = (NSValue)note.UserInfo.ObjectForKey(new NSString(UIKeyboard.FrameEndUserInfoKey));

  Control.ContentInset = new UIEdgeInsets(0,0, keyboardRect.RectangleFValue.Size.Height,0);

}





[Export("KeyBoardWillHide:")]

void KeyBoardWillHide(NSNotification note)

{

  Control.ContentInset = UIEdgeInsets.Zero;

}