Xamarin iOS Table View Cells Intersecting Search Bar - ios

Question

I'm writing an iOS app using Xamarin and am having a problem with a table view and search bar - when the search bar has been clicked and text entered, the search results view controller doesn't work properly - the cells, when scrolled, intersect the search bar.
For clarity, I've recorded the problem:
YouTube - iOS Problem
So far, I've worked-out that the problem isn't related to the number of sections, the section header, or the table header. Completely out of ideas now, though...
The following can be used as an example, as the same problem appears there:
GitHub - TableSearch
In this example, adding the following line of code to the end of the 'ViewDidLoad ()' method within the 'MainTableViewController.cs' file will make the problem more obvious:
searchController.SearchBar.SearchBarStyle = UISearchBarStyle.Minimal;
EDIT
Looking at the image below, I ideally need to remove or shrink the top region (what seems to be a space for the iOS navigation bar):

Answer 1

Have you had a look at the sample from Xamarin here which has the same layout you are using, just to compare how you set up the search bar.
EDIT
I now see what you mean, I think this is a bug in iOS as the background color is transparent on the search bar and you would never want that.
I just added another view to cover up the status bar and set the background color to white:
searchController.SearchBar.SearchBarStyle = UISearchBarStyle.Minimal;
searchController.SearchBar.BackgroundColor = UIColor.White;
var frame = searchController.SearchBar.Frame;
frame.Height = searchController.SearchBar.Frame.Height + 22;
frame.Y = searchController.SearchBar.Frame.Y - 22;
var bckGRound = new UIView (frame);
bckGRound.BackgroundColor = UIColor.White;
searchController.SearchBar.InsertSubview (bckGRound, 0);
UPDATE
I realised that for your scenario you can't just add a view to cover this up so i was looking into adding blurring to searchbar like so:
var frame = searchController.SearchBar.Frame;
frame.Height = searchController.SearchBar.Frame.Height + 44;
frame.Y = searchController.SearchBar.Frame.Y - 22;
var blurryBackGround = new UIView (frame);
if (!UIAccessibility.IsReduceTransparencyEnabled)
{
blurryBackGround.BackgroundColor = UIColor.Clear;
var blureffect = UIBlurEffect.FromStyle (UIBlurEffectStyle.Light);
var blureffectview = new UIVisualEffectView (blureffect);
blureffectview.Frame = frame;
blurryBackGround.AddSubview (blureffectview);
}
else
{
blurryBackGround.BackgroundColor = UIColor.Black;
}
searchController.SearchBar.InsertSubview (blurryBackGround, 0);
UPDATE 2
If your background doesnt move with the table then you might be able to get away with just cropping the background image section that the search bar covers then set the backgroundimage for the search bar with this code:
searchController.SearchBar.SetBackgroundImage (new UIImage ("image.jpg"), UIBarPosition.TopAttached, UIBarMetrics.Default);

Answer 2

That is the UISearchController's default behavior. You can change the background color so that the rows don't appear behind the searchBar but that doesn't appear to be the behavior you want. Another option is to implement the UISearchBar on your ViewController which is what I have and it does scroll with the rows which is the behavior you are looking for. Hope this helps.
See: https://github.com/xamarin/monotouch-samples/tree/master/SearchDemo/SearchDemo