UISearchBar makes UITableViewController scrolling too low (IOS11) - ios

On my UITableViewController the tableview scrolls too low. What I mean by that is that when scrolling to the bottom the last row is actually located way higher than the middle of the screen leaving a big white space on the bottom (lower half) of the screen.
I´m using a tableview with two collection views within some of the cells (if that might be important).
When I "pull to refresh", the tableview scrolls correctly until the view loads again.
EDIT:
So I found out that the issue only occurs when I add my UISearchBar as the header view of my table view instead of adding it to my navigationItem (IOS11).
Does anybody know how to fix this?

Related

IOS Swift TableView: Is there a way to move first cell one row down

I'm trying to make a fullscreen tableView but also have some space at the top when the viewcontroller first appears for a searchbar which disappears when you scroll the tableView, right now I'm hacking it by making an invisible cell at top, however is there a way for it to do so that only when you first load the viewcontroller, the first cell is about one row lower but can still scroll up to reach the full height of the viewcontroller, so the top of viewcontroller when you scroll back to top?
This is what I have right now:
The issue I'm having right now is that the invisible cell creates a huge empty space when u scroll down, see below:
As I understand you don't want the search bar to stick at the top of your view, so it must be in one of the tableView Cells, if this is true if you want to have an empty space under the search bar you can have another custom cell which you can customize its height in tableView(_:heightForRowAt) function.

Swift: Did Tumblr add a UICollectionView in a UIScrollView?

I've been trying to replicate this effect for a couple days which was inspired by Tumblr.
I've previously asked questions on here with different approaches of the same problem but to no avail. I'm just curious as to how the engineers at Tumblr created a horizontal collection view, with two vertical collection views, and is able to scroll down without affecting the view above (without resetting the position of the view when you scroll vertically in a different tab).
Header Views
I tried this, but the header view was isolated and I had to scroll to the right to see the collectionView cells. This did not work.
Changing the topLayoutConstraint constant of my UIView (not cv header) with respect to the contentOffSet of the vertical collectionView.
This almost got the effect I wanted, except that when I scrolled horizontally, there was a huge gap between my collection view and if I scrolled in that new tab, the UIView would appear again because, again, topLayoutConstraint gets scrolled up depending on the contentOffSet of my vertical collectionView contentOffset.
Changing the position of the UICollectionView frame, and scrolling the super view up simultaneously with NSNotificationCenter.
Alas, this method did the same as method #2, except that the vertical collection view cells scrolled faster than the super view.
I ran out of options to make this work so I will show you in detail what's attempted to be replicated (also note the scroll bar on the right):
Note when I scroll down the first tab. I switch, and then scroll down further. Originally, as I've said, there would be a gap between the second main CV, and when I scrolled, the view would reposition as if were scrolling up again. On here, the view on top keeps going up. So I'm curious as to what method Tumblr engineers used to do this. UICollectionView inside UIScrollView? Other suggestions?
I believe there is no UICollectionView involved. It looks like UIPageViewController and each its page is a UITableView.
Perhaps the UIPageViewController sits in a UITableView as well - the header also moves up when you scroll. This main table has only one cell (and a header) which is occupied by the UIPageViewController.
Hope it helps.

Create Shazam Type UI ios Swift

I am trying to recreate a UIView I have seen in multiple apps, mainly Shazam. The top half of the screen has some interactive buttons, and the bottom half looks like a tableView with custom cells. When the bottom half is panned/swiped up, the tableView scrolls over the top half with velocity, much like a scroll view.
I have been researching this and experimenting for a couple days now. I have gotten close, but not quite there.
My last approach was a view that had a tableView inside it. When the view was panned, the view would move to wherever the finger moved it to, but then would not have any velocity afterwards. Also when the tableView was panned/swiped down, it wouldn't move the whole view down.
Before that I tried a scrollView that took up the whole length of the screen. That gave the desired effect, but the button wasn’t tappable, and you could scroll the view in the button area, which is undesired.
Does it utilize ScrollViews or is it using a tableView that acts much like a ScrollView somehow.
Here is the Shazam UI/UX I am looking to recreate:
The top portion has interactive buttons, and doesn’t scroll. The bottom half shows content and when scrolled, covers up the top portion.
Below is what I have tried so far: This one is the panning view, which sort of works, but doesn’t have velocity and the tableView doesn’t scroll the view back down.
Any thoughts on a direction I can take from here is greatly appreciated. I am using Swift.
Cheers
This sort of thing is perhaps best done with a collection view and a custom layout — you can have some items for which you set layout attributes absolute to the view, and others relative to the scroll content offset.
There's a great (if wandering) discussion of this and other techniques in the Advanced User Interfaces with Collection Views talk from WWDC 2014.
This is actually simple than it seems at first. Here's how you can achieve this:
Create a UIViewController (not a UITableViewController).
Add some buttons to the top area of the screen.
Add a table view spanning the entire view controller's view. Make sure the table view is on top of the buttons added in the previous step.
Configure the top cell of the table view to be transparent (by setting its background color to Clear). Set the background color on the table view to Clear as well. This way it won't obscure the elements at the top of the screen, unless the table is scrolled up.
Because your table view is now transparent, you'll need to explicitly set the background color on the table cells other than the top one.
Profit!

UITableView not following constraints

I have in the bottom of the screen a view containing 4 image views that I use as navigation buttons. That view is pinned to bottom layer by "0". Now my tableview is above this view and I have made a constraint of "10" from tableview to my "navigation view." I have two problems. When my tableview contains more rows than the screen can hold it puts the cells "behind" my "navigation view" even though I made the constraint it shouldn't. Now when I flip the screen to landscape mode it actually makes my navigation view disappear from the screen. I don't understand why as I pinned the bottom view to bottom layer. (2 questions)
Then of course my 2nd row decides to use much bigger font when I load in more rows, which is something I don't even want to bother you guys with yet, I think my simulator is playing tricks with me..
Anyway, I appreciate any help on my 2 problems above. Thank you
EDIT: Here I took some pictures:
http://i.imgur.com/LA9Spt0.png (this shows what i mean with the tableview pushing away the lower view even though the lower view is constrained to the bottom layer and the tableview has a constrain leading to the lower view (menu bar))
http://i.imgur.com/b6VoqFk.png Here what happens when I "pull" the tableview downwards to see more cells it blocks the upper label and top bar (which contains the logo I had to remove for reasons with the company) I tried to use :setBounces and setAlwaysVertBounces set to NO but then I can't scroll down the tableview when more cells exist.
(addition to img. nr 2)multiple cells makes the cells hide behind the lower menu navigation bar. I did make a constrain between the tableview and lower menu bar, shouldn't I be able to make the tableview "create" a scroll bar so u can scroll down instead of cells hiding behind the menu bar.
Thanks, any help much appreciated!
It sounds like you have some conflicts, or missing constraints.
You can see if you have constraints errors in the nib, in the 'view hierarchy' column in the left side of your nib, you will see a little red arrow..
Or that you have some conflict which you can see at the console when running you app.
Thanks

UITableView stops scrolling enough after I add/remove a view to the superview of table view

Here is the problem that I'm facing. I have UITableView inside main view. When user taps menu button, view is added to the view hierarchy of superview, and this view covers all screen, except the menu button. That is I call
[self.view insertSubview:self._menuView belowSubview:self._menuButton]
After user clicks the menu button again I call
[self._menuView removeFromSuperview]
However, after this, the UITableView stops scrolling, actually it scrolls, but just a little, couple of pixels, and then bounces back to the location on which it was before I inserted _menuView. I've monitored the menu hierarchy after inserting and removing the _menuView, it is actually removed, and also there is no view which covers the UITableVIew, so there is no chance that some other view steals touches from UITableView. What can be the problem? Any ideas?
EDIT 1: I've noticed besides not being able to scroll, another strange thing happens. When I show menuView, the tableView is scrolled to top, without animation. (the menuView is half opaque only, so I can see the tableView underneath it)
EDIT 2: I've monitored contentSize and contentOffset of tableView before and after inserting _menuView, the reason for not being able to scroll is that somehow contentSize is being changed.
TABLE VIEW BEFORE INSERTING MENU - contentSize:{Width=320, Height=10519} contentOffset:{X=0, Y=3980}
TABLE VIEW AFTER INSERTING MENU - contentSize:{Width=320, Height=44} contentOffset:{X=0, Y=0}
As You can see, the height is changed to 44 that's why I'm not able to scroll. And Also, as I've said in EDIT 1: tableView is scrolled to top - so as you can see contentOffset is also zeroed. Any ideas why content size changes automatically?
Thanks in advance.
i think there is problem with your tableview frame. right after removing subview, try to set frame of your tableview at its original frame.may this will solve your problem
Content in the UITableView organized automaically and designed only to show cells & header/footer elements. To proper working you should wrap your table into parentView and add your menu to that parentView rather than to the UITableView. You can also try to call reloadData method on table since it can restore the content size of the view.

Resources