UICollectionViewFlowLayout subclass causes cell to disappear - ios

I am trying to offset the center on y axis, of all cells below selected cell. I added a property to CollectionViewFlowLayout subclass, called extendedCell, which marks the cell below which I should offset everything else.
- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect
{
NSArray *attributes = [super layoutAttributesForElementsInRect:rect];
if(!self.extendedCell)
{
return attributes;
}
else
{
return [self offsetCells:attributes];
}
}
- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath
{
UICollectionViewLayoutAttributes *attribute = [super layoutAttributesForItemAtIndexPath:indexPath];
if(!self.extendedCell)
{
return attribute;
}
else
{
if(![attribute.indexPath isEqual:self.extendedCell] &&
attribute.center.y >= [super layoutAttributesForItemAtIndexPath:self.extendedCell].center.y)
{
CGPoint newCenter = CGPointMake(attribute.center.x,
attribute.center.y + 180.f);
attribute.center = newCenter;
}
return attribute;
}
}
-(NSArray *)offsetCells:(NSArray *)layoutAttributes
{
for(UICollectionViewLayoutAttributes *attribute in layoutAttributes)
{
if(![attribute.indexPath isEqual:self.extendedCell] &&
attribute.center.y >= [super layoutAttributesForItemAtIndexPath:self.extendedCell].center.y)
{
CGPoint newCenter = CGPointMake(attribute.center.x,
attribute.center.y + 180.0f);
attribute.center = newCenter;
}
}
return layoutAttributes;
}
Turns out that something bad happens on the way, as cells at the bottom disappear. I have a feeling that this has something to do with cells being outside UICollectionView content size, but setting the size while generating layout does not help. Any ideas how to fix that disappearance?

OK turns out I found the bug. Seems that overriding -(CGSize)collectionViewContentSize helps. If any cells lie outside the content size of the collection view they simply disappear. As the content size is set for good before any layout attributes calls, and cells are not allowed to be placed outside of it, collection view just gets rid of them. I thought the content size is based upon cells attributes after they've been set, this is not the case.
-(CGSize)collectionViewContentSize
{
if(self.extendedCell)
{
CGSize size = [super collectionViewContentSize];
return CGSizeMake(size.width, size.height + 180);
}
else
{
return [super collectionViewContentSize];
}
}

Solved it by breaking big cells into minor cells an connected them with a view. Very hacky, but iOS7 will hopefully help.

Check if any returned size of cell have one of border size equals 0.
In my case disappear cause was sizeForItem returned {320,0}
Why UICollectionView with UICollectionViewFlowLayout not show cells, but ask for size?
And for correct size view from nib (with used autolayouts) i use:
+ (CGSize)sizeForViewFromNib:(NSString *)nibName width:(CGFloat)width userData:(id)userData {
UIView *view = viewFromNib(nibName, nil);
[view configForUserData:userData];
CGSize size = [view systemLayoutSizeFittingSize:CGSizeMake(width, SOME_MIN_SIZE) withHorizontalFittingPriority:UILayoutPriorityRequired verticalFittingPriority:UILayoutPriorityFittingSizeLevel];
return CGSizeMake(width, size.height);
}

Related

Header view not getting re-arranged after scrolling in UICollectionView

I have a UICollectionView which expands on clicking a cell and once the screen fills it becomes scrollable.
Now when I scroll down I need my header view to scroll down with it and for that I've implemented the logic in the layoutAttributesForSupplementaryViewOfKind method in my custom UICollectionViewLayout class.
This works fine but now the issue is that when I the content becomes scrollable and I scroll down few cells and immediately click on a cell to shrink the content back to one screen at that point the header view doesn't gets arranged, i.e it still remains in the last scrolled position.
But there after if I perform any other action like cell tap it gets arranged properly.
I've tried calling setNeedsLayout, setNeedsDisplay and layoutSubviews where I reload my UICollectionView but the header still doesn't updates to its proper position.
Below is the code for my layoutAttributesForSupplementaryViewOfKind method.
Any help is appreciated.
- (UICollectionViewLayoutAttributes *)layoutAttributesForSupplementaryViewOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath {
if (![kind isEqualToString:[myGridHeaderView kind]]) {
return nil;
}
myGridHeaderPosition headerPosition = [[self collectionView] headerPositionAtIndexPath:indexPath];
CGRect cellRect = [[self delegate] getRectForHeaderAtIndex:indexPath headerPosition:headerPosition];
if (CGRectEqualToRect(cellRect, CGRectZero)) {
return nil;
}
myGridHeaderLayoutAttribute* attributes = [myGridHeaderLayoutAttribute layoutAttributesForSupplementaryViewOfKind:kind withIndexPath:indexPath];
CGPoint centerPoint = CGPointMake(CGRectGetMidX(cellRect), CGRectGetMidY(cellRect));
CGSize size = cellRect.size;
UICollectionView * const cv = self.collectionView;
NSInteger zIndex = 1;
CGPoint const contentOffset = cv.contentOffset;
if (contentOffset.x > 0)
{
if (headerPosition != myGridHeaderPositionColumn)
{
centerPoint.x += contentOffset.x;
}
zIndex = 1005;
}
if (contentOffset.y > 0)
{
if (headerPosition != myGridHeaderPositionRow)
{
centerPoint.y += contentOffset.y;
}
zIndex = 1005;
}
if (headerPosition == myGridHeaderPositionCommon) {
zIndex = 1024;
}
attributes.zIndex = zIndex;
attributes.headerPosition = headerPosition;
attributes.center = centerPoint;
attributes.size = size;
attributes.alpha = 1.0;
return attributes;
}
When you scroll up and down , header will be visible and hidden , for use this code.
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
isScrollingStart=YES;
NSLog(#"scrollViewDidScroll %f , %f",scrollView.contentOffset.x,scrollView.contentOffset.y);
if (scrollView.contentOffset.y<=124) {
_img_top_header.alpha=scrollView.contentOffset.y/124;
}
else
{
_img_top_header.alpha=1.0;
}
}
must be set image in header.

Only one sticky header in UICollectionView

I'm trying to implement a single sticky header in a UICollectionView.
My sticky header behavior is a bit different than the usual one you can see e.g. in UITableView. I have 3 headers in the collection view and I want only one of them to be sticky and stick to the top when the content is scrolled.
My code works pretty well. However, when I scroll down, the sticky header disappears suddenly at some point. Scrolling back makes the header appear again. What am I doing wrong?
I am attaching a implementation of my custom layout. It's a subclass of UICollectionViewFlowLayout.
#implementation CustomFlowLayout
- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect
{
NSMutableArray *attributes = [[super layoutAttributesForElementsInRect:rect] mutableCopy];
CGPoint const contentOffset = self.collectionView.contentOffset;
for (UICollectionViewLayoutAttributes *layoutAttributes in attributes)
{
// Adjust the sticky header frame.
if ([layoutAttributes.representedElementKind isEqualToString:UICollectionElementKindSectionHeader] &&
layoutAttributes.indexPath.section == SectionWithStickyHeadeIndex)
{
NSInteger numberOfItemsInSection = [self.collectionView numberOfItemsInSection:SectionWithStickyHeadeIndex];
NSIndexPath *firstObjectIndexPath = [NSIndexPath indexPathForItem:0
inSection:SectionWithStickyHeadeIndex];
UICollectionViewLayoutAttributes *firstObjectAttrs;
if (numberOfItemsInSection > 0)
{
firstObjectAttrs = [self layoutAttributesForItemAtIndexPath:firstObjectIndexPath];
}
else
{
firstObjectAttrs = [self layoutAttributesForSupplementaryViewOfKind:UICollectionElementKindSectionHeader
atIndexPath:firstObjectIndexPath];
}
CGPoint origin = layoutAttributes.frame.origin;
// Adjust the header origin so it sticks to the top.
origin.y = MAX(contentOffset.y + self.collectionView.contentInset.top,
CGRectGetMinY(firstObjectAttrs.frame) - CGRectGetHeight(layoutAttributes.frame));
layoutAttributes.zIndex = CGFLOAT_MAX;
layoutAttributes.frame = (CGRect)
{
.origin = origin,
.size = layoutAttributes.frame.size
};
break;
}
}
return attributes;
}
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBound
{
return YES;
}
#end
I'm not 100% sure on this, but it looks like once you scrolled down far enough, the header's original position was no longer located inside the rect argument. This caused the header's layout attributes to not be included in the attributes array you iterated over in in the for loop, resulting in the layout position no longer being adjusted to its "sticky" position at the top of the screen.
Try adding these lines right before the for loop to add the sticky header's layout attributes to the attributes array if they are not already there:
NSIndexPath *stickyHeaderIndexPath = [NSIndexPath indexPathForItem:0 inSection:SectionWithStickyHeaderIndex];
UICollectionViewLayoutAttributes *layoutAttributes = [self layoutAttributesForSupplementaryViewOfKind:UICollectionElementKindSectionHeader
atIndexPath:stickyHeaderIndexPath];
if (![attributes containsObject:layoutAttributes])
{
[attributes addObject:layoutAttributes];
}
The answer in Swift 5
let headerIndexPath = IndexPath(item: 0, section: 0)
if let headerAttributes = layoutAttributesForSupplementaryView(ofKind: UICollectionView.elementKindSectionHeader, at: headerIndexPath) {
if !attributes.contains(headerAttributes) {
attributes.append(headerAttributes)
}
}
All thanks to #BrendanCain

UICollectionViewFlowLayout and ios6

I have an Extended UICollectionFlowLayout. This vertically centres the UIcollectionViewCell by translating the attribute.frame by required amount and also shifting the visible Rect of collection view to show the transformed cells.
This works perfectly fine in ios7. However in ios6 the visible Rect of collection view does not change , hence forth cells are shown shifted but clipped.
Eg : -(NSArray*)layoutAttributesForElementsInRect:(CGRect)rect rect = (0,0,320,500) and I shift cells by 200 then cells with start showing from (0,0,320,200) to (0,0,320,500) and those below 500 will be clipped. Any reason why this would happen in ios6 when it work perfectly in iOS7 ?
#implementation VerticallyCenteredFlowLayout
-(id)init
{
if (!(self = [super init])) return nil;
[self setMinimumLineSpacing:5.0];
[self setMinimumInteritemSpacing:0.0];
[self setItemSize:CGSizeMake(10, 10)];
[self setSectionInset:UIEdgeInsetsMake(0, 11, 11, 11)];
[self setScrollDirection:UICollectionViewScrollDirectionVertical];
return self;
}
-(NSArray*)layoutAttributesForElementsInRect:(CGRect)rect {
NSArray* array = [super layoutAttributesForElementsInRect:rect];
UICollectionViewLayoutAttributes* att = [array lastObject];
if (att){
CGFloat lastY = att.frame.origin.y + att.frame.size.height;
CGFloat diff = self.collectionView.frame.size.height - lastY;
if (diff > 0){
for (UICollectionViewLayoutAttributes* a in array){
a.frame = CGRectMake(a.frame.origin.x, a.frame.origin.y + diff/2, a.frame.size.width, a.frame.size.height) ;
}
}
}
return array;
}
The contentSize was not being automatically Adjusted in ios6.
Overiding following method in VerticallyCenteredFlowLayout Class fixed the issue
-(CGSize)collectionViewContentSize {
CGSize size = [super collectionViewContentSize];
if (size.height < MIN(_maxHeight,self.collectionView.frame.size.height)) {
size.height = MIN(_maxHeight,self.collectionView.frame.size.height);
}
return size;
}

Disappearing UICollectionViewCells on landscape orientation

I have a problem managing my UICollectionsView with flowlayout and orientation. Basically, the problems happens when I switch to landscape, some of the UICollectionViewCells are missing. They reappear once I start scrolling. It should be able to show all the cell since there is so much more room on the contentSize.
I even tried in my layout:
- (BOOL) shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds
{
return YES;
}
With the same results.
Anyone have any ideas on this problem? I included a image on how my layout is organized and the expected behavior:
To add more details, each of the color coded cells belongs to its own section and I am shifting my 2nd section to the right on orientation change using:
- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect {
NSArray* attributesToReturn = [super layoutAttributesForElementsInRect:rect];
for (UICollectionViewLayoutAttributes* attributes in attributesToReturn) {
NSIndexPath* indexPath = attributes.indexPath;
if (nil == attributes.representedElementKind) {
attributes.frame = [self layoutAttributesForItemAtIndexPath:indexPath].frame;
} else {
NSString *kind = attributes.representedElementKind;
attributes.frame = [self layoutAttributesForSupplementaryViewOfKind:kind atIndexPath:indexPath].frame;
}
}
return attributesToReturn;
}
It seems the number of items in the layoutAttributesForElementsInRect are completely different in landscape and in portrait.
Finally figure it out. I increased my the rect to a large size when it's on landscape on:
- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect {
CGRect *newRect = CGRectMake(0,0, screensize.width, screensize.height);
NSArray* attributesToReturn = [super layoutAttributesForElementsInRect:newRect];
...
}

UICollectionView animate cells in initially

I present a view controller with a uicollectionview. I want the cells to animate in from the top.
My layout is a sublclass of flowlayout, so I override this method:
- (UICollectionViewLayoutAttributes *) initialLayoutAttributesForAppearingItemAtIndexPath:(NSIndexPath *)indexPath {
UICollectionViewLayoutAttributes* attributes = [super initialLayoutAttributesForAppearingItemAtIndexPath:indexPath];
CGFloat height = [self collectionViewContentSize].height;
attributes.transform3D = CATransform3DMakeTranslation(0, -height, 0);
return attributes;
}
It almost works, but i see the cells appear (flash) momentarily on the screen before they animate in.
Any ideas why they appear in their final location before the transform is applied, and how I might prevent this?
Rather than setting the transform, change the center:
- (UICollectionViewLayoutAttributes *) initialLayoutAttributesForAppearingItemAtIndexPath:(NSIndexPath *)indexPath {
UICollectionViewLayoutAttributes* attributes = [super initialLayoutAttributesForAppearingItemAtIndexPath:indexPath];
CGPoint c = attributes.center;
c.y -= self.collectionViewContentSize.height;
attributes.center = c;
return attributes;
}
Changing the transform can always cause problems with determining visibility, because doing so invalidates the frame property.

Resources