How to add horizontal scroll view and a listview in Android

Question

I am trying to create a application in that i need to create a list view but on the top of that i want a horizontal listview for multiple data .I am confused how can we do this .please help me in this

MainActivityXML

<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:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context=".HomePage">

    <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dp"
            android:id="@+id/mydata"
            android:orientation="vertical">
        </LinearLayout>

</ScrollView>

In the mydata i want to add the dynamic xml layout that is :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >
    <LinearLayout
        android:id="@+id/mainLinearLayout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:orientation="horizontal" >
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/ic_launcher"
            android:layout_marginTop="5dp"
            android:layout_marginLeft="10dp"/>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:layout_marginLeft="10dp"
            android:text="ABC DEF JKL"
            android:textColor="@android:color/black" />
    </LinearLayout>
</RelativeLayout>

And in the main_activity.xml i want to add a horizontal listview but i am not able to do this .

HorizontialListView

<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:background="#fff"
  >

  <com.test.ui.HorizontialListView
    android:id="@+id/listview"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#ddd"
  />

</LinearLayout>

And this is my horizontalitems

 <LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#fff"
    >

    <ImageView
        android:id="@+id/image"
        android:layout_width="150dip"
        android:layout_height="150dip"
        android:scaleType="centerCrop"
        android:src="@mipmap/ic_launcher"
        />

    <TextView
        android:id="@+id/title"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textColor="#000"
        android:gravity="center_horizontal"
        />

</LinearLayout>

I want to create something like this

Issuse i am facing is how could the connect all them .Please guide me in this

Answer 1

What you need is RecyclerView, you can have

                <android.support.v7.widget.RecyclerView
                    android:id="@+id/recyclerView"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@color/white"
                    android:clipToPadding="false"/>

Then in code you can set horizontal orientation like this.

mRecyclerView = (RecyclerView) view.findViewById(R.id.recyclerView);
mRecyclerView.setHasFixedSize(true);
mLayoutManager = new LinearLayoutManager(getActivity(), LinearLayoutManager.HORIZONTAL, false);
mRecyclerView.setLayoutManager(mLayoutManager);

And you can use RecyclerView.Adapter for adding views to it. All set :)

Answer 2

May be it will Help You

 <HorizontalScrollView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

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

// You can use your own code over here

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:src="@mipmap/ic_launcher" />

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:src="@mipmap/ic_launcher" />

        <ImageView
            android:id="@+id/imageView3"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:src="@mipmap/ic_launcher" />

        <ImageView
            android:id="@+id/imageView4"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:src="@mipmap/ic_launcher" />

        <ImageView
            android:id="@+id/imageView5"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:src="@mipmap/ic_launcher" />

        <ImageView
            android:id="@+id/imageView6"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:src="@mipmap/ic_launcher" />

    </LinearLayout>


</HorizontalScrollView>

Answer 3

For horizontal scroll part, use LinearLayout surrounded with HorizontalScrollView and then add each inner LinearLayout programmatically.

And for the below part use custom ListView.

I guess that will do the job.

Answer 4

from the picture you've given, I dont think there's a need for a scrollview, you're looking for something like this.

<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">

    <com.test.ui.HorizontialListView
        android:id="@+id/listview"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"/>


    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:orientation="horizontal">

        // add the layout for filter and sort by here

    </LinearLayout> 

    <ListView
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="1">
    </ListView>

</LinearLayout>