# Text input now squashes screen arrangement

**URL:** <https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934>\
**Category:** Questions about Thunkable X\
**Created:** [November 18, 2018, 11:50am UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934 "2018-11-18T11:50:41Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![badbrains](https://avatars.discourse-cdn.com/v4/letter/b/ba9def/32.png) [@badbrains](https://community.thunkable.com/u/badbrains)\
**Post date:** [November 18, 2018, 11:50am UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/1 "2018-11-18T11:50:41Z")

</div>

Hi If someone out there could give me some help on this I would be really grateful;  
The project Ive been working on for the last 6 months or so uses a text input in the centre of the screen arrangement with a row of buttons along the top and a row along the bottom.  
I made the layout so the bottom row contains buttons for functions not relevant for use while text input is in use.  
Up to a few days ago when the text input was opened the keyboard covered the bottom row of buttons.  
I haven’t changed any settings or design elements but now when I live test  
when the text input opens the keyboard pushes the bottom row of buttons up into the area above the keyboard  
this squashes the arrangement  
Even more of a problem when more than one line of text is input into the text box the first line is pushed up and hidden under the top row of buttons.  
Help!!!

---

<div class="post-metadata">

**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\
**Post date:** [November 18, 2018, 12:19pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/2 "2018-11-18T12:19:17Z")

</div>

Hi,

Is the keyboard moving the input field? Finally, the developers fixed the bug when it did not move! But it seems that it does not work as well as you would like.

Can you give a link to your project or show how everything is in your project?

---

<div class="post-metadata">

**Author:** ![badbrains](https://avatars.discourse-cdn.com/v4/letter/b/ba9def/32.png) [@badbrains](https://community.thunkable.com/u/badbrains)\
**Post date:** [November 18, 2018, 12:35pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/3 "2018-11-18T12:35:33Z")

</div>

Hi yes seems like when the keyboard pops up it pushes / squeezes the whole arrangement up above it. The strange thing is this just started happening a couple of days ago. Up to now the keyboard covered the lower elements of the arrangement which worked perfectly for me.  
previously if the text input ran into more than one line it would just continue below leaving the first line still visible and the text readable as a whole.

---

<div class="post-metadata">

**Author:** ![badbrains](https://avatars.discourse-cdn.com/v4/letter/b/ba9def/32.png) [@badbrains](https://community.thunkable.com/u/badbrains)\
**Post date:** [November 18, 2018, 12:38pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/4 "2018-11-18T12:38:03Z")

</div>

[https://x.thunkable.com/copy/99776e70ba6e76992fcc2a51b5e5faca](https://x.thunkable.com/copy/99776e70ba6e76992fcc2a51b5e5faca)

---

<div class="post-metadata">

**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\
**Post date:** [November 18, 2018, 12:41pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/5 "2018-11-18T12:41:31Z")

</div>

Now the keyboard works more correctly. Previously, I created all the input fields only at the top of the screen, as it simply closed the input, which was just a nightmare.

The keyboard pulls up the work area upwards, so absolute positioning also does not allow the buttons to remain at the bottom. You can try using Botom Tab Navigator. I see on the Instagram registration screen how the “Button” button is pulled up by the keyboard from the bottom, and after closing the keyboard it jumps down - an unpleasant effect!

---

<div class="post-metadata">

**Author:** ![badbrains](https://avatars.discourse-cdn.com/v4/letter/b/ba9def/32.png) [@badbrains](https://community.thunkable.com/u/badbrains)\
**Post date:** [November 18, 2018, 12:47pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/6 "2018-11-18T12:47:48Z")

</div>

Thanks for getting back to me.  
So is this a temporary problem that will be fixed and revert to the previous way of keyboard covering elements or it is peremnant and I need to change my settings somehow to get around this?

---

<div class="post-metadata">

**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\
**Post date:** [November 18, 2018, 12:54pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/7 "2018-11-18T12:54:39Z")

</div>

I think you need to change the solution with a button and use another solution instead. But work on the keyboard will continue, because not everything is working well with it. For example, after entering a line in a multi-field, my keyboard closes after each press of the return key — which is very inconvenient for entering multi-line text.

---

<div class="post-metadata">

**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\
**Post date:** [November 18, 2018, 12:59pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/8 "2018-11-18T12:59:06Z")

</div>

It is interesting that when opening the keyboard, the bottom edge of the page is not always pulled from its very bottom edge. It needs to be studied in more detail.

---

<div class="post-metadata">

**Author:** ![badbrains](https://avatars.discourse-cdn.com/v4/letter/b/ba9def/32.png) [@badbrains](https://community.thunkable.com/u/badbrains)\
**Post date:** [November 18, 2018, 1:53pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/9 "2018-11-18T13:53:01Z")

</div>

Thanks for your help. I think I could partly solve my problem if I could set the text from the input to continue below instead of pushing the previous line upwards. Do you have any idea what settings on the text input would do this?

---

<div class="post-metadata">

**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\
**Post date:** [November 18, 2018, 1:57pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/10 "2018-11-18T13:57:24Z")

</div>

I’ll think about what you can do here.

You have very complicated markup on Screen1. Can it be simplified?

---

<div class="post-metadata">

**Author:** ![badbrains](https://avatars.discourse-cdn.com/v4/letter/b/ba9def/32.png) [@badbrains](https://community.thunkable.com/u/badbrains)\
**Post date:** [November 18, 2018, 2:18pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/11 "2018-11-18T14:18:26Z")

</div>

yes I realise that but I think I need all of the elements on this screen.  
thanks

---

<div class="post-metadata">

**Author:** ![badbrains](https://avatars.discourse-cdn.com/v4/letter/b/ba9def/32.png) [@badbrains](https://community.thunkable.com/u/badbrains)\
**Post date:** [November 18, 2018, 2:38pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/12 "2018-11-18T14:38:34Z")

</div>

I have now tried changing the layout with the text input field lower with space above to fit several lines but as soon as the text exceeds 1 line the first line is not visible anymore even if there is no element above for it to be obscured by. seems strange

---

<div class="post-metadata">

**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\
**Post date:** [November 18, 2018, 3:24pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/13 "2018-11-18T15:24:13Z")

</div>

I see a problem, but I don’t quite understand why you have such complicated markup on your screen and use so many empty buttons and labels. The harder the markup, the harder it will be to debug the screen.

---

<div class="post-metadata">

**Author:** ![Mr\_Nicolas](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/mr_nicolas/32/34033_2.png) [@Mr\_Nicolas](https://community.thunkable.com/u/Mr_Nicolas)\
**Post date:** [November 21, 2018, 7:47pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/14 "2018-11-21T19:47:00Z")

</div>

Solution is vertical scroll arrangement. Try to put all screen componenets inside of the main vertical scroll arrangement

---

<div class="post-metadata">

**Author:** ![badbrains](https://avatars.discourse-cdn.com/v4/letter/b/ba9def/32.png) [@badbrains](https://community.thunkable.com/u/badbrains)\
**Post date:** [November 26, 2018, 10:09pm UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/15 "2018-11-26T22:09:13Z")

</div>

Thanks but this also doesn’t work for me. My understanding now is that the text input has been redesigned to avoid covering any of the elements on the screen. Unfortunately I designed my layout with the previous functionality of the text input. thanks for your help though 👍

---

<div class="post-metadata">

**Author:** ![ioannis](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannis/32/146956_2.png) [@ioannis](https://community.thunkable.com/u/ioannis)\
**Post date:** [November 8, 2024, 11:52am UTC](https://community.thunkable.com/t/text-input-now-squashes-screen-arrangement/56934/16 "2024-11-08T11:52:37Z")

</div>


