Skip to content Skip to sidebar Skip to footer
Home / Android / Java / Scrollview / Xml Layout

Scroll View With Two Buttons At The Bottom Of The Layout

Post a Comment
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

Solution 1:

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:

<ScrollViewxmlns: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" ><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:orientation="vertical"><TextViewandroid: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" /><TextViewandroid: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" /><EditTextandroid: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><EditTextandroid: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><FrameLayoutandroid:id="@+id/whiteSpace"android:layout_width="match_parent"android:layout_height="450dp"android:layout_gravity="center_horizontal" /><Buttonandroid: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><Buttonandroid: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:

finalScrollViewmScrollView= (ScrollView)findViewById(R.id.my_scrollview);
finalViewwhiteSpace= findViewById(R.id.whiteSpace);
finalEditTextpassword= (EditText)findViewById(R.id.passwordSignUp);
whiteSpace.getViewTreeObserver().addOnGlobalLayoutListener(newViewTreeObserver.OnGlobalLayoutListener() {
    @OverridepublicvoidonGlobalLayout() {
        // Check OS version as removeOnGlobalLayoutListener is available API>=11// and removeGlobalOnLayoutListener is deprecated in API<11if(Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN) {
            whiteSpace.getViewTreeObserver().removeGlobalOnLayoutListener(this);
        } else {
            whiteSpace.getViewTreeObserver().removeOnGlobalLayoutListener(this);
        }
        // Compute the height
        LinearLayout.LayoutParamsparams= (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.

Solution 2:

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.

<RelativeLayoutxmlns: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" ><ScrollViewandroid:id="@+id/my_scrollview"android:layout_width="fill_parent"android:layout_height="fill_parent"android:layout_above="@+id/LinearLayout01"android:scrollbars="horizontal" ><RelativeLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content" ><TextViewandroid: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" /><TextViewandroid: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" /><EditTextandroid: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><EditTextandroid: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><Buttonandroid: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><Buttonandroid: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>

Solution 3:

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.

<RelativeLayoutxmlns: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" ><ScrollViewandroid:id="@+id/my_scrollview"android:layout_width="fill_parent"android:layout_height="fill_parent"android:layout_above="@+id/LinearLayout01"android:scrollbars="horizontal" ><RelativeLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content" ><TextViewandroid: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" /><TextViewandroid: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" /><EditTextandroid: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><EditTextandroid: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><Buttonandroid: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><Buttonandroid: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>

Solution 4:

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.

<RelativeLayoutandroid: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" ><ScrollViewandroid:id="@+id/my_scrollview"android:layout_width="fill_parent"android:layout_height="fill_parent"android:scrollbars="horizontal" ><RelativeLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content" ><TextViewandroid: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" /><TextViewandroid: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" /><EditTextandroid: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><EditTextandroid: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><LinearLayoutandroid: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"><Buttonandroid:id="@+id/signUpBtn"android:layout_width="fill_parent"android:layout_height="wrap_content"android:text="Sign Up"android:textColor="#FFFFFF"android:textSize="20sp" ></Button><Buttonandroid: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>

Solution 5:

try this..

<ScrollViewxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="wrap_content"android:scrollbars="horizontal" ><LinearLayoutandroid: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" ><LinearLayoutandroid:id="@+id/top"android:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="1"android:orientation="vertical" ><TextViewandroid: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"/><TextViewandroid: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><LinearLayoutandroid:id="@+id/middle"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_weight="1"android:orientation="vertical" ><EditTextandroid: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><EditTextandroid: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><LinearLayoutandroid:id="@+id/bot"android:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="1"android:orientation="vertical" ><Buttonandroid:id="@+id/signUpBtn"android:layout_width="fill_parent"android:layout_height="wrap_content"android:text="Sign Up"android:textColor="#FFFFFF"android:textSize="20sp" ></Button><Buttonandroid: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>

Post a Comment for "Scroll View With Two Buttons At The Bottom Of The Layout"