How to implement newsfeed comment page similar to

2019-04-11 10:50发布

问题:

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.

回答1:

SlackTextViewController seems to fit all your requirements and is very well-written.