Swift UITableView does not show up the content - ios

I have a side menu and for each selection I want to load a new ViewController (basically each page has a separate ViewController).
This is the relevant code where I load a new ViewController:
viewController = storyboard!.instantiateViewController(withIdentifier: "commissionsViewController")
var viewInAction = UIView()
viewInAction = viewController.view
let gestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(self.tapOnView))
viewInAction.addGestureRecognizer(gestureRecognizer)
viewInAction.layer.backgroundColor = UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 0.0).cgColor
viewInAction.translatesAutoresizingMaskIntoConstraints = false
if let subview = containerView.viewWithTag(100) {
subview.removeFromSuperview()
}
containerView.insertSubview(viewInAction, belowSubview: menuView)
setConstrainsOnView(viewObject: viewInAction)
This is the code for the ViewController that is loaded:
import UIKit
class CommissionsViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
var tableView = UITableView()
var tableData = ["Beach", "Clubs", "Chill", "Dance"]
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
tableView = UITableView(frame: self.view.bounds, style: UITableViewStyle.plain)
tableView.dataSource = self
tableView.delegate = self
tableView.backgroundColor = UIColor.blue
tableView.register(UITableViewCell.self, forCellReuseIdentifier: "my")
tableView.contentInset.top = 20
let contentSize = self.tableView.contentSize
let footer = UIView(frame: CGRect(x: self.tableView.frame.origin.x,
y: self.tableView.frame.origin.y + contentSize.height,
width: self.tableView.frame.size.width,
height: self.tableView.frame.height - self.tableView.contentSize.height))
self.tableView.tableFooterView = footer
view.addSubview(tableView)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "my", for: indexPath)
cell.textLabel?.text = "This is row \(tableData[indexPath.row])"
return cell
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return tableData.count
}
The problem: As you can see the CommissionsViewController contains a tableView that is added programatically. That tableView does not show up any cell! Basically the method cellForRowAt is never called! And I don't understand why!
I can see a blue view, which is the tableView's background, so the tableView is in place, but it doesn't load the cells!
The method numberOfRowsInSection is called.
I tried to debug it using the debugger but no result. I simply don't understand the flow.
Thank you respectfully.

When you add another viewController's view to your view hierarchy, you must tell both viewControllers (see this answer for further information).
Add the addChildViewController and didMoveToParentViewController calls like this:
viewController = storyboard!.instantiateViewController(withIdentifier: "commissionsViewController")
self.addChildViewController(viewController)
var viewInAction = viewController.view
let gestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(self.tapOnView))
viewInAction.addGestureRecognizer(gestureRecognizer)
viewInAction.layer.backgroundColor = UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 0.0).cgColor
viewInAction.translatesAutoresizingMaskIntoConstraints = false
if let subview = containerView.viewWithTag(100) {
subview.removeFromSuperview()
}
containerView.insertSubview(viewInAction, belowSubview: menuView)
setConstrainsOnView(viewObject: viewInAction)
viewController.didMoveToParentViewController(self)

After you set the dataSource and he delegate to self, you never make the tableView load any data. That means you need to call tableView.reloadData() at the end of viewDidLoad()
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
tableView = UITableView(frame: self.view.bounds, style: UITableViewStyle.plain)
tableView.dataSource = self
tableView.delegate = self
tableView.backgroundColor = UIColor.blue
tableView.register(UITableViewCell.self, forCellReuseIdentifier: "my")
tableView.contentInset.top = 20
let contentSize = self.tableView.contentSize
let footer = UIView(frame: CGRect(x: self.tableView.frame.origin.x,
y: self.tableView.frame.origin.y + contentSize.height,
width: self.tableView.frame.size.width,
height: self.tableView.frame.height - self.tableView.contentSize.height))
self.tableView.tableFooterView = footer
view.addSubview(tableView)
tableView.reloadData()
}

In viewDidLoad method view is loaded but has incorrect size.
Try to change initialization of UITableView in next way
let screenBounds = UIScreen.main.bounds
let rect = CGRect(x: 0, y: 0, width: screenBounds.width, height: screenBounds.height)
tableView = UITableView(frame: rect, style: UITableViewStyle.plain)

Go to ComissionsViewController, viewDidLoad() method and add tableView.reloadData() right after view.addSubview(tableView) — it makes all your troubles disappear.
UPD: I have just made a test project where it works. I have copied the code you posted and only commented a couple of unrelated lines. The only significant difference I made is adding the line of code I mentioned above. You can download and run it to see it works :)
https://drive.google.com/file/d/0B55tO8S_7Ag7VnppMk1fWlg5dWM/view

Related

How to increase the width of custom cells in UITableView

I have created the UITableView with the custom UITableViewCell. But the problem which I am getting is the width of the cells is not the frame width though I have assigned in the CGReact. Please have a look over my code :
CustomTableViewCell Class:
import UIKit
class CustomTableViewCell: UITableViewCell {
lazy var backView : UIView = {
let view = UIView(frame: CGRect(x: 10, y: 6, width: self.frame.width, height: 76))
view.backgroundColor = .red
view.layer.applySketchShadow()
return view
}()
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
}
lazy var iconTime : UIImageView = {
var object = UIImageView(frame: CGRect(x: 10, y: 54, width: 12, height: 12))
object.image = #imageLiteral(resourceName: "clock")
return object
}()
lazy var notification : UILabel = {
var object = UILabel(frame: CGRect(x: 10, y: 7, width: backView.frame.width, height: 40))
object.adjustsFontSizeToFitWidth = true
object.minimumScaleFactor = 0.5
object.font = object.font.withSize(28.0)
object.numberOfLines = 3
return object
}()
lazy var notificationTime : UILabel = {
var object = UILabel(frame: CGRect(x: 30, y: 40, width: backView.frame.width, height: 40))
object.adjustsFontSizeToFitWidth = true
object.minimumScaleFactor = 0.5
object.font = object.font.withSize(12.0)
return object
}()
override func layoutSubviews() {
contentView.backgroundColor = UIColor.clear
backgroundColor = UIColor.clear
backView.layer.cornerRadius = 5
backView.clipsToBounds = true
}
override func setSelected(_ selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
addSubview(backView)
[notification, notificationTime, iconTime].forEach(backView.addSubview(_:))
}
}
And my view controller as follows :
import UIKit
class UserModal {
var tableView = UITableView()
var notification: String?
var notificationTime : String?
init(notification: String, notificationTime: String) {
self.notification = notification
self.notificationTime = notificationTime
}
}
class newNotificationController : UIViewController {
var tableView = UITableView()
var userMod = [UserModal]()
override func viewDidLoad() {
super.viewDidLoad()
setTableView()
userMod.append(UserModal(notification: "Data ", notificationTime: "Time"))
userMod.append(UserModal(notification: "This is some Notification which needs to be populated in the Grid view for testing but lets see what is happening here!! ", notificationTime: "12-12-1212 12:12:12"))
userMod.append(UserModal(notification: "Data ", notificationTime: "Time"))
}
func setTableView() {
tableView.frame = self.view.frame
tableView.backgroundColor = UIColor.clear
tableView.delegate = self
tableView.dataSource = self
tableView.separatorColor = UIColor.clear
self.view.addSubview(tableView)
tableView.register(CustomTableViewCell.self, forCellReuseIdentifier: "cell")
}
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
navigationController?.setNavigationBarHidden(true, animated: animated)
}
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
navigationController?.setNavigationBarHidden(false, animated: animated)
}
}
extension newNotificationController: UITableViewDelegate , UITableViewDataSource {
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return userMod.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
guard let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as? CustomTableViewCell else { fatalError("Unable to populate Notification History")}
cell.notification.text = userMod[indexPath.row].notification
cell.notificationTime.text = userMod[indexPath.row].notificationTime
return cell
}
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
return 85
}
}
Please have a look over the result:
I am not getting it why the width of my cells is the width of the frame. Any help will be highly appreciated. Thanks!!
The problem is in this code is frame width, somehow the width of the self is not the width of a device, so because of this, you are facing this issue.
lazy var backView : UIView = {
let view = UIView(frame: CGRect(x: 10, y: 6, width: self.frame.width, height: 76))
view.backgroundColor = .red
view.layer.applySketchShadow()
return view
}()
To resolve this issue you can set frame like this
let view = UIView(frame: CGRect(x: 10, y: 6, width: UIScreen.main.bounds.size.width - 10, height: 76))
You set the width your view
UIView(frame: CGRect(x: 5, y: 6, width: self.frame.width - 10,
height: 76))
tableView.frame = CGRect(x: 0, y: 0, width:
self.view.frame.size.width, height: self.view.frame.size.height)
you need to give constraint to the tableview. Top, Leading, Trailing, Bottom.
put this tableView.translatesAutoresizingMaskIntoConstraints = false line in your function
func setTableView() {
tableView.frame = self.view.frame
tableView.backgroundColor = UIColor.clear
tableView.delegate = self
tableView.dataSource = self
tableView.separatorColor = UIColor.clear
self.view.addSubview(tableView)
tableView.translatesAutoresizingMaskIntoConstraints = false //add this line
tableView.register(CustomTableViewCell.self, forCellReuseIdentifier: "cell")
}
and change width: UIScreen.main.bounds.size.width - 10 it.
thanks..

Adding tableview to scrollview with paging enabled.

I am creating an app and one of its screen needs to have a UIScrollView with paging. In each page of the scrollview it needs to have a UITableView as shown:
I have accomplished to create a scrollview with paging enabled (programatically) but the problem I am facing is:
If I create a simple UILabel and add it to the pages, it works fine. But if I create a tableview and add it to the pages (if this term makes sense) nothing gets displayed on the screen. Here is my code with comments on related places for better understanding:
class SampleViewController: UIViewController, UIScrollViewDelegate, UITableViewDelegate, UITableViewDataSource {
let screenHeight = UIScreen.main.bounds.height
let screenWidth = UIScreen.main.bounds.width
let scrollView = UIScrollView()
let tableView = UITableView()
var colors:[UIColor] = [UIColor.red, UIColor.blue, UIColor.green, UIColor.yellow]
let animals: [String] = ["Horse", "Cow", "Camel", "Sheep", "Goat", "Dog", "Cat", "Kitten", "Lion", "Tiger", "Owl", "Skylark", "Snail", "Cub", "Zebra"]
var frame: CGRect = CGRect(x:0, y:0, width:0, height:0)
var pageControl : UIPageControl = UIPageControl(frame: CGRect(x:50,y: 300, width:200, height:50))
let cellReuseIdentifier = "cell"
override func viewDidLoad() {
super.viewDidLoad()
let frameOfScrollView : CGRect = CGRect(x:0, y:0, width:screenWidth, height:screenHeight)
scrollView.frame = frameOfScrollView
scrollView.delegate = self
scrollView.isPagingEnabled = true
tableView.delegate = self
tableView.dataSource = self
self.view.addSubview(scrollView)
self.tableView.register(UITableViewCell.self, forCellReuseIdentifier: cellReuseIdentifier)
self.scrollView.contentSize = CGSize(width:self.scrollView.frame.size.width * 4,height: self.scrollView.frame.size.height)
for index in 0..<4 {
frame.origin.x = self.scrollView.frame.size.width * CGFloat(index)
frame.size = self.scrollView.frame.size
// THIS THING DOESN'T WORK
tableView.frame = frame
self.scrollView .addSubview(tableView)
// THIS THING WORKS
let subView = UILabel(frame: frame)
subView.backgroundColor = colors[index]
subView.text = "how are you?"
self.scrollView .addSubview(subview)
}
}
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
let pageNumber = round(scrollView.contentOffset.x / scrollView.frame.size.width)
pageControl.currentPage = Int(pageNumber)
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.animals.count
}
// create a cell for each table view row
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell:UITableViewCell = self.tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier) as UITableViewCell!
cell.textLabel?.text = self.animals[indexPath.row]
return cell
}
}
What am I doing wrong? Did I miss anything regrading tableview?
Note: I have created views programmatically because I didn't have much understanding regarding which constraints shall I use in order to add paging to scrollview because I am a newbie to iOS. If anyone can provide some solution to my problem in terms of auto layouts, it would be welcomed.
Basically the purpose is just to achieve what is shown in the screenshot attached above. Any alternate approach if applicable, would also be appreciated.
No need to declare global variable for UITableview.
Replace viewDidLoad() to achieve your requirement.
override func viewDidLoad() {
super.viewDidLoad()
let frameOfScrollView : CGRect = CGRect(x:0, y:0, width:screenWidth, height:screenHeight)
scrollView.frame = frameOfScrollView
scrollView.delegate = self
scrollView.isPagingEnabled = true
// tableView.delegate = self
// tableView.dataSource = self
self.view.addSubview(scrollView)
// self.tableView.register(UITableViewCell.self, forCellReuseIdentifier: cellReuseIdentifier)
self.scrollView.contentSize = CGSize(width:self.scrollView.frame.size.width * 4,height: self.scrollView.frame.size.height)
for index in 0..<4 {
frame.origin.x = self.scrollView.frame.size.width * CGFloat(index)
frame.size = self.scrollView.frame.size
let tableView = UITableView()
tableView.delegate = self
tableView.dataSource = self
tableView.register(UITableViewCell.self, forCellReuseIdentifier: cellReuseIdentifier)
tableView.frame = frame
self.scrollView .addSubview(tableView)
//// // THIS THING DOESN'T WORK
// tableView.frame = frame
// self.scrollView .addSubview(tableView)
// THIS THING WORKS
// let subView = UILabel(frame: frame)
// subView.backgroundColor = colors[index]
// subView.text = "how are you?"
// self.scrollView.addSubview(subView)
}
}
Replace
let cell:UITableViewCell = self.tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier) as UITableViewCell!
with
let cell:UITableViewCell = tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier) as UITableViewCell!
Remove
let tableView = UITableView()

UIView of TableView can't scroll or tap

What I did was when the search controller is clicked, it shows a View with a tableView in it. (like Instagram) . It shows the tableView but it cannot interact with it.
I was doing some research since people had come across this before here. Here are the things I've tried:
Bring subView to the front
have set tableView.isUserInteractionEnabled = true -> Have also ran on iPhone
Have set tableViewHeight to ScreenHeight
But the tableView still doesn't want to scroll/click!
Here's the relevant code that I have if it helps,
Controller with search bar and collection views:
class UserSearchController: UICollectionViewController, UICollectionViewDelegateFlowLayout,UISearchBarDelegate, UISearchDisplayDelegate {
let cellId = "cellId"
let searchBar: UISearchBar = {
let sb = UISearchBar()
sb.placeholder = "Search"
return sb
}()
func searchBarTextDidBeginEditing(_ searchBar: UISearchBar) {
searchBar.setShowsCancelButton(true, animated: true)
tableView.isHidden = false
}
func searchBarSearchButtonClicked(_ searchBar: UISearchBar) {
searchBar.setShowsCancelButton(true, animated: true)
}
func searchBarCancelButtonClicked(_ searchBar: UISearchBar) {
searchBar.resignFirstResponder()
searchBar.setShowsCancelButton(false, animated: true)
searchBar.text = ""
tableView.isHidden = true
}
let tableView: UIView = {
let tv = SearchUsersTv()
tv.isUserInteractionEnabled = true
tv.bringSubview(toFront: tv)
tv.clipsToBounds = false
return tv
}()
override func viewDidLoad() {
super.viewDidLoad()
collectionView?.register(UserProfileVideoCell.self, forCellWithReuseIdentifier: cellId)
view.addSubview(tableView)
tableView.isHidden = true
}
Here's the code for the relevant code for the tableView (SearchUsersTv):
class SearchUsersTv: UIView, UITableViewDelegate, UITableViewDataSource {
let cellId = "cellId"
var tableView = UITableView()
override init(frame: CGRect){
super.init(frame: frame)
setupTv()
}
func setupTv() {
let screenHeight = UIScreen.main.bounds.height
let screenWidth = UIScreen.main.bounds.width
tableView.delegate = self
tableView.dataSource = self
tableView.register(UITableViewCell.self, forCellReuseIdentifier: cellId)
tableView.isUserInteractionEnabled = true
tableView = UITableView(frame: CGRect(x: 0, y: 0, width: screenWidth, height: screenHeight))
self.addSubview(tableView)
bringSubview(toFront: tableView)
}
Problem to fix: Make tableView scroll and click
Thank you in advanced!
Your problems is that you are initialising your custom class in wrongly way, you need call SearchUsersTv(frame: instead of SearchUsersTv() for initialisation because all your tableView setup happen on setupTv() which is called in SearchUsersTv(frame: initialisation only
replace your tableView inline creation by this
let tableView: UIView = {
let screenHeight = UIScreen.main.bounds.height
let screenWidth = UIScreen.main.bounds.width
let tv = SearchUsersTv(frame: CGRect(x: 0, y: 0, width: screenWidth, height: screenHeight))
tv.isUserInteractionEnabled = true
tv.bringSubview(toFront: tv)
tv.clipsToBounds = false
tv.tableView.register(UITableViewCell.self, forCellReuseIdentifier: "cellId")
return tv
}()

How to change separator height in UITableView Swift 3?

Although there a few answers already on this topic. None of them cover Swift 3 and they are from a long time ago. What is currently the best way to change the separator height in a UITableView in Swift 3?
Updated for Swift 3:
If you want to change the height of the UITableView separator, use the code below.
You should add it to the UITableViewCell method awakeFromNib() to avoid re-creation.
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
let mScreenSize = UIScreen.main.bounds
let mSeparatorHeight = CGFloat(3.0) // Change height of speatator as you want
let mAddSeparator = UIView.init(frame: CGRect(x: 0, y: self.frame.size.height - mSeparatorHeight, width: mScreenSize.width, height: mSeparatorHeight))
mAddSeparator.backgroundColor = UIColor.brown // Change backgroundColor of separator
self.addSubview(mAddSeparator)
}
This is a correct way to do this.
First, in your ViewController you should set (tableView.separatorStyle = .none)
import UIKit
class ViewController: UIViewController {
#IBOutlet weak var tableView: UITableView!
override func viewDidLoad() {
super.viewDidLoad()
tableView.delegate = self
tableView.dataSource = self
tableView.separatorStyle = .none
}
}
Second, in your TableViewCell class your should create a separatorView.
And don't forget to inherit TableViewCell class for your cell.
class TableViewCell: UITableViewCell {
let separator = UIView()
override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
separator.backgroundColor = .black
contentView.addSubview(separator)
}
override func layoutSubviews() {
super.layoutSubviews()
//Your separatorLineHeight with scalefactor
let separatorLineHeight: CGFloat = 1/UIScreen.main.scale
separator.frame = CGRect(x: self.contentView.frame.origin.x,
y: self.contentView.frame.size.height - separatorLineHeight,
width: self.contentView.frame.size.width,
height: separatorLineHeight)
}
}
Finally, you've got a thin separator line and, of course, you can increase this value what do you like.
For Those who want to do it using autolayout here is the code
var additionalSeparator:UIView = UIView()
override func awakeFromNib() {
super.awakeFromNib()
self.createSeparator()
}
func createSeparator() {
self.additionalSeparator.translatesAutoresizingMaskIntoConstraints = false
self.contentView.addSubview(self.additionalSeparator)
}
func setConstraintForSeparator() {
self.additionalSeparator.leadingAnchor.constraint(equalTo: self.contentView.leadingAnchor, constant: self.separatorInset.left).isActive = true
self.additionalSeparator.trailingAnchor.constraint(equalTo: self.contentView.trailingAnchor, constant: -self.separatorInset.right).isActive = true
self.additionalSeparator.bottomAnchor.constraint(equalTo: self.contentView.bottomAnchor, constant: 0).isActive = true
self.additionalSeparator.heightAnchor.constraint(equalToConstant: 1).isActive = true
self.additionalSeparator.backgroundColor = UIColor.greyishBrown
}
Try this Swift 3:
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: YOUR_CELL_IDENTIFIER, for: indexPath) as! yourTableViewCell
let viewSeparatorLine = UIView(frame:CGRect(x: 0, y: cell.contentView.frame.size.height - 5.0, width: cell.contentView.frame.size.width, height: 5))
viewSeparatorLine.backgroundColor = .red
cell.contentView.addSubview(viewSeparatorLine)
return cell
}

Different height in custom UITableViewCell

I want to create a custom UITableViewCell programmatically and cells have different height. But the height is fixed.
SingeTableViewCell.swift
class SingleTableViewCell: UITableViewCell {
var title = UILabel()
var content = UILabel()
override func awakeFromNib() {
super.awakeFromNib()
self.setSeparator()
self.setTitle()
self.setContent()
}
override func setSelected(selected: Bool, animated: Bool) {
super.setSelected(selected, animated: animated)
// Configure the view for the selected state
}
func setSeparator() {
let separator = UIView(frame: CGRectMake(0, 0, UIScreen.mainScreen().bounds.width, 10))
separator.backgroundColor = UIColor(hex: "#E7EBF2")
contentView.addSubview(separator)
}
func setTitle() {
let viewTitle = UIView(frame: CGRectMake(0, 10, UIScreen.mainScreen().bounds.width, 40))
viewTitle.backgroundColor = UIColor(hex: "#EEE")
viewTitle.layer.borderColor = UIColor.lightGrayColor().CGColor
viewTitle.layer.borderWidth = 1.0
self.title = UILabel(frame: CGRectMake(5, 0, UIScreen.mainScreen().bounds.width-5, 40))
self.title.textAlignment = NSTextAlignment.Center
self.title.font = self.title.font.fontWithSize(13)
viewTitle.addSubview(self.title)
contentView.addSubview(viewTitle)
}
func setContent() {
self.content = UILabel(frame: CGRectMake(0, 50, UIScreen.mainScreen().bounds.width, 400))
self.backgroundColor = UIColor.whiteColor()
contentView.addSubview(self.content)
}
}
I want cell's height is equals to frame's height.
Thank you and sorry for my bad english.
You can use Auto Layout to set self-sizing cell. Working with Self-Sizing Table View Cells
Alternatively, you can set the height with - tableView:heightForRowAtIndexPath: in UITableViewDelegate
class ViewController: UIViewController, UITableViewDelegate{
func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
// assume that you want to set height equal to 300 in 1st secion, and 200 in 2nd section.
let heights: [CGFloat] = [ 300,200 ]
return heights[indexPath.section]
}
}

Resources