maurycyw / StaggeredGridView

A modified version of Android's experimental StaggeredGridView. Includes own OnItemClickListener and OnItemLongClickListener, selector, and fixed position restore.
https://github.com/maurycyw/StaggeredGridViewDemo
1.65k stars 664 forks source link

top images don't align when user flings to the top. #23

Open pcompassion opened 11 years ago

pcompassion commented 11 years ago

The top of the first left image is placed below the top of the first right image.

`currently restoring position can result in the views to be slightly offset when user flings to the top. This is corrected by checking the offsets when position 0 is reached. '

I'm seeing this issue in my app. How do I fix it as you said 'corrected by checking the offsets when position 0 is reached.'?

jarvisv commented 11 years ago

I am facing the same issue as well. Some pointers on what you think is going on would be greatly appreciated!

sungeuns commented 11 years ago

I have almost same problem with you. For me, first top right image is placed below(seems like have margin at the top) than left image. So top left image located correctly.

Have you any idea? Thanks in advance :)

cookieKing commented 11 years ago

I have the same problem with you. when I changed Item's height dynamically or changed the orientation. the top item don't align sometime.

Please give me an ideal.

aereanetworx commented 11 years ago

Same problem here, but one solution is found: Try to do not use any padding at top! this solves the problem here completely. To workaround i've added the padding into the cells inside the grid and not into the grid itself.

sungeuns commented 11 years ago

Hum, for me that doesn't work too. There's no padding at top in my code, but still problem caused.

aereanetworx commented 11 years ago

mhh, is the a general padding instead of top padding used? Just to make sure: i mean the padding of the gridview itself not the cells in the grid. Another thing i have done, is using the "ScaleImageView" from Maurycy Wojtowicz you find this one in the StaggeredGridView example from him (BTW: Thanks for this). This view will inform the grid about size changes which will occur in lazy loading...

sungeuns commented 11 years ago

Yes, I have no padding at GridView itself, also, I have very similar cell since I used ScaleImageView too. In the example source code, author uses one of lazy loading source code, but I use universial image loader. however I don't think UIL is the problem...

aereanetworx commented 11 years ago

Are you using an LinearLayout as the container for the grid-cells? I think there is one problem as well, just give the RelativeLayout a try!

sungeuns commented 11 years ago

I used LinearLayout at GridView wrapper, and RelativeLayout at gird cell. So I changed gridview wrapper as a RelativeLayout, but still have a same problem . ..

aereanetworx commented 11 years ago

Ok, next problem figured out: If the Image Views changes size this problem ist back again. I had tested it with images which are all the same size. Just now i've tested it with "dynamic" size images and the problem occour's again. i Think this is a problem in size changing of images during the lazy loading, possibly there is some calculation which is not correct. I will try to figure out if i can fix this bug as soon as possible.

sgallego commented 11 years ago

I have read the next workaround in a forum (http://www.androidviews.net/2013/01/pinterest-like-adapterview/). It seems to work for me!

// reset list if position does not exist or id for position has changed if(mFirstPosition > mItemCount-1 || mAdapter.getItemId(mFirstPosition) != mFirstAdapterId){ Log.i(TAG, “item resetting position of the grid layout”); mFirstPosition = 0; Arrays.fill(mItemTops, 0); Arrays.fill(mItemBottoms, 0); if(mRestoreOffsets!=null) Arrays.fill(mRestoreOffsets, 0); }

Comment this code in StaggeredGridView.java in the library code , you can find it in onChanged() method of DataSetObserver()

nambrose commented 11 years ago

Commenting out that part does not work for me. Subjectively it maybe seemed to happen less, but I just got a case where my top images were pretty badly aligned.

I really hope a fix can be found for this as I love this control and really want to make use of it ....

nambrose commented 11 years ago

I downloaded this fork: https://github.com/jess-anders/StaggeredGridView

And so far it seems to not be happening but I dont know that I've had long enough to convince myself that the issue is fixed.

I do lazy-load the images but the size of the image shouldn't be changing because the ImageView I pass back from getView is sized correctly.

I am seeing some worrying messages regarding "Inflation setting LayoutParams.width to -2 must be MATCH_PARENT"

I will play with it some more and see if the issue comes back.....

If not, I want to add a "threshold" scroller so I can be notified when the list is say 80% scrolled, so I can trigger a reload of new data, plus a callback when scrolling starts .... as well as the scroll stopped ....

nambrose commented 11 years ago

Ok I cannot "break" the jess-anders version. Whatever they did seems to definitely fix this for me (w/out commenting out the code per sgallego's post)

joshln87 commented 10 years ago

if anyone has this problem or any gridviews rearranging, this workaround worked for me. Handle onclick events for all your child subviews in your item layout in the getview method of your adapter. seems like a bug but this definitely works for me.

briangriffey commented 10 years ago

I'll see if I can get the changes made by @jess-anders rolled back into the project.

jgeorg commented 10 years ago

I tryied all the above recomendations, but the problem still remains.

shawnthye commented 10 years ago

@jgeory have you tried the jess-andres version?

winsontan520 commented 10 years ago

I faced same problem too, but found the trick after playing with the demo. You have to set the margin programmatically just like the demo. Also i am using demo's ScaleImageView.

StaggeredGridView gridView = (StaggeredGridView) this.findViewById(R.id.staggeredGridView1); int margin = getResources().getDimensionPixelSize(R.dimen.margin); gridView.setItemMargin(margin); // set the GridView margin gridView.setPadding(margin, 0, margin, 0); // have the margin on the sides as well

root1991 commented 10 years ago

Hi, thanks for a great library. I tryed to use jess-andres version, but when I call adapter.notifyDataSetChanged(), gridview comes to start. Do you have any ideas? This is my code: Parcelable state = gridView.onSaveInstanceState(); adapter.notifyDataSetChanged(); gridView.onRestoreInstanceState(state);

pseveryn commented 9 years ago

Problem was solved by using loader clases from StaggeredGridViewDemo https://github.com/maurycyw/StaggeredGridViewDemo/tree/master/src/com/example/staggeredgridviewdemo/loader