Android Scrollview in RelativeLayout with ButtonBar
Asked Answered
A

2

8

I'm trying to implement a login view where several EditTexts and a logo are displayed on the screen with a ButtonBar at the bottom, something like this:

alt text http://russellhaering.com/media/addAccount.png

The problem is that on very small screens, especially when they are rotated sideways, the entire main view doesn't fit onto the screen.

I currently have

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#234C59"  >
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:paddingTop="5dip"
        android:paddingLeft="15dip"
        android:paddingRight="15dip"
        android:orientation="vertical" >
        <ImageView
            android:id="@+id/logo"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:scaleType="fitCenter"
            android:layout_centerHorizontal="true"
            android:src="@drawable/logo" />
        <EditText
            android:id="@+id/input_email"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dip"
            android:inputType="textEmailAddress"
            android:singleLine="true"
            android:hint="Username or email" />
        <EditText
            android:id="@+id/input_password"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop=""
            android:inputType="textPassword"
            android:singleLine="true"
            android:hint="Password" />
    </LinearLayout>
    <LinearLayout
        android:id="@+id/buttonbar_login"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal"
        style="@android:style/ButtonBar" >
        <Button
            android:id="@+id/button_signup"
            android:layout_width="0dip"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Sign Up" />
        <Button
            android:id="@+id/button_login"
            android:layout_width="0dip"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Log In" />
    </LinearLayout>
</RelativeLayout>

I've tried encapsulating the first LinnearLayout in a ScrollView that looks like this:

<ScrollView
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
            <!-- Linear Layout Here -->
</ScrollView>

But that introduces two problems:

  1. The ScrollView doesn't scroll, even on screens where the data doesn't all fit

  2. The ButtonBar floats on top of the onscreen keyboard, obscuring even more of the screen when the keyboard comes up.

Everything worked great when I had the buttons inside the ScrollView, but now that I have them in the ButtonBar I'm having a lot of trouble figuring this out.

Anthia answered 3/8, 2010 at 3:19 Comment(0)
A
15

It turned out that the solution required two steps:

  1. The inability to scroll was a result of the ScrollView being behind the Button Bar. To fix this, I defined the ScrollView below the Button Bar, then used android:layout_above="@id/buttonbar_login" to force the ScrollView to reside entirely above the Button Bar.

  2. Apparently when the onscreen keyboard is opened, if you have a ScrollView it will be resized allowing the Button Bar to float up with the keyboard. To fix this I modified the manifest and added android:windowSoftInputMode="adjustPan" to prevent the ScrollView from resizing.

Anthia answered 3/8, 2010 at 5:36 Comment(0)
T
0

If your use case supports hiding of the button bar in landscape orientation you can check Resources.getSystem().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE and set the button bar to View.GONE.

You also probably need to set android:windowSoftInputMode="adjustResize" on the <activity> in your manifest file. Android will only put it in adjustResize automatically when the root layout is a ScrollView (iirc).

Toxophilite answered 3/8, 2010 at 3:57 Comment(1)
Unfortunately, I need to keep the button bar visible in landscape, as you need the bar to submit the form (and I don't want someone on a G1 or whatever to have to close the keyboard and rotate the phone to submit). The good news is that your suggestion with regards to android:windowSoftInputMode="adjustResize" put me on the right track and I was able to work it out. I'll post my answer momentarily. Thanks for the help!Anthia

© 2022 - 2024 — McMap. All rights reserved.