Repository: flutter
Issue: Is that possible to replace the keyboard position with another widget and keep TextField position unchanged during keyboard animation?
Labels: a: text input,c: new feature,framework,f: material design,P3,team-design,triaged-design

Flutter version

```
[✓] Flutter (Channel master, v1.5.9-pre.205, on Mac OS X 10.13.6 17G4015, locale en-CN)
```

Hi, I will try my best to describe the problem. Basically, I want to achieve what many messenger apps do when clicking Emoji icon when keyboard is present. All messenger apps including Facebook messenger, WeChat etc.. are doing the same thing. But I have spent two days to try to do the same in Flutter, but failed. 

First, hiding and showing keyboard are easy by the code `SystemChannels.textInput.invokeMethod('TextInput.hide');` and `SystemChannels.textInput.invokeMethod('TextInput.show');`

When clicking the Emoji button, I want the textfield row position remains unchanged, then hide the keyboard and the keyboard original position should be replaced by the emoji panel. But the current behavior is the keyboard showing and hiding actions will change the UI layout during the animation. This does not happen to all the native apps that I use. Something like the following:

## Showing Emoji Panel When Keyboard OnScreen

Original Screen:

```
-------Column-------
-- ListView
----------------------
-- TextFieldRow  
----------------------
-- Keyboard
----------------------
```

After clicking Emoji Icon:

Phase 1 Screen:

```
-------Column-------
-- ListView
----------------------
-- TextFieldRow  
----------------------
-- Emoji Panel
----------------------
-- Keyboard
----------------------
```

ListView and Emoji Panel positions changed because Both Emoji Panel and Keyboard are present at the same time. and NOTE THAT their positions will keep changing during keyboard moving down.

Phase 2 Screen:

```
-------Column-------
-- ListView
----------------------
-- TextFieldRow  
----------------------
-- Emoji Panel
----------------------
```

ListView and Emoji Panel positions changed because Keyboard is finally gone.

## Hiding Emoji Panel and Bring Keyboard Back

Original Screen:

```
-------Column-------
-- ListView
----------------------
-- TextFieldRow  
----------------------
-- Emoji Panel
----------------------
```

Clicking Emoji Icon (or Keyboard Icon)

Phase 1 Screen:

```
-------Column-------
-- ListView
----------------------
-- TextFieldRow  
----------------------
```

ListView and TextFieldRow positions changed because emoji panel is gone. 

Phase 2 Screen:

```
-------Column-------
-- ListView
----------------------
-- TextFieldRow  
----------------------
-- Keyboard
----------------------
```

ListView and Emoji Panel's positions keeps changing while keyboard is moving up. 

## What I expect

I expect the ListView and TextFieldRow will not change their positions while the keyboard is moving up or down and emoji shows or hides. And this is what all native apps I used so far do. I tried many codes including playing around Stack, resizeToAvoidBottomPadding property etc.. But nothing works so far. 

(Btw, I can get keyboard height with `MediaQuery.of(context).viewInsets.bottom`, so setting the same height to emoji panel as the keyboard is not a problem. and even if the emoji panel has a a little bit different height, the positions change should be around some pixels instead of the current behaviors)

Thank you very much for your help.