2

I want to create a layout which will have a scrollview, inside the srollview at the top of the layout there will be two Textviews. In the center there will be two Edittexts and at the bottom of the layout, there will be two buttons. But everything will be under the main scrollview.

A visual description of my requirement:

Required output

I have done some coding which scrolls the top content but keeps the buttons at the bottom out of the scrollview which is not the expected functionality.

My layout coding:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin" >

    <ScrollView
        android:id="@+id/my_scrollview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_above="@+id/LinearLayout01"
        android:scrollbars="horizontal" >

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <TextView
                android:id="@+id/welcomeToStudy"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_centerHorizontal="true"
                android:text="Welcome to xxxxxxxxxxxxxxx!"
                android:textAppearance="?android:attr/textAppearanceLarge"
                android:textColor="#54575A"
                android:textSize="28sp" />

            <TextView
                android:id="@+id/pleaseEnter"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/welcomeToStudy"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="5dp"
                android:text="Please enter your details xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx."
                android:textSize="20sp" />

            <EditText
                android:id="@+id/emailSignUp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/pleaseEnter"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="5dp"
                android:ems="10"
                android:hint="Email"
                android:inputType="textEmailAddress"
                android:singleLine="true"
                android:textSize="24sp" >
            </EditText>

            <EditText
                android:id="@+id/passwordSignUp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/emailSignUp"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="5dp"
                android:ems="10"
                android:hint="Password"
                android:inputType="textPassword"
                android:singleLine="true"
                android:textSize="24sp" >
            </EditText>
        </RelativeLayout>
    </ScrollView>

    <LinearLayout
        android:id="@+id/LinearLayout01"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="vertical" 
        android:layout_marginTop="5dp">

        <Button
            android:id="@+id/signUpBtn"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/next_button_selector"
            android:text="Sign Up"
            android:textColor="#FFFFFF"
            android:textSize="20sp" >
        </Button>

        <Button
            android:id="@+id/registerWithFb"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:background="@drawable/next_button_xhdpi_facebook"
            android:text="Sign up with Facebook"
            android:textColor="#FFFFFF"
            android:textSize="20sp" >
        </Button>
    </LinearLayout>

</RelativeLayout>

What should I do to get the expected output?

kittu88
  • 2,451
  • 5
  • 40
  • 80
  • change the scrollview height as the `android:layout_height="match_parent"` because your before set the fill_parent – prakash Dec 17 '14 at 05:33
  • What is the problem actually, u want to scroll the buttons also? Sorry i didnt get you thats why. – Remees M Syde Dec 17 '14 at 05:37
  • @RemeesMSyde yes I want to scroll the full view everything including the buttons – kittu88 Dec 17 '14 at 05:41
  • @kittu88 Use scrollView as a parent and then linearlayout as a sublayout. – Shvet Dec 17 '14 at 05:42
  • @kittu88 why don't you just put the `Button`s inside the `ScrollView`? (Sorry, I didn't get it neither) – peguerosdc Dec 17 '14 at 05:42
  • @peguerosdc If I do so, then the full view stops scrolling and secondly, I want the buttons at the bottom of the screen being a part of the scrollview – kittu88 Dec 17 '14 at 05:44

6 Answers6

4

If I got you well, you want a white space between your password EditText and your Buttons. If that's it, then just add a dummy View like this:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/my_scrollview"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scrollbars="horizontal" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            android:id="@+id/welcomeToStudy"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Welcome to xxxxxxxxxxxxxxx!"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textColor="#54575A"
            android:textSize="28sp" />

        <TextView
            android:id="@+id/pleaseEnter"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:text="Please enter your details xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx."
            android:textSize="20sp" />

        <EditText
            android:id="@+id/emailSignUp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:ems="10"
            android:hint="Email"
            android:inputType="textEmailAddress"
            android:singleLine="true"
            android:textSize="24sp" >
        </EditText>

        <EditText
            android:id="@+id/passwordSignUp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:ems="10"
            android:hint="Password"
            android:inputType="textPassword"
            android:singleLine="true"
            android:textSize="24sp" >
        </EditText>

        <FrameLayout
            android:id="@+id/whiteSpace"
            android:layout_width="match_parent"
            android:layout_height="450dp"
            android:layout_gravity="center_horizontal" />

        <Button
            android:id="@+id/signUpBtn"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/next_button_selector"
            android:text="Sign Up"
            android:textColor="#FFFFFF"
            android:textSize="20sp" >
        </Button>

        <Button
            android:id="@+id/registerWithFb"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:background="@drawable/next_button_xhdpi_facebook"
            android:text="Sign up with Facebook"
            android:textColor="#FFFFFF"
            android:textSize="20sp" >
        </Button>

    </LinearLayout>
</ScrollView>

Now, if you want the white space to have the exact height so the Buttons don't go down too much in the ScrollView, (I think) you can't do it just by XML, but you can compute the needed height in your onCreate method:

final ScrollView mScrollView = (ScrollView)findViewById(R.id.my_scrollview);
final View whiteSpace = findViewById(R.id.whiteSpace);
final EditText password = (EditText)findViewById(R.id.passwordSignUp);
whiteSpace.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
    @Override
    public void onGlobalLayout() {
        // Check OS version as removeOnGlobalLayoutListener is available API>=11
        // and removeGlobalOnLayoutListener is deprecated in API<11
        if(Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN) {
            whiteSpace.getViewTreeObserver().removeGlobalOnLayoutListener(this);
        } else {
            whiteSpace.getViewTreeObserver().removeOnGlobalLayoutListener(this);
        }
        // Compute the height
        LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) whiteSpace.getLayoutParams();
        params.height = mScrollView.getHeight() - whiteSpace.getTop();
        whiteSpace.setLayoutParams(params);
    }
});

This is the expected output: enter image description here

If you want a different height then just change the value assigned in

params.height = mScrollView.getHeight() - whiteSpace.getTop();

as my value is calculated to be the exact height needed so the Buttons can be just below your visible screen. Computing another value depends on your requirements and it's out of the scope of your question.

peguerosdc
  • 946
  • 11
  • 21
  • too much of whitespace even on 5 inch device scroll shows up – kittu88 Dec 17 '14 at 06:17
  • @kittu88 you mean that `450dp` was not enough? If that's the case then do it programatically. – peguerosdc Dec 17 '14 at 06:19
  • 450dp was more that enough, rather too much, but it should be dynamic I think as if the app runs in a 7 inch device what can be the output? I do not have one to test at this point of time – kittu88 Dec 17 '14 at 06:21
  • @kittu88 then put a lower value, it depends on how much you want. As I said, if you want the exact height, compute it. – peguerosdc Dec 17 '14 at 06:23
  • any suggestions on the computing? how to do that? – kittu88 Dec 17 '14 at 06:24
  • @kittu88 it is in my answer, the last part. – peguerosdc Dec 17 '14 at 06:26
  • ok..............if I use that, then should I remove the hard coded height that you have used for the whitespace in the xml layout? – kittu88 Dec 17 '14 at 06:30
  • @kittu88 it doesn't matter, it will be replaced with the computed height – peguerosdc Dec 17 '14 at 06:33
  • what was the need of checking the sdk version? mScrollView.getHeight() - whiteSpace.getTop() what should be the output? how can I lessen the value as its too large? – kittu88 Dec 17 '14 at 06:37
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/67089/discussion-between-peguerosdc-and-kittu88). – peguerosdc Dec 17 '14 at 06:52
  • Thanks you made me understand the whole scenario, I have posted the actual answer. – kittu88 Dec 17 '14 at 10:02
0

You just need to put your buttons inside the RelativeLayout that is the child of the ScrollView. You don't actually need the root RelativeLayout then, but I've left it in in case there's some other reason you need it -- if there's something else you really don't want to scroll.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin" >

    <ScrollView
        android:id="@+id/my_scrollview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_above="@+id/LinearLayout01"
        android:scrollbars="horizontal" >

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <TextView
                android:id="@+id/welcomeToStudy"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_centerHorizontal="true"
                android:text="Welcome to xxxxxxxxxxxxxxx!"
                android:textAppearance="?android:attr/textAppearanceLarge"
                android:textColor="#54575A"
                android:textSize="28sp" />

            <TextView
                android:id="@+id/pleaseEnter"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/welcomeToStudy"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="5dp"
                android:text="Please enter your details xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx."
                android:textSize="20sp" />

            <EditText
                android:id="@+id/emailSignUp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/pleaseEnter"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="5dp"
                android:ems="10"
                android:hint="Email"
                android:inputType="textEmailAddress"
                android:singleLine="true"
                android:textSize="24sp" >
            </EditText>

            <EditText
                android:id="@+id/passwordSignUp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/emailSignUp"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="5dp"
                android:ems="10"
                android:hint="Password"
                android:inputType="textPassword"
                android:singleLine="true"
                android:textSize="24sp" >
            </EditText>

            <Button
                android:id="@+id/signUpBtn"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/passwordSignUp"
                android:background="@drawable/next_button_selector"
                android:text="Sign Up"
                android:textColor="#FFFFFF"
                android:textSize="20sp" >
            </Button>

            <Button
                android:id="@+id/registerWithFb"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="8dp"
                android:layout_below="@+id/signUpBtn"
                android:background="@drawable/next_button_xhdpi_facebook"
                android:text="Sign up with Facebook"
                android:textColor="#FFFFFF"
                android:textSize="20sp" >
            </Button>
        </RelativeLayout>
    </ScrollView>
</RelativeLayout>
Bruce
  • 2,377
  • 1
  • 17
  • 11
0

Add the linear layout contents to your relative layout inside scrollview will work I think. Or make the scrollview as root parent also will work.

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin" >

        <ScrollView
            android:id="@+id/my_scrollview"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_above="@+id/LinearLayout01"
            android:scrollbars="horizontal" >

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content" >

                <TextView
                    android:id="@+id/welcomeToStudy"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentTop="true"
                    android:layout_centerHorizontal="true"
                    android:text="Welcome to xxxxxxxxxxxxxxx!"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:textColor="#54575A"
                    android:textSize="28sp" />

                <TextView
                    android:id="@+id/pleaseEnter"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/welcomeToStudy"
                    android:layout_centerHorizontal="true"
                    android:layout_marginTop="5dp"
                    android:text="Please enter your details xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx."
                    android:textSize="20sp" />

                <EditText
                    android:id="@+id/emailSignUp"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/pleaseEnter"
                    android:layout_centerHorizontal="true"
                    android:layout_marginTop="5dp"
                    android:ems="10"
                    android:hint="Email"
                    android:inputType="textEmailAddress"
                    android:singleLine="true"
                    android:textSize="24sp" >
                </EditText>

                <EditText
                    android:id="@+id/passwordSignUp"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/emailSignUp"
                    android:layout_centerHorizontal="true"
                    android:layout_marginTop="5dp"
                    android:ems="10"
                    android:hint="Password"
                    android:inputType="textPassword"
                    android:singleLine="true"
                    android:textSize="24sp" >
                </EditText>



            <Button
                android:id="@+id/signUpBtn"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/next_button_selector"
                android:text="Sign Up"
                android:textColor="#FFFFFF"
                android:textSize="20sp" >
            </Button>

            <Button
                android:id="@+id/registerWithFb"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="8dp"
                android:background="@drawable/next_button_xhdpi_facebook"
                android:text="Sign up with Facebook"
                android:textColor="#FFFFFF"
                android:textSize="20sp" >
            </Button>

        </RelativeLayout>
        </ScrollView>

    </RelativeLayout>
Remees M Syde
  • 2,564
  • 1
  • 19
  • 42
0

try this..

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scrollbars="horizontal" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin"
        android:weightSum="3" >

        <LinearLayout
            android:id="@+id/top"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/welcomeToStudy"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Welcome to xxxxxxxxxxxxxxx!"
                android:textAppearance="?android:attr/textAppearanceLarge"
                android:textColor="#54575A"
                android:textSize="28sp" 
                android:gravity="center"/>

            <TextView
                android:id="@+id/pleaseEnter"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="5dp"
                android:text="Please enter your details xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx."
                android:textSize="20sp"
                android:gravity="center" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/middle"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:orientation="vertical" >

            <EditText
                android:id="@+id/emailSignUp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:ems="10"
                android:hint="Email"
                android:inputType="textEmailAddress"
                android:singleLine="true"
                android:textSize="24sp" >
            </EditText>

            <EditText
                android:id="@+id/passwordSignUp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:ems="10"
                android:hint="Password"
                android:inputType="textPassword"
                android:singleLine="true"
                android:textSize="24sp" >
            </EditText>
        </LinearLayout>

        <LinearLayout
            android:id="@+id/bot"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:orientation="vertical" >

            <Button
                android:id="@+id/signUpBtn"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:text="Sign Up"
                android:textColor="#FFFFFF"
                android:textSize="20sp" >
            </Button>

            <Button
                android:id="@+id/registerWithFb"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="8dp"
                android:text="Sign up with Facebook"
                android:textColor="#FFFFFF"
                android:textSize="20sp" >
            </Button>
        </LinearLayout>
    </LinearLayout>

</ScrollView>
M S Gadag
  • 2,057
  • 1
  • 12
  • 15
  • Not a solution, button shows up just under the edittext in 5 inch screen devices. It needs to be in the bottom. – kittu88 Dec 17 '14 at 06:05
0

First of all i want to tell u that scroll view only works when the layout is not fitting into the screen then extra content android shows int the scroll view. if the content is fit into the device screen size then scroll view will not work. if you design your layout according to the big screen device the and then u use that layout into small screen device the this layout shows into scroll. but if you design your layout according to the small screen device the and then u use that layout into big screen device the this layout does not show into scroll.

i used this layout into small screen size mobile. e.i samsung s2.

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin" >

        <ScrollView
            android:id="@+id/my_scrollview"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:scrollbars="horizontal" >

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content" >

                <TextView
                    android:id="@+id/welcomeToStudy"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentTop="true"
                    android:layout_centerHorizontal="true"
                    android:layout_marginTop="35dp"
                    android:text="Welcome to xxxxxxxxxxxxxxx!"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:textColor="#54575A"
                    android:textSize="28sp" />

                <TextView
                    android:id="@+id/pleaseEnter"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/welcomeToStudy"
                    android:layout_centerHorizontal="true"
                    android:layout_marginTop="35dp"
                    android:text="Please enter your details xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx."
                    android:textSize="20sp" />

                <EditText
                    android:id="@+id/emailSignUp"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/pleaseEnter"
                    android:layout_centerHorizontal="true"
                    android:layout_marginTop="35dp"
                    android:ems="10"
                    android:hint="Email"
                    android:inputType="textEmailAddress"
                    android:singleLine="true"
                    android:textSize="24sp" >
                </EditText>

                <EditText
                    android:id="@+id/passwordSignUp"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/emailSignUp"
                    android:layout_centerHorizontal="true"
                    android:layout_marginTop="35dp"
                    android:ems="10"
                    android:hint="Password"
                    android:inputType="textPassword"
                    android:singleLine="true"
                    android:textSize="24sp" >
                </EditText>

                <LinearLayout
                    android:id="@+id/LinearLayout01"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_alignParentBottom="true"
                    android:layout_marginTop="35dp"
                    android:orientation="vertical" 
                    android:layout_below="@+id/passwordSignUp">

                    <Button
                        android:id="@+id/signUpBtn"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:text="Sign Up"
                        android:textColor="#FFFFFF"
                        android:textSize="20sp" >
                    </Button>

                    <Button
                        android:id="@+id/registerWithFb"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="8dp"
                        android:text="Sign up with Facebook"
                        android:textColor="#FFFFFF"
                        android:textSize="20sp" >
                    </Button>
                </LinearLayout>
            </RelativeLayout>
        </ScrollView>
    </RelativeLayout>
Umesh Kumar Saraswat
  • 758
  • 3
  • 10
  • 28
0

On the basis of peguerosdc's answer, I made some modifications and got the whole thing to work. The new layout code:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:descendantFocusability="beforeDescendants"
    android:focusableInTouchMode="true"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin" >

    <ScrollView
        android:id="@+id/my_scrollview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

        <RelativeLayout
            android:id="@+id/main_relative_layout"
            android:layout_width="match_parent"
            android:layout_height="53dp" >

            <TextView
                android:id="@+id/welcomeToStudy"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="35dp"
                android:text="Welcome to xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
                android:textAppearance="?android:attr/textAppearanceLarge"
                android:textColor="#54575A"
                android:textSize="28sp" />

            <TextView
                android:id="@+id/pleaseEnter"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/welcomeToStudy"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="16dp"
                android:text="Please enter your details xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx."
                android:textSize="20sp" />

            <EditText
                android:id="@+id/emailSignUp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/pleaseEnter"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="35dp"
                android:ems="10"
                android:hint="Email"
                android:inputType="textEmailAddress"
                android:singleLine="true"
                android:textSize="24sp" >
            </EditText>

            <EditText
                android:id="@+id/passwordSignUp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/emailSignUp"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="8dp"
                android:ems="10"
                android:hint="Password"
                android:inputType="textPassword"
                android:singleLine="true"
                android:textSize="24sp" >
            </EditText>

            <LinearLayout
                android:id="@+id/LinearLayout01"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_below="@+id/passwordSignUp"
                android:layout_marginTop="35dp"
                android:orientation="vertical" >

                <Button
                    android:id="@+id/signUpBtn"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:background="@drawable/next_button_selector"
                    android:text="Sign Up"
                    android:textColor="#FFFFFF"
                    android:textSize="20sp" >
                </Button>

                <Button
                    android:id="@+id/registerWithFb"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="16dp"
                    android:background="@drawable/next_button_xhdpi_facebook"
                    android:text="Sign up with Facebook"
                    android:textColor="#FFFFFF"
                    android:textSize="20sp" >
                </Button>
            </LinearLayout>
        </RelativeLayout>
    </ScrollView>

</RelativeLayout>

The approach is to change the main_relative_layout value programatically according to the device screen size in order to accommodate the layout in the screens. I did not use a whitespace though, I aligned the LinearLayout01 to ParentBottom.

The code to get the screen size of the device and change main_relative_layout programatically (inside onCreate):

// for button placement purely design workout
        DisplayMetrics displayMetrics = this.getResources().getDisplayMetrics();

        float dpHeight = displayMetrics.heightPixels / displayMetrics.density;
        float dpWidth = displayMetrics.widthPixels / displayMetrics.density;

        Log.e("Screen height:", "" + dpHeight);
        RelativeLayout rl = (RelativeLayout) findViewById(R.id.main_relative_layout);
        rl.getLayoutParams().height = dpToPx((int) dpHeight - 70);

The method dpToPx:

//method to convert from dp to px
    public int dpToPx(int dp) {
        DisplayMetrics displayMetrics = SignUp.this.getResources().getDisplayMetrics();
        int px = Math.round(dp * (displayMetrics.xdpi / DisplayMetrics.DENSITY_DEFAULT));       
        return px;
    }
Community
  • 1
  • 1
kittu88
  • 2,451
  • 5
  • 40
  • 80