UItableView section index list repositions with searchDisplayController awkwardly - ios

So currently when my searchDisplayController becomes active my section index list positions itself and changes its length in weird ways.
When I first enter a letter into the search bar this is what it looks like.
When I keep on entering characters into the search bar it looks like this.
Then, when I dismiss the key board the section index list moves down with the keyboard and looks like this.
I have set up an NSNotificationCenter UIKeyboardDidHideNotification observer and tried doing searchDisplayController?.searchResultsTableView.reloadData() and
searchDisplayController?.searchResultsTableView.setNeedsDisplay() in the selector function and it does not fix or even change anything.
This issues happens in both portrait and landscape but fixes itself upon device orientation change.
Any ideas in how to fix this or just a simple point in the right direction would be much appreciated :)
EDIT:
So, the first screen shot is what it is supposed to look like and it allows me to scroll the tableView with the keyboard up. When I dismiss the keyBoard it aligns up correctly. However after a put in a second character into the search it changes to screenshot #2 which does not allow me to use the section index list to scroll through the tableView.

Related

Hiding Specific Views When SearchBar Text Did Change

As newbie, I finally got a case project for internship. Before jump in directly to code, I would like to ask about a logic.
here how it is look like
As you can as see, I have a search bar in the top, and under that a page view and under that a collectionview. So I will display to first 3 data in pageview and rest of it will be displayed in collectionView. Whenever user start typing in searchbar, PageView must disappear and collectionview must go all the way to the top. (under searchbar) And collectionview must display the filtered data. Once user delete all text from search bar, everything should be like in the beginning and pageview must be in the same page before user typed in searchbar. (If it was in the 2. page, it must be in the 2.page after its displayed again)
Problem is with hiding pageview when searchbar is used. My idea is the create ui programmaticly and once textDidChange func of searchBar runs, hide pageView and change constraints of collectionview programmatically. Once text is nil, make pageview visible again and change constraints again.
Is this logic useful? Is there any better way to do it?
Your approach seems correct to me, that's how I'd do it as well.
To add an extra touch, you can also animate the layout constraints changes (by calling layoutIfNeeded in the animation block, look up "animate constraints" on StackOverflow).
And for a perfect user experience, make those animations reversible by using UIViewPropertyAnimator so that if the user typed a letter and then quickly erased it during the animation it would just reverse in the middle. It's a somewhat advanced technique but you'll gain a great deal of experience with animations by implementing it. Watch Advanced Animations with UIKit from WWDC17 for more details.

How to implement scroll-then-fix items in iOS?

I have a problem but I don't know what keyword should I use to indicate this issue.. so I named it scroll-then-fix.
What I want to do is make element behave as below
It scrolls up and down with other contents
When scrolling up, when it reaches the top of the screen, it does not go up anymore and stays at the top, while other contents continuously scrolls up.
For example, when you click any app in app store, the segmented control in the middle act like this.
I have no idea and I don't know what keyword I should search in google to find any information (I don't even know what this is called).
Please help me or give me a hint.
Thanks in advance.
How I would do that effect from the app store is that I would have a UITableView with 2 sections. The first would contain no section header and only one cell (containing the app icon, app name and "GET" button), and the second section would have a section header (containing the segmented control) which will stick to the upper side of the screen. The second section cells would contain the app screenshots, description etc.
Plain style UITableView's header behaves like that. Try it.

How to implement newsfeed comment page similar to Facebook or Instagram

Both Instagram and Facebook allow their users to comment on news feeds. In the comment scene, they basically have a UITableView with all the comments and a “footer” where user may enter comments and post them. So the “footer” is a UIView or UIToolBar with a UITextField/UITextView and a UIButton. Truly simple stuff from the look of it. Well I have been trying to implement it and the keyboard is not cooperating. I need the keyboard to not hide the “footer”. Especially now in iOS 8 the keyboard comes with a suggestions tool bar that a user may choose to show or hide. All these interactions make it difficult to keep my “footer” right above the keyboard while user is entering text. Every time I think I nail the solution, I find a multitude of bugs.
In one implementation, I use keyboard notification to listen for when the keyboard is up or going down (partly based on iPhone Keyboard Covers UITextField). The problem with this implementation is that there is a lag of about 1 to 2 seconds for when the keyboard shows up and for the “footer” to climb to the top of the keyboard from the bottom of the screen. A second issue is when user drags the suggestion toolbar to either show or hide it while typing, it causes my “footer” to move in unpredictable manners: which means I will need some static variables to meticulously track cumulative interactions with the suggestion toolbar just to fix that bug. Also notice that I put “footer” within quotation marks. That’s because I am not referring to a UITableView footer. But rather a view that I create beneath the table view as suggested by UITableView, make footer stay at bottom of screen?
Another implementation I tried was to use a “footer” and a keyboard ToolBar. When user clicks on the UITextField of the footer, that would cause the keyboard to show up with a replica of the footer as inputAccessoryView. This is basically to visually fool the user into thinking it’s the same footer that seamlessly climbs with the keyboard. But in reality I am using two compound Views: a “footer” and a keyboard toolbar. The first problem I encounter with this one is that I cannot seem to make the tool bar text field the first responder programmatically. This actually used to work in ios-7. But since I updated to iOS-8 it does not work. So if I do footerTextField.inputAccessoryView=keyboardToolBar and then in the textfield delegate method check if(textField==footerTextField){[tooBarTextField becomeFirstResponder];}, iOS-8 just ignores the whole thing or, worse, dismiss the keyboard and the toolbar altogether, so that in fact the keyboard never shows up when I click on footerTextField since the showing and dismissing happen so quickly.So again this used to work in iOS-7, but in iOS-8 it does not work.
a third approach was to make the parent view a TPKeyboardAvoidingScrollView such that I would have parent, and children UITableView and “footer”. Here while TPKeyboardAvoiding have worked for me on other scenes in the app, for whatever reason it’s not working here. My guess is because I am using a UITableView as one of the children of a UIScrollView.
a forth approach was to make my “footer” an actual UITableView section footer; section footer because I want it to float at the bottom. The problem with section footer is that they don’t stick to the bottom, which gives a visually erratic user experience as you scroll the table.
Ok, so I have said a lot. So finally, has anyone implemented a scene similar to Facebook’s/Instagram’s NewsFeed Comment scene? If so, will you please help me?
To recap: the Facebook/Instagram input textfield grows with text; sticks to the top of the keyboard whether the keyboard's suggestion toolbar is showing or hidden; sticks to the bottom of the screen when the keyboard is gone.
SlackTextViewController seems to fit all your requirements and is very well-written.

UISearchDisplayController inside popover - bad animation on cancelling search

My iPad app uses a popover to perform some searching. The search results are handled using a UISearchDisplayController, and I am having some trouble removing some little graphical artefacts.
My popover starts out looking like this:
When you click inside the search bar, the popover expands (animated) to:
All good so far... typing in the search field overlays a new table view showing the results of your search term.
But if you don't type anything into the search field, the overlay stays translucent, as above. The problem then comes when you click the cancel button next to the search field. A visual artefact appears at the bottom of the table view: an area the same height as one of the table view cells goes completely clear immediately, while the rest of the overlay animates to 0 alpha. The screenshot below is as close to the start of the animation I could get:
The popover also resizes to the original size in my case, although the artefact remains even if there is no resizing.
Given that all the important functionality of the search is handled by the UISearchDisplayController, I'm not sure what to change to solve this problem. Any ideas?
This might be a bug worth reporting. There are actually a surprising number of bugs in UIPopoverController. At least 3 that I know about separate from this, none of which are planned to be fixed anytime soon (I asked several engineers at WWDC this year). One of my bugs was actually related to the UISearchDisplayController in a popover, specifically how it handles filter buttons if the Popover is in the detail view (it renders them in the worst possible way, on the same line as the text view and completely unusable).

searchResultsTableView takes entire screen on ipad

I am working on a app for the iPad which has a tableView on the left and a view on the right. We are not using the UISplitViewController.
I have been able to setup filtered results using the Search Display Controller and a search bar, but the search results take up the entire screen.
Ideally, I would like to have the search results only take up the same amount of screen as our tableView. Or, barring that, have a way to dismiss the search results when 'didSelectRowAtIndexPath' is activated.
I'm not sure what code I should post. I'm using the code from the Apple code sample: TableSearch.
on the comment below: something like this..?
[self.searchDisplayController.searchResultsTableView setFrame:myTableView.view];
By default, table views take up the whole screen, but there is nothing stopping you from setting their frame.
Just call -setFrame on the searchResultsTableView property of your search display controller.

Resources