I have a UITableViewController with a search controller embedded in the navigation bar.
When the view shows in a modal, there is a gap between the first row and the navigation bar.
here is my implementation. Some code has been redacted for confidentiality. But anything regarding view controller setup should still be there:
import Foundation
class SearchViewController: UITableViewController {
fileprivate lazy var searchController: UISearchController = {
let searchController = UISearchController(searchResultsController: nil)
searchController.dimsBackgroundDuringPresentation = false
searchController.hidesNavigationBarDuringPresentation = false
searchController.searchBar.showsCancelButton = true
searchController.searchBar.delegate = self
return searchController
}()
override func viewDidLoad() {
super.viewDidLoad()
setupTableView()
navigationItem.titleView = searchController.searchBar
}
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
navigationController?.navigationBar.tintColor = BrandColor.appleDarkGray
}
}
extension ExploreSearchViewController: UISearchBarDelegate {
func searchBarCancelButtonClicked(_ searchBar: UISearchBar) {
presentingViewController?.dismiss(animated: true, completion: nil)
}
func searchBarSearchButtonClicked(_ searchBar: UISearchBar) {
if let searchText = searchBar.text {
tableView.refreshControl?.beginRefreshing()
searchedText = searchText
}
}
}
// MARK: - UITableView Methods
extension ExploreSearchViewController {
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return searchResultsProvider.searchResults.count
}
override func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
guard searchResultsProvider.canLoadNextPage else { return }
// handle paging here...
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
guard searchResultsProvider.searchResults.count > indexPath.row else { return UITableViewCell() }
// Setup search result cell here...
}
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
// Handle cell did tap here...
}
#objc private func refresh() {
searchResultsProvider.refreshResults()
}
// MARK - Table View Helpers
private func setupTableView() {
registerCells()
self.tableView.backgroundColor = .white
self.tableView.contentInsetAdjustmentBehavior = .always
self.tableView.refreshControl = UIRefreshControl()
self.tableView.refreshControl?.addTarget(self, action: #selector(refresh), for: .valueChanged)
self.tableView.useDefaultPageLoadingIndicator()
self.tableView.setBackgroundViewIfEmpty(message: Self.searchInitialMessage, remedyButton: nil)
}
private func registerCells() {
//Register Table View Cells here...
}
}
Has anyone seen this kind of issue before? I can't move the top edge insets up because then the refresh control will be hidden behind the navigation bar.
Anyone seen this behaviour before? If so, how did you solve it?
The issue was caused by the table view style was set to .grouped on the previous view controller.
Setting the style to .plain solved this issue.
I believe the reason grouped style causes the blank space is because its adding an empty section header above the cells.
Related
When I use trailingSwipeActionsConfigurationForRowAt my TableView will show the delete and reorder options, however when selecting reorder nothing happens. I think I have all of the correct methods and am calling setEditing; is there anything else I'm missing? Thanks!
import UIKit
class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {
let tableView = UITableView()
override func viewDidLoad() {
super.viewDidLoad()
setupTableView()
}
func setupTableView() {
tableView.frame = self.view.frame
tableView.dataSource = self
tableView.delegate = self
tableView.register(CustomCell.self, forCellReuseIdentifier: "CustomCell")
tableView.dragInteractionEnabled = true
self.view.addSubview(tableView)
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 8
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "CustomCell", for: indexPath) as! CustomCell
cell.backgroundColor = .gray
cell.showsReorderControl = true
return cell
}
override func setEditing(_ editing: Bool, animated: Bool) {
super.setEditing(editing, animated: animated)
self.tableView.setEditing(editing, animated: animated)
}
func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
let deleteAction = UIContextualAction(style: .normal, title: "delete") { (action, view, completion) in
tableView.reloadData()
completion(true)
}
let reorderAction = UIContextualAction(style: .normal, title: "reorder") { (action, view, completion) in
tableView.setEditing(true, animated: true)
completion(true)
}
return UISwipeActionsConfiguration(actions: [deleteAction, reorderAction])
}
}
class CustomCell: UITableViewCell {
}
Result after swiping:
After selecting reorder:
A few observations:
You are not going to get the reorder controls if you do not implement tableView(_:moveRowAt:to:), e.g., assuming you had a model which was an array called objects, you could do the following:
func tableView(_ tableView: UITableView, moveRowAt sourceIndexPath: IndexPath, to destinationIndexPath: IndexPath) {
let object = objects.remove(at: sourceIndexPath.row)
objects.insert(object, at: destinationIndexPath.row)
}
The trailingSwipeActionsConfigurationForRowAt is probably not the right place to put a “reorder” command. Part of the reason is that once the table view is in edit mode and you tap on the ⛔️, the trailing actions show up, and “reorder” does not make sense in that context. E.g., here I am tapping on ⛔️ and I see the confusing actions.
I would suggest only adding “delete” as the trailing action. That way, you (a) get only “delete” if you tap on ⛔️ in isEditing mode, but also (b) get the stand-alone swipe action, too.
You cannot initiate isEditing from the trailing swipe actions (and, as discussed above, I do not think you want to, anyway). So, if you do not have “reorder” in the trailing swipe actions, you need some other method to enter edit mode. E.g., above, I added an “edit” button to the navigation bar that toggles isEditing:
#IBAction func didTapEdit(_ sender: Any) {
tableView.isEditing.toggle()
}
Then, you can keep the swipe to delete functionality, but when you tap on edit button, you have the tap on ⛔️ to delete functionality (plus the handles for reordering because we added tableView(_:moveRowAt:to:) as outlined in step one, above):
Another way to achieve reordering is to just allow drag and drop within the table view where you can long-press on a row and then drag it:
This is enabled by setting dragInteractionEnabled and dropDelegate:
class ViewController: UIViewController {
#IBOutlet weak var tableView: UITableView!
let formatter: NumberFormatter = {
let formatter = NumberFormatter()
formatter.numberStyle = .spellOut
return formatter
}()
private var objects: [Foo] = ...
override func viewDidLoad() {
super.viewDidLoad()
...
tableView.dragInteractionEnabled = true
tableView.dropDelegate = self
}
}
// MARK: - UITableViewDataSource
extension ViewController: UITableViewDataSource { ... }
// MARK: - UITableViewDelegate
extension ViewController: UITableViewDelegate {
func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
let deleteAction = UIContextualAction(style: .destructive, title: "delete") { [weak self] action, view, completion in
self?.objects.remove(at: indexPath.row)
tableView.deleteRows(at: [indexPath], with: .middle)
completion(true)
}
return UISwipeActionsConfiguration(actions: [deleteAction])
}
// This is used if table view is in `isEditing` mode and by `UITableViewDropDelegate`
func tableView(_ tableView: UITableView, moveRowAt sourceIndexPath: IndexPath, to destinationIndexPath: IndexPath) {
let object = objects.remove(at: sourceIndexPath.row)
objects.insert(object, at: destinationIndexPath.row)
}
}
// MARK: - UITableViewDropDelegate
extension ViewController: UITableViewDropDelegate {
func tableView(_ tableView: UITableView, dropSessionDidUpdate session: UIDropSession, withDestinationIndexPath destinationIndexPath: IndexPath?) -> UITableViewDropProposal {
guard
session.items.count == 1, // Accept only one drag item ...
tableView.hasActiveDrag // ... from within this table view
else {
return UITableViewDropProposal(operation: .cancel)
}
return UITableViewDropProposal(operation: .move, intent: .insertAtDestinationIndexPath)
}
func tableView(_ tableView: UITableView, performDropWith coordinator: UITableViewDropCoordinator) {
guard let destinationIndexPath = coordinator.destinationIndexPath else { return }
for item in coordinator.items {
if let sourceIndexPath = item.sourceIndexPath {
DispatchQueue.main.async {
tableView.moveRow(at: sourceIndexPath, to: destinationIndexPath)
}
}
}
}
}
Clearly, if you were going to enable drag from this app to others, you would add UITableViewDragDelegate conformance here, and make your model objects conform to NSItemProviderReading and NSItemProviderWriting. But the above should be sufficient for dragging and dropping to reorder within a UITableView.
I tried all the SOF solutions nothing work for my case.
My app is using tabbar and one of the tabbar is setting(tableview). User can tap on the support cell to send email.
I can bring up the email view but it doesn't have cancel button. Only way to dismiss it is to send the email or swipe down save/delete draft.
Thanks!!
import UIKit
import MessageUI
class SettingVC: UIViewController, UITableViewDelegate, UITableViewDataSource, MFMailComposeViewControllerDelegate {
#IBOutlet weak var tableView: UITableView!
let mail = MFMailComposeViewController()
var fromSetting: Bool = false
let settingsSction = ["Section0", "Section1", "Section2"]
let settingsCell = [["Cell0"],
["Cell1"],
["Cell2", "Support"]]
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
self.navigationController?.navigationBar.barStyle = .black
}
override var preferredStatusBarStyle: UIStatusBarStyle {
return .lightContent
}
override func viewDidLoad() {
super.viewDidLoad()
setUpNavBar()
tableView.delegate = self
tableView.dataSource = self
mail.mailComposeDelegate = self
}
func setUpNavBar() {
self.navigationItem.titleView?.tintColor = .white
let settingsTitleLabel = UILabel()
settingsTitleLabel.textColor = .white
settingsTitleLabel.font = UIFont.boldSystemFont(ofSize: 18)
settingsTitleLabel.text = "Settings"
self.navigationItem.titleView = settingsTitleLabel
}
//MARK: Table View Sections
func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
return 50
}
func numberOfSections(in tableView: UITableView) -> Int {
return settingsSction.count
}
func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
return settingsSction[section]
}
//MARK: Table View Cell Title
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return settingsCell[section].count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
cell.textLabel?.text = "\(settingsCell[indexPath.section][indexPath.row])"
cell.selectionStyle = .none
return cell
}
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
switch indexPath.section {
case 2:
switch indexPath.row {
case 1:
sendEmail()
default:
break
}
default:
break
}
}
func sendEmail() {
if MFMailComposeViewController.canSendMail() {
mail.navigationBar.tintColor = UIColor.orange
mail.setToRecipients(["support#example.com"])
mail.setSubject("I have an issue.")
self.present(mail, animated: true, completion: nil)
} else {
alertOK(title: "No Mail App Available", message: "Please install Mail app in your phone or use other mail app to send us the issue. Thank you.", sender: self)
}
}
func mailComposeController(_ controller: MFMailComposeViewController, didFinishWith result: MFMailComposeResult, error: Error?) {
controller.dismiss(animated: true, completion: nil)
}
}
Issue solved. I was setting the navigation bar color in app delegate so it makes the text white color as well.
So I have recently coded a search bar programmatically using tableview and navigation control. I am now having trouble finding information on how to segue the search bar after the user clicks on an item in the search bar.
I have tried using a view controller but that has not worked. I think my best bet is to do it programmatically.
EDIT There is no function yet in this code to implement a display screen. Im wondering what code is needed (im a very new developer) to get to another screen after clicking an element in the search bar. anything helps!!***
import UIKit
class SearchTableViewController: UITableViewController, UISearchBarDelegate {
let searchBar = UISearchBar()
let tableData = ["Boston University", "Boston College", "Northeastern University", "Suffolk University", "American University", "Harvard University", "Massachusetts Institute of Technology", "Tufts University", "Berklee College of Music", "Emerson College"]
//variables added for search function
var filteredArray = [String()]
var shouldShowSearchResults = false
override func viewDidLoad() {
super.viewDidLoad()
createSearcherBar()
}
func createSearcherBar() {
searchBar.showsBookmarkButton = false
searchBar.placeholder = "Search College"
searchBar.delegate = self
self.navigationItem.titleView = searchBar
}
func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String) {
filteredArray = tableData.filter({ (names: String) -> Bool in
return names.range(of: searchText, options: .caseInsensitive) != nil
})
if searchText != "" {
shouldShowSearchResults = true
self.tableView.reloadData()
}
else{
shouldShowSearchResults = false
self.tableView.reloadData()
}
}
// MARK: - Table view data source
override func numberOfSections(in tableView: UITableView) -> Int {
// #warning Incomplete implementation, return the number of sections
return 1
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
// #warning Incomplete implementation, return the number of rows
if shouldShowSearchResults {
return filteredArray.count
}
else{
return tableData.count
}
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "basicCell", for: indexPath)
if shouldShowSearchResults {
cell.textLabel!.text = filteredArray[indexPath.row]
return cell
}
else{
cell.textLabel!.text = tableData[indexPath.row]
return cell
}
}
override func scrollViewWillBeginDragging(_ scrollView: UIScrollView) {
searchBar.endEditing(true)
}
func searchBarSearchButtonClicked(_ searchBar: UISearchBar) {
shouldShowSearchResults = true
searchBar.endEditing(true)
self.tableView.reloadData()
}
/*
// Override to support conditional editing of the table view.
override func tableView(_ tableView: UITableView, canEditRowAt indexPath: IndexPath) -> Bool {
// Return false if you do not want the specified item to be editable.
return true
}
*/
/*
// Override to support editing the table view.
override func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCell.EditingStyle, forRowAt indexPath: IndexPath) {
if editingStyle == .delete {
// Delete the row from the data source
tableView.deleteRows(at: [indexPath], with: .fade)
} else if editingStyle == .insert {
// Create a new instance of the appropriate class, insert it into the array, and add a new row to the table view
}
}
*/
/*
// Override to support rearranging the table view.
override func tableView(_ tableView: UITableView, moveRowAt fromIndexPath: IndexPath, to: IndexPath) {
}
*/
/*
// Override to support conditional rearranging of the table view.
override func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool {
// Return false if you do not want the item to be re-orderable.
return true
}
*/
/*
// MARK: - Navigation
// In a storyboard-based application, you will often want to do a little preparation before navigation
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
// Get the new view controller using segue.destination.
// Pass the selected object to the new view controller.
}
*/
}
Hopefully I can get a user to click on one of the options in a search bar, and it brings them to a different page.
First of all your method textDidChange is unnecessarily expensive because you are always filtering the array even if the search text is empty. This is more efficient
func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String) {
if searchText.isEmpty {
shouldShowSearchResults = false
filteredArray.removeAll() // good practice to release memory when the search is finished
} else {
filteredArray = tableData.filter{ $0.range(of: searchText, options: .caseInsensitive) != nil }
shouldShowSearchResults = true
}
self.tableView.reloadData()
}
Second of all the declaration of filteredArray is slightly wrong. The parentheses must be outside the brackets. Your syntax declares a string array containing one empty string.
var filteredArray = [String]()
To answer your question implement didSelectRowAt and add the same shouldShowSearchResults logic to distinguish the arrays. Call performSegue and pass the string as sender
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
let item = shouldShowSearchResults ? filteredArray[indexPath.row] : tableData[indexPath.row]
performSegue(withIdentifier: "MyIdentifier", sender: item)
}
and get it in prepare(for segue
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
guard segue.identifier == "MyIdentifier" else { return }
let destinationController = segue.destination as! MyViewController
let item = sender as! String
...
I'm written in snapkit for UI render. I have not use storyboard or nib files.
I want to position top UIView on top of UITableView using SnapKit.
How to write it?
Below is my written code
swift
import UIKit
import SnapKit
class ViewController: UIViewController {
var data: [String] = []
var tableView = UITableView()
var subView = UIView()
var label = UILabel()
override func viewDidLoad() {
super.viewDidLoad()
self.tableView.delegate = self
self.tableView.dataSource = self
// Do any additional setup after loading the view, typically from a nib.
label.text = "Hello?"
self.view.addSubview(self.tableView)
self.tableView.addSubview(self.subView)
self.subView.addSubview(self.label)
self.subView.backgroundColor = .gray
self.tableView.snp.makeConstraints { make in
make.edges.equalToSuperview()
}
self.subView.snp.makeConstraints { make in
make.top.width.equalTo(self.tableView)
make.centerX.equalTo(self.tableView)
make.height.equalTo(200)
}
self.label.snp.makeConstraints { make in
make.centerX.centerY.equalTo(self.subView)
}
for i in 0...100 {
data.append("\(i)")
}
self.tableView.reloadData()
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
}
extension ViewController: UITableViewDataSource {
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.data.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let element = self.data[indexPath.row]
let cell = tableView.dequeueReusableCell(withIdentifier: "comicListCell") ?? UITableViewCell(style: .normal, reuseIdentifier: "comicListCell")
cell.textLabel?.text = element
return cell
}
}
extension ViewController: UITableViewDelegate {
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
print(self.data[indexPath.row])
}
}
My code :
I want it!:
UIView must placed into UITableView children !!
Sorry my bad english..
Thanks for reading
You want subview which is sticky header of tableview. Change this line self.tableView.addSubview(self.subView) to
tableView.tableHeaderView = subView.
You could easily add the tableView method:
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
if section == 0 {
return self.subView
} else {
return UIView.init(frame: CGRect.zero)
}
}
I am looking to get a UIMenuController when an image within a cell is tapped. To be clear this is NOT when the cell is tapped, but rather when the image within the cell is tapped. The tap gesture on the image is firing off properly and running the function, but the menu never shows.
Custom Cell:
class VideoHomeCell: UITableViewCell {
var thumbImage:UIImage! {
didSet {
createCell()
}
}
private lazy var thumbImageView:UIImageView = {
let view = UIImageView(image: self.thumbImage)
view.contentMode = .scaleAspectFill
view.clipsToBounds = true
view.isUserInteractionEnabled = true
view.translatesAutoresizingMaskIntoConstraints = false
let gesture = UITapGestureRecognizer(target: self, action: #selector(imageTapped))
view.addGestureRecognizer(gesture)
return view
}()
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
}
override func setSelected(_ selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
// Configure the view for the selected state
}
func createCell() {
self.addSubview(thumbImageView)
thumbImageView.heightAnchor.constraint(equalToConstant: 100).isActive = true
thumbImageView.widthAnchor.constraint(equalToConstant: 100).isActive = true
thumbImageView.leadingAnchor.constraint(equalTo: self.leadingAnchor).isActive = true
thumbImageView.topAnchor.constraint(equalTo: self.topAnchor).isActive = true
}
#objc func imageTapped(recognizer: UIGestureRecognizer) {
let menuController = UIMenuController.shared
let trimItem = UIMenuItem(title: "Trim", action: #selector(menuSelected))
menuController.menuItems = [trimItem]
menuController.setTargetRect(self.thumbImageView.frame, in: self.superview!)
menuController.setMenuVisible(true, animated: true)
}
#objc func menuSelected() {
print("Menu Selection!")
}
}
TableView:
override func numberOfSections(in tableView: UITableView) -> Int {
return 1
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.videoModelArray.count
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! VideoHomeCell
cell.thumbImage = self.videoModelArray[indexPath.row].originalThumbnail
return cell
}
override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
return 100.0
}
I have tried different values within setTargetRect to include the gesture's view and self.frame. I have also tried rendering in self. Additionally, I manually set a CGRect. Nothing I do allows for the menu to display.
I solved this issue by creating a protocol within the cell subclass and I assigned the table view controller as the delegate. When the image is tapped it fires off the delegate and then the UIMenuController is created within the tableview rather than within the tableviewcell. I pass back the cell and I am then able to use it's view to show the menu. It is also required to have the following on the tableview per Leo Dabus' comment.
override var canBecomeFirstResponder: Bool {
return true
}
In the end I while I was not able to make this work inside the tableviewcell subclass, I do find this an acceptable workaround.