scb998
scb998

Reputation: 909

make vertical scroll view shrink/expand depending on screen size

I have a Layout with 3 main elements - a layout which contains one Image view, and Vertical Scroll View, and A Horizontal Scroll view. (see XML below:)

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".HomeScreen"
    android:weightSum="1">

    <RelativeLayout
        android:id="@+id/RelLayoutTitleImage"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:weightSum="1">


        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="100dp"
            android:layout_alignParentTop="true"
            android:id="@+id/titleimage"
            android:src="@drawable/saferroadsshellharbourtitle"
            android:layout_weight="0.08" />
    </RelativeLayout>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="272dp"
        android:id="@+id/scrollView"
        android:layout_gravity="center"
        >

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="272dp"
            android:orientation="vertical">

            <ImageButton
                android:layout_width="fill_parent"
                android:layout_height="100dp"
                android:id="@+id/btn_Old_logo"
                android:clickable="true"
                android:src="@drawable/oldlogomenu"/>

            <ImageButton
                android:layout_width="fill_parent"
                android:layout_height="100dp"
                android:id="@+id/btn_report_a_hazard"
                android:layout_below="@+id/btn_Old_logo"
                android:clickable="true"
                android:src="@drawable/reportahazardmenu"/>

            <ImageButton
                android:layout_width="fill_parent"
                android:layout_height="100dp"
                android:layout_below="@+id/btn_report_a_hazard"
                android:id="@+id/btn_Council_Website"
                android:clickable="true"
                android:src="@drawable/councilwebsitemenu"/>

            <ImageButton
                android:layout_width="fill_parent"
                android:layout_height="100dp"
                android:layout_below="@+id/btn_Council_Website"
                android:id="@+id/btn_dob_in_a_hoon"
                android:clickable="true"
                android:src="@drawable/dobinahoonmenu"/>

        </RelativeLayout>
    </ScrollView>


    <HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/horizontalScrollView2"
        android:layout_gravity="bottom">

        <RelativeLayout
            android:orientation="horizontal"
            android:layout_width="120dp"
            android:layout_height="90dp"
            android:gravity="bottom"
            >


            <ImageButton
                android:layout_width="120dp"
                android:layout_height="90dp"
                 android:id="@+id/facebook"
                android:layout_gravity="center_horizontal"
                android:clickable="true"
                android:src="@drawable/facebookbutton"
                android:scaleType="fitCenter"/>

            <ImageButton
                android:layout_width="120dp"
                android:layout_height="90dp"
                android:layout_toRightOf="@+id/facebook"
                android:id="@+id/twitter"
                android:layout_gravity="center_horizontal"
                android:clickable="true"
                android:src="@drawable/scclogoold"
                android:scaleType="fitCenter"/>

            <ImageButton
                android:layout_width="120dp"
                android:layout_height="90dp"
                android:layout_toRightOf="@+id/twitter"
                android:id="@+id/contact"
                android:layout_gravity="center_horizontal"
                android:clickable="true"
                android:src="@drawable/contactbutton"
                android:scaleType="fitCenter"/>

        </RelativeLayout>


    </HorizontalScrollView>


</LinearLayout>

What I would like to do is 'pin' the top edge of the vertical scroll view to the bottom edge of the image view, and the bottom edge of the vertical scroll view to the top edge of the horizontal scroll view. So the vertical scroll view will expand and shrink depending on the screen size of the device.

Could someone please explain how this is achieved?

Upvotes: 0

Views: 1197

Answers (1)

Mike
Mike

Reputation: 1343

This is achieved through using layout_weight as well as WeightSum in the layouts. It will be responsive as to for example I got a horizontal linear layout with 2 buttons I'd set the weightSum of the horizontal layout to 2 and the buttons layout_weight to 1 this will cause a 50% 50% sharing of the layout by the buttons and it will be responsive to the dimensions of the device.

Upvotes: 1

Related Questions