Search code examples
javaandroidlistviewscrollviewandroid-relativelayout

Scroll middle content with ListView in Android Layout


I'm developing android app as per the following design.

test

I want to set the height of the scroll view to the remaining screen size (after occupied by header,footer and other texts) although there are no any contents in the list view. When the items added to the list view (dynamically) I want to scroll it withing the same. But now I'm unable to set initial height when there are no items in the list view.

bellow is my layout file.

<RelativeLayout 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:background="@color/background_color"
tools:context=".HomeActivity"
android:weightSum="1.0" >

<RelativeLayout
    android:id="@+id/relativeLayout1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:background="@color/header_color"
    android:paddingBottom="@dimen/header_vertical_margin"
    android:paddingLeft="@dimen/header_horizontal_margin"
    android:paddingRight="@dimen/header_horizontal_margin"
    android:paddingTop="@dimen/header_vertical_margin"  >

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:orientation="horizontal"
        android:weightSum="1.0" >

        <ImageButton
            android:id="@+id/ImageButton03"
            android:layout_width="62dp"
            android:layout_height="match_parent"
            android:layout_gravity="left"
            android:layout_weight="0.2"
            android:adjustViewBounds="true"
            android:background="@android:color/transparent"
            android:gravity="left"
            android:scaleType="centerInside"
            android:src="@drawable/title_left_img" />


        <ImageView
            android:id="@+id/headerImg"
            android:layout_width="139dp"
            android:layout_height="match_parent"
            android:layout_weight="0.7"
            android:scaleType="centerInside"
            android:src="@drawable/header_img"
            android:layout_margin="5dp" />

        <ImageButton
            android:id="@+id/ImageButton04"
            android:layout_width="38dp"
            android:layout_height="wrap_content"
            android:layout_weight="0.1"
            android:adjustViewBounds="true"
            android:background="@android:color/transparent"
            android:scaleType="centerInside"
            android:src="@drawable/title_right_img" />

    </LinearLayout>

</RelativeLayout>

<RelativeLayout
    android:id="@+id/relativeLayout2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/relativeLayout1"
    android:paddingBottom="@dimen/body_vertical_margin"
    android:paddingLeft="@dimen/body_horizontal_margin"
    android:paddingRight="@dimen/body_horizontal_margin"
    android:paddingTop="@dimen/body_vertical_margin" >

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

    <TextView
        android:id="@+id/dayText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="TextView"
        android:textColor="@color/day_color"
        android:textSize="@dimen/day_size"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/dateTimeText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="TextView | TextView"
        android:textColor="@color/time_date_color"
        android:textSize="@dimen/date_time_size"
        android:textStyle="normal" />

    <ScrollView
    android:id="@+id/scrollView1"
    android:layout_width="wrap_content"
    android:layout_height="0px"
    android:background="@drawable/rounced_rect"
    android:layout_weight="1"
    android:fillViewport="true" >


        <ListView
            android:id="@+id/list_tracking"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:dividerHeight="1dp"
            android:scrollingCache="true" >

        </ListView>

    </ScrollView>
    </LinearLayout>
</RelativeLayout>

<RelativeLayout
    android:id="@+id/relativeLayout3"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_marginBottom="1dp"
    android:paddingBottom="@dimen/footer_vertical_margin"
    android:paddingLeft="@dimen/footer_horizontal_margin"
    android:paddingRight="@dimen/footer_horizontal_margin"
    android:paddingTop="@dimen/footer_vertical_margin" >

    <ImageButton
        android:id="@+id/imageButton1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:src="@drawable/track_button"
        android:adjustViewBounds="true"
        android:background="@android:color/transparent"
        android:scaleType="centerInside" />

</RelativeLayout>

I'm new to android app and any guidance is really appreciated.


Solution

  • To summarize my comment:

    Remove the unnecessary relativeLayout1, 2, and 3 and scrollView. Then move the bottom image button above the linear layout, so you can make the linear layout position itself with layout_above the image button and give it a height of match_parent. This makes it fill the space between the top linear layout and the bottom image button. And finally make the scroll view's height match_parent so it will also fill the space remaining below the text views.