Fold up a Layout but keep another at the bottom

Question

I've got this layout:

Without colors: https://i.stack.imgur.com/OdSda.png

Layout for the tabs (separate xml file)
RelativeLayout 1 surrounding everything else
A, B, C all have their own LinearLayout in RelativeLayout 2
The horizontal line, D (in a LinearLayout) and the "OK" button have their own RelativeLayout 3
And there's RelativeLayout 4 (=footer) for E

What I want to happen if I click on the EditText next to D and the keyboard opens up:

4 stays at the bottom and is hidden behind the keyboard
If there isn't enough space to fully display 3, 2 is collapsed until the keyboard is closed again

What's actually happening:

2 stays where it is
The keyboard covers 3 halfway and I can't see what I'm typing
4 is pushed up and covers D

Two things I've already tried but with both didn't fully work as expected:

I) Add android:windowSoftInputMode="adjustPan" to the manifest:

4 stays at the bottom BUT
Everything else is pushed up, so 2, 3 and the tabs which are then covered half way

II) Add android:windowSoftInputMode="adjustResize" to the manifest: Nothing changes unless I also add android:fitsSystemWindows="true" to the tab fragment's xml:

Now all the padding of the surrounding RelativeLayout 1 is ignored
The EditText next to D is pushed up against 2 but not readable and D and the "OK" button are covered by the keyboard
4 is still pushed up

+Umair Please give a few more details: With which mode in the manifest and which layouts have to be the children? Just 2 or 3 as well? Won't a ScrollView make 2 scrollable then? I don't need that, it's okay if RelativeLayout 2 simply folds up. — Neph, Jun 21 '18 at 11:36
can you post your xml code please ?. And I am saying to use scrollview because if you run your app on a small device it can even half hide view 2 then what will you do ? And yes scrollview will make it scrollable. — Umair, Jun 21 '18 at 11:39
+Umair The app is only going to be used on phone > 5", so no worries there. ;) Furthermore everything looks okay in Android Studio with the peview set to 3.7" or 4". Sorry, it's too much code to add in the first post but it's more or less the same thing for everything: A/B/C and the EditText next to it are in a LinearLayout, so in RelativeLayout 2 it's three LinearLayouts, plus the button. In Relative Layout 3 (set to be below 2) there's just a View (the horizontal line) and a single LinearLayout with three elements. RelativeLayout 4 (set to "alignParentBottom") only has a single TextView (E). — Neph, Jun 21 '18 at 11:50
I now put a ScrollView around RelativeLayout 2 but the results I get are still the same as in my question and nothing is scrollable, even when there's clearly not enough space. — Neph, Jun 21 '18 at 12:13
Ok got it m trying to create the same scenario on my end. Will post the answer soon. :-) — Umair, Jun 21 '18 at 12:14
please take a look at my findings. I didn't achieved quite what you want but I found out couple of things that I mentioned in my answer. — Umair, Jun 21 '18 at 13:12
I've tried a couple of more things but there's always something messed up: I put another RelativeLayout around #2 and a ScrollView around that. 1) With `adjustPan` it leaves the footer where it is but pushes everything up, so the tabs are cut off. Adding `android:fitsSystemWindows="true"` for the surrounding RL doesn't change anything. This also disables scrolling within the ScrollView. 2) `adjustResize`: The keyboard is below the ScrollView and you can scroll within it BUT the footer (#4) is always displayed over #3. `android:fitsSystemWindows="true"` doesn't change anything here either. — Neph, Jun 21 '18 at 13:27
yes exactly. Now there are two options either change your design or leave as it is (normal behavior of android). And the last thing is you getting yourself into developing a custom layout. — Umair, Jun 21 '18 at 13:29
3) `adjustNothing` #4 stays where it is but scrolling is disabled and RL #3 is always cut off by the keyboard. `android:fitsSystemWindows="true"` doesn't change anything here either, so looks like the ScrollView disables it somehow. `adjustResize` would be the way to go here if it just left everything at the bottom actually at the bottom. — Neph, Jun 21 '18 at 13:34
yes you are right but the problem is when you use `adjustResize ` your layout will go up when you popup the keyboard on your `RelativeLayout 4`. — Umair, Jun 21 '18 at 13:35
Ah, I got it! It's really unexpected that it would work like that but it does. Will post it as an answer in a couple of minutes. Thanks for the tip with the ScrollView! — Neph, Jun 21 '18 at 13:46
Okay, answer is posted. Would you mind giving it a try too if you still have everything set up? — Neph, Jun 21 '18 at 14:23

score 1 · Accepted Answer · answered Jun 21 '18 at 14:20

I managed to find a way! :) A big thanks goes to Umair for giving me the tip with the ScrollView and testing different things too!

First of all, this is how the overall layout is built now:

Surrounding RelativeLayout 1 (nothing special, no android:fitsSystemWindows="true" - the ScrollView seems to disable that anyway!)
- new ScrollView
  - new RelativeLayout (ScrollView can only contain a single element!)
    - RelativeLayout 2
      - LinearLayout A (TextView + EditText)
      - LinearLayout B (TextView + EditText)
      - LinearLayout C (TextView + EditText)
      - "Save" Button
    - RelativeLayout 3
      - LinearLayout D (TextView + EditText + "OK" Button)
- RelativeLayout 4 (TextView E)

Manifest:

<activity android:name=".MainActivity"
    android:windowSoftInputMode="adjustResize"
....

Code for RelativeLayout 4:

Before:

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_gravity="bottom">
    <TextView
        android:id="@+id/textE"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/E"
        android:textSize="20sp"/>        
</RelativeLayout>

After:

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_gravity="bottom"
    android:layout_below="@id/ScrollViewABCD"
    android:gravity="bottom">
    <TextView
        android:id="@+id/textE"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/E"
        android:textSize="20sp"/>
</RelativeLayout>

I'm not sure if android:layout_gravity="bottom" is actually needed anymore (android:gravity="bottom" is to have the text at the bottom!) but I haven't noticed any changes without it either.

android:layout_alignParentBottom="true" is the important part here because without it, Relative Layout 4 would be simply below the ScrollView but this little extra makes it use up all the space it can, while still keeping it as far south as possible. Plus, you can still use margins to create some empty space between the ScrollView and RL 4 (even though you're only going to see it in the Preview window in Android Studio).

What this does:

The ScrollView is usable
The keyboard is always below the ScrollView
If there isn't enough space to display the ScrollView AND the keyboard, the former becomes scrollable
RelativeLayout 4 is always hidden behind the keyboard
The tabs stay where they are
The padding of RelativeLayout 1 doesn't get ignored (like it would with android:fitsSystemWindows="true")

that's great. Now it works nearly perfect :D. Glad I could be of help. Happy Coding :) — Umair, Jun 21 '18 at 14:32
Thanks for testing! `nearly perfect` - any changes you would recommend or suggest (no matter if as another programmer or a user)? — Neph, Jun 21 '18 at 14:35
you know there is nothing that is always perfect ;) . Just a suggestion that If I were in your place I would have tried to use as much less layout as I could as they effect performance of your application. But since you had no other choice so I would say to go on with your current answer. All the best (y) — Umair, Jun 21 '18 at 14:56
I see. ;) You should be able to get rid of RelativeLayout 3 and move LinearLayout D into RelativeLayout 2, which means that you can also get rid of the "new RelativeLayout". The rest should be necessary for my solution to work though. I also just noticed that you might be able to replace `android:layout_height="wrap_content"` & ` android:layout_alignParentBottom="true"` with `android:layout_height="match_parent"` - at least I didn't notice any drawbacks. Thanks again! — Neph, Jun 21 '18 at 15:04

score 0 · Answer 2 · answered Jun 21 '18 at 13:11

0

So here's what I came up with: No matter how hard I tried keyboard on my devices/emulators was always at the bottom of layout 3I checked devices with height starting from 4.7 inches min. And if you put adjust:resize in manifest file it will always show last layout on top of keyboard . But if you put adjust:nothing then your bottom layout won't show up even if you want to write something on it. If you put adjust:adjutPan then it will push your layout on top like you said. Now come to the keyboard part:

If you want to take height or check that either your keyboard is covering your layout or not then you need to take height of your screen and keyboard and find out the difference. Take a look at this question.

How to check visibility of software keyboard in Android?

On the bases of that result you can show or hide your layout.

Note: if you want your requirements as it is then you will have to design your custom layout.

answered Jun 21 '18 at 13:11

Umair

6,366
15
42
50

To have the keyboard right under #3 is okay. it's only a problem if #3 is cut off and you can't even see what you're typing into the EditText. The other problem is when #4 gets pushed up over #3 (I tried, `android:layout_marginTop="15dp` doesn't create at least a little bit of empty space). The problem with taking the height is that I have to semi-hardcode it, which isn't optimal either. :/ – Neph Jun 21 '18 at 13:43
Yup giving margin won't make a difference. But I don't know on which resolution you tested but on my side keyboard didn't cut off no 3. And I was using scrollview as parent layout – Umair Jun 21 '18 at 13:53
Just to give some additional info: I tested it with 1440x2560 and the EditText field next to A uses `android:inputType="textMultiLine"` (the others don't), so if you input a couple of lines of text, RelativeLayout 3 is in the bottom half of the screen and is covered up half-way by the keyboard. The same thing happens at lower resolutions (e.g. 4" with 480x800), even with just a single line of text. – Neph Jun 21 '18 at 15:12

Fold up a Layout but keep another at the bottom

2 Answers2

Linked