CSStickyHeaderFlowLayout Header Frame - ios

EDIT: I have create a very small app that represents perfectly the problem. https://drive.google.com/file/d/0B6sI4Feh1HJUb3pGa2pBUmY4QW8/view?usp=sharing
In the sample app, we just need to scroll down then press the button on the top bar to see the problem I am having
I am using https://github.com/jamztang/CSStickyHeaderFlowLayout to have sticky headers behaviors (like default UITableView) inside my collection view.
It works pretty well when scrolling through the collection view. I have a search bar outside the collectionview that allows users to filter the data with search text, everytime the user enters a letter, I'm refreshing the collectionview's data with the found data.
The problem is let's say there is currently 4 sections inside the collection view and that it is scrolled completely at the bottom. When I input a certian letter, it filters out everything but a single item (with a single header). The content size then changes for the collection view and displays the proper data, but then the header is too low (see screenshot).
I have investigated inside the flowlayout and inside the layoutAttributesForElementsInRect and I see it actually set the frame's origin Y to 0 (like it should be), but it seems the collectionview doesn't use this value and uses the previous one (which was when the collection view was scrolled down).
Any idea what could cause the UICollectionView to not use the desired frame inside layoutAttributesForElementsInRect ?

I tried to fix this issue, but it looks like it's impossible till UICollectionViewLayout mechanism is black box for us. Custom layout correctly returns updated frame to layout engine on reloadData:
But hidden engine not even asking attributes if they are equal. In your case you can use simple workaround. Just update contentOffset after reload.:
[self.collectionView reloadData];
self.collectionView.contentOffset = CGPointZero;

Related

scrollToItem() causes compositional layout to glitch when using paging

I'm using UICollectionViewCompositionalLayout and the *UICollectionLayoutSectionOrthogonalScrollingBehavior to build a carousel.
The scrollToItem() method will correctly scroll to the item at the specified indexPath but will create a top-inset (animates it smoothly). It doesn't inset the rest of the content though, which will make the cell overlay subsequent content. (Here a section footer with a page control)
This top-inset will be the size of a section header + the contentInset of the layout section.
Any subsequent scrolling initiated by the user will cause the layout to update and make the cell jump to the correct position.
The problem occurs only when using one of the .paging behaviours for orthogonal scrolling.
I've tried to mess with the layout item in visibleItemsInvalidationHandler but I have not found a way to distinguish whether the handler is called because the user scrolled or because the scrollToItem() method was called programmatically.
Check out the sample project on github
I'm using Xcode 13.0 and iOS 15.0

How to implement the following table?

I'd like to implement the following view (circled blue):
However, I'm not sure what view to use.
On the one hand, when using a UITableView, the cells' width cannot be changed.
On the other hand, when using a UICollectionView, I need to have sections (exactly three sections; each section represents a game state, either 'running', 'waiting' or 'ended').
Cells shall be added dynamically (the data for the cells is retrieved through an API).
What is the preferred basic structure (basically the view) to use?
I'm not looking for a fully coded solution! I'd just like to know what view I should be using.
Given that you have a simple one-column set of cells, it looks like a table view would be a good fit. A collection view can do everything a table view can, but it's more work.
I'd suggest using a sectioned table view with section headers, and a custom header view that's mostly transparent and shows the background behind it. (The section header's view would still be the same width as all the other cells, but it would be transparent, have a fill color of clear, and have a subview that draws the boxes with your section headers in it.
I don't know enough about the content (can't understand that language) but looks like a quiz app?
The basic outline for displaying the majority of the dataset looks to be a UITableView in grouped mode (where "Warten Auf" and "Beendete Spiele" are groups).
If the first row (under the green button) is part of the data set you can either leave that without a section/group header, use the green button as a header view for that group or use the green button as a header view for the UITableView itself.

UICollectionView header height animation

I have the following scenario...
When I initially load a UICollectionView, I need it to slide up from the bottom of the screen without a header. This is pretty easy.
There is an "Add" cell that takes the user through the process of adding an item. At the end of this process, we display the list again, but this time with a header. The header needs to fade in and, at the same time, the updated list slides up from the bottom.
The requirement is that the header scroll with the list after both are in place, which is pretty much the default behavior.
The problem I'm having is coming up with a workable method for animating the list slide while the header is displayed.
One thought is simply animating the height of the header. Basically, start it with a height equal to the view height, then animate it to its final size. This would automatically draw the rest of the list up, making it look as though it were sliding in.
I've tried several variations of this method with no success. I can set the height without a problem, but I haven't been able to animate it.
I had thought just returning the appropriate height from referenceSizeForHeaderInSection and reloading the data would handle it. At least that's what I gather from SO messages. I've also tried invalidating the layout and performBatchUpdates.
Would this be simpler if I placed the contents of my header in the first row of the collection view and then try animating the height of row 0?
I'm not sure which is the best strategy.
OK, I found the following which was easily adapted to my scenario...
iOS Animating UITableView Header
Here's a Wayback Machine link to the original post. It may take a little while to load. Be patient.
Wayback Machine: iOS Animating UITableView Header
And here's a GitHub link with sample code...
GitHub: MichiganLabs / AnimatingTableViewHeader

How to Reduce UICollectionView Size

I have this UICollectionView, layout scroll direction = horizontal.
I don't want it to occupy all page (as it does when you create it in IB), I need to have a header (another view) above it. This won't work using Accessories -> Header Section, when the scrolling is horizontal this header section sits to the left of the collection view. And it's not fixed, as I need my view to be.
Thanks
I was doing something similar and ended up just putting a UIView at the top that allowed me to put whatever I needed up there. It just solved a lot of problems for me.
I thought it was strange the way the header operates in the horizontal scrolling mode. It isn't really a header at all.
Revision -- I don't use IB at all, so it is all hand-coded -- but either way, you can do it. I've attached a screenshot of something I'm working on now -- it has a picker view and a youtube video at the top, where your header would be and a collection view down below. You could, of course, make your header view whatever size you want it to be and with whatever content. In this case I also have a footer that is a different view as well, but the concept is the same.

Strange behavior with horizontal scrolling UITableView (in Monotouch)

We have a UITableView that we have configured to act like a Grid, allowing both horizontal and vertical scrolling. We accomplish this by dynamically changing the ContentSize in a custom UITableView's LayoutSubviews method, which helps with autorotation, scrolling, etc.
Everything works as expected except on a couple of our larger grids. When these grids are scrolled horizontally (swipe left), as soon as the ContentOffset.X is greater than or equal to the Bounds.Width, the table view disappears. It is still present and receives input, but nothing is painted. On swiping back to the right, as soon as the width threshold is crossed, everything is repainted.
In situations where the size of the grid is less than half of the configured UITableView width, this issue does not occur. We cannot change the size of the grids because they are configured by customers in the field who expect the data to be available.
I have checked and/or removed as much of our custom drawing code as possible and the issue is still occurring. Does anyone have any ideas?
That is because although the UITableView inherits from the UIScrollView, it is only meant to have a single column, hence it draws its cells according to its Bounds.
If you want to create a grid-like control with the UITableView, I suggest using multiple table views in a parent UIScrollView side-byside and change that one's ContentSize.
I came across this same issue and posted a bug report (10561166) back in December on the Apple Developer site.
I received a response today from Apple in which they stated that
UITableView is not designed or intended for horizontal scrolling.
(I had since changed my design not to require the horizontal scrolling.)

Resources