Android heterogeneous gridview like pinterest? [cl

Question

Is it possible to create pinterest like layout on Android using GridView? I want to create image gallery using GridView but I am not sure if it is good solution. I do not want create three LinearLayouts (I think that this solution is not good: Pinterest style listview or gridview in android)

Any ideas ;)?

Answer 1

A standalone helper for synchronizing scrolling of 2 ListViews: https://gist.github.com/yanchenko/6179793

Answer 2

I've been playing with this also (used LinearLayout) but at the end I had lot of problems with memory consumption (especially when I had to reload the items). I settled on simple solution which uses two synchronized ListViews. This way I can exploit internal caching which helps a lot. To do this I had to use OnTouchListener and OnScrollListener who synchronize lists. Here's an example:

https://github.com/vladexologija/PinterestListView

Answer 3

For Recent visitors to this question , I would suggest using RecyclerView with StaggedGridLayoutManager. It's having more than enough functions and flexibility.

Answer 4

Some useful libraries for implementing Pinterest-like grid view:

• https://github.com/maurycyw/StaggeredGridViewDemo
• https://github.com/jacobmoncur/QuiltViewLibrary
• https://github.com/huewu/PinterestLikeAdapterView
• https://github.com/vladexologija/PinterestListView
• https://github.com/expilu/AntipodalWall

Answer 5

This library comes from the Etsy application: https://github.com/etsy/AndroidStaggeredGrid

Answer 6

Create layout like as follow

<ScrollView...>
<LinearLayout....
   android:id="@+id/linear1"
   orientation="horizontal">

   <LinearLayout....
     android:id="@+id/linear2"
     android:layout_weight="0.33"
     orientation="vertical">

   <LinearLayout....
     android:id="@+id/linear3"
     android:layout_weight="0.33"
     orientation="vertical">

   <LinearLayout....
     android:layout_weight="0.33"
     orientation="vertical">

</LinearLayout>
</ScrollView>

Now add your ImageView dynamically in layouts

linear1 = (LinearLayout) findViewById(R.id.linear1);
linear2 = (LinearLayout) findViewById(R.id.linear2);
linear3 = (LinearLayout) findViewById(R.id.linear3);

for(int i=0;i<n;i++)
{
   ImageView iv = new ImageView(this);
   iv.setImageResource(R.id.icon);

   int j = count % 3;  <---- 
   if(j==0)
       linear1.addView(iv);
   else if(j==1)
       linear2.addView(iv);
   else
       linear3.addView(iv); 
}

output: