CODEWITHSUNDEEP
androidlistview
Mtok
Mtok

Reputation: 1630

Scrolling items outside the ListView

I have 2 LinearLayout s in my activity. Top one has ImageView and the other one has a ListView. I have lots of items in ListView.

What I want is scrolling down the whole page. So when I scroll down the LinearLayout containing the ImageView should disappear going up.

I set both layout height to wrap_content but I can only scroll down on ListView, top LinearLayout stays where it is.

Is it possible to achieve what I want without putting the ImageView into ListView as an item ?

Here are the layouts;

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

   <ImageView
     android:id="@+id/imgMoviePoster"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:layout_marginBottom="10dp"
     android:scaleType="centerCrop"/>
</LinearLayout>
<LinearLayout
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:orientation="horizontal">

    <ListView
      android:id="@+id/lstMovies"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"/>
</LinearLayout>

Upvotes: 0

Views: 966

Answers (4)

Spirrow
Spirrow

Reputation: 1150

Usually is not a good practice to have a scrollable view inside another scrollable view, a straightforward approach in this case, will be to add a header to the listView. Simply, easy and with better performance.

ListView listView = (ListView) findViewById(R.id.list);
View header = getLayoutInflater().inflate(R.layout.header, null);
listView.addHeaderView(header);

You can have a look at this tutorial if you have any doubt! (The header will be the LinearLayout with your image)

Upvotes: 1

Joyal
Joyal

Reputation: 412

I had the same scenario once and i solved this. Please check the changes i made in your layout:

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

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

      <ImageView
          android:id="@+id/imgMoviePoster"
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          android:layout_marginBottom="10dp"
          android:scaleType="centerCrop" />
       </LinearLayout>


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

      <ListView
           android:id="@+id/lstMovies"
           android:layout_width="match_parent"
           android:nestedScrollingEnabled="true"
           android:layout_height="200dp" />
     </LinearLayout>

     </ScrollView>

  1. Both LinearLayouts i placed it in a ScrollView. So that entire view can scroll based on device.

  2. I made a height to listview as 200dp. Listview will stretch only particular height.

3.Added attribute to listviewas below:

android:nestedScrollingEnabled="true"

Here the listview also scroll inside the Main ScrollView.We just want to maintain the listview height as limit, once the entire view is covered with listview after main view scrolling, then listview scroll will only work. So to avoid that i mage the listview size as 200 dp. Try this, Waiting for your feedback.

Happy Codding!!

Upvotes: 0

wngxao
wngxao

Reputation: 72

It is possible to do this.You need to create a class which extends from ListView,and then override its onTouch method.When scrolling you can get the position of you finger and then control the Position of the LinearLayout which contains a ImageView.

Upvotes: 0

Abhishek Agarwal
Abhishek Agarwal

Reputation: 1897

   <ScrollView   android:layout_width="match_parent"
    android:layout_height="match_parent">  

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

      <ImageView
     android:id="@+id/imgMoviePoster"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:layout_marginBottom="10dp"
     android:scaleType="centerCrop"/>
    </LinearLayout>
    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

       <yourpackagename.ExpandableHeightListView
      android:id="@+id/lstMovies"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"/>
     </LinearLayout>
</LinearLayout>
    </ScrollView>

Expandable Height List View

     import android.content.Context;
       import android.util.AttributeSet;
       import android.view.ViewGroup;
      import android.widget.ListView;

    public class ExpandableHeightListView extends ListView
    {

    boolean expanded = false;

   public ExpandableHeightListView(Context context)
   {
       super(context);
   }

   public ExpandableHeightListView(Context context, AttributeSet attrs)
{
    super(context, attrs);
}

public ExpandableHeightListView(Context context, AttributeSet attrs,int defStyle)
{
    super(context, attrs, defStyle);
}

public boolean isExpanded()
{
    return expanded;
}

@Override
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
    // HACK! TAKE THAT ANDROID!
    if (isExpanded())
    {
        // Calculate entire height by providing a very large height hint.
        // But do not use the highest 2 bits of this integer; those are
        // reserved for the MeasureSpec mode.
        int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2, MeasureSpec.AT_MOST);
        super.onMeasure(widthMeasureSpec, expandSpec);

        ViewGroup.LayoutParams params = getLayoutParams();
        params.height = getMeasuredHeight();
    }
    else
    {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }
}

public void setExpanded(boolean expanded)
{
    this.expanded = expanded;
}
}

and in Activity file set list.setExpanded(true)

Upvotes: 0

Related Questions