I am trying to follow the guide found here to create a swift sidebar menu: https://www.youtube.com/watch?v=qaLiZgUK2T0
I have reached the following function:
override func tableView(tableView: UITableView!, cellForRowAtIndexPath indexPath: NSIndexPath!) -> UITableViewCell! {
var cell:UITableViewCell? = tableView.dequeueReusableCellWithIdentifier("Cell") as? UITableViewCell
if cell == nil{
cell = UITableViewCell(style :UITableViewCellStyle.Default, reuseIdentifier: "Cell")
// Configure the cell...
cell!.backgroundColor = UIColor.clearColor()
cell!.textLabel.textColor = UIColor.darkTextColor()
let selectedView:UIView = UIView(frame: CGRect (x: 0, y:0, width: cell!.frame.size.width, height: cell!.frame.size.height))
selectedView.backgroundColor = UIColor.blackColor().colorWithAlphaComponent(0.3)
cell!.selectedBackgroundView = selectedView
}
cell!.textLabel.text = tableData[indexPath.row]
return cell
}
I have gotten a "Overriding method with selector 'tableView:cellForRowAtIndexPath..." error; being fairly new to swift i am not sure what to do at this point. Please let me know what to do, if you happen to know of a better guide please let me know.
For anyone who may have this issue in the future here is a complete solution of what worked for me, thanks to zisoft for the help with this:
override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
var cell:UITableViewCell? = tableView.dequeueReusableCellWithIdentifier("Cell") as? UITableViewCell
if cell == nil{
cell = UITableViewCell(style :UITableViewCellStyle.Default, reuseIdentifier: "Cell")
// Configure the cell...
cell!.backgroundColor = UIColor.clearColor()
cell!.textLabel.textColor = UIColor.darkTextColor()
let selectedView:UIView = UIView(frame: CGRect (x: 0, y:0, width: cell!.frame.size.width, height: cell!.frame.size.height))
selectedView.backgroundColor = UIColor.blackColor().colorWithAlphaComponent(0.3)
cell!.selectedBackgroundView = selectedView
}
cell!.textLabel.text = tableData[indexPath.row]
return cell!
}
The function signature has changed during the evolving of swift. The correct signature now is:
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
...
}
So remove the exclamation marks.
Were the same mistakes were not removed by these methods and found this:
if cell == nil{
cell = UITableViewCell(style :UITableViewCellStyle.Default, reuseIdentifier: "Cell")
// Configure the cell...
cell!.backgroundColor = UIColor.clearColor()
cell!.textLabel?.textColor = UIColor.darkGrayColor()
let selectedView:UIView = UIView(frame: CGRect (x: 0, y:0, width: cell!.frame.size.width, height: cell!.frame.size.height))
selectedView.backgroundColor = UIColor.blackColor().colorWithAlphaComponent(0.3)
cell!.selectedBackgroundView = selectedView
}
cell!.textLabel?.text = tableData[indexPath.row]
return cell!
}
Hope this might help.
Related
I first programmatically created a tableview :
private func setupTableView() {
tableView = UITableView(frame: CGRect(x: 0, y: 180, width: view.frame.width, height: view.frame.height), style: UITableView.Style.plain)
tableView.dataSource = self
tableView.delegate = self
tableView.register(ItemTableViewCell.self, forCellReuseIdentifier: "Cell")
view.addSubview(tableView)
}
and set the cellForRow method as below :
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath) as! ItemTableViewCell
guard let finalItems = presenter.finalItems?[indexPath.row] else { return cell }
presenter.configure(cell: cell, FinalItem: finalItems)
return cell
}
Then I configure the ItemTableViewCell as below :
class ItemTableViewCell: UITableViewCell {
private var iconImageView : UIImageView = {
let imgView = UIImageView(image: #imageLiteral(resourceName: "Image"))
imgView.contentMode = .scaleAspectFit
imgView.clipsToBounds = true
return imgView
}()
private var titleLabel : UILabel = {
let lbl = UILabel()
lbl.textColor = .black
lbl.font = UIFont.boldSystemFont(ofSize: 12)
lbl.textAlignment = .left
return lbl
}()
func configure(finalItem: FinalItem) {
titleLabel.text = finalItem.title
iconImageView.downloaded(from: finalItem.images_url.small)
}
}
When I push to the DetailViewController with the uinavigationbar, the elements contained in the rows (titles, labels...) are still visible a few milli seconds:
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
let finalItem = finalItems[indexPath.row]
let detailViewController = ModuleBuilder.createDetailModuleWith(finalItem)
detailViewController.finalItem = finalItem
navigationController?.pushViewController(detailViewController, animated: true)
}
This is not what I am expecting. I never figure this problem out before.
booktable.frame = CGRect(x: 0, y: booktopview.bounds.height, width: screenWidth, height: screenHeight-booktopview.bounds.height-tabbarView.bounds.height)
booktable.register(UITableViewCell.self, forCellReuseIdentifier: "mycell")
booktable.dataSource = self
booktable.delegate = self
booktable.separatorColor = UIColor.lightGray
booktable.backgroundColor = UIColor.clear
booktable.separatorStyle = .singleLine
bookview.addSubview(booktable)
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
if(tableView == booktable)
{
let cell1 = booktable.dequeueReusableCell(withIdentifier: "mycell")
for object in (cell1?.contentView.subviews)!
{
object.removeFromSuperview();
}
let img :UIImageView = UIImageView()
let lbl : UILabel = UILabel()
img.frame = CGRect(x: 15, y: 15, width: 80, height: 130)
img.image = imgarray[indexPath.row]
img.layer.borderWidth = 1.0
img.layer.borderColor = UIColor.lightGray.cgColor
cell1?.contentView.addSubview(img)
imgheight = img.bounds.height
lbl.frame = CGRect(x: img.bounds.width + 40, y: (imgheight+40-80)/2, width: booktable.bounds.width-img.bounds.width + 40 - 100, height: 80)
lbl.text = imgname[indexPath.row]
lbl.numberOfLines = 0
lbl.textAlignment = .left
lbl.font = UIFont(name: "Arial", size: 23)
lbl.textColor = UIColor.black
cell1?.selectionStyle = .none
cell1?.contentView.addSubview(lbl)
return cell1!
}
The code shown above is for book table, which sometimes scrolls like normal and sometimes not scrolling at all. I am doing all the code programatically. I have tested this on both simulators and devices but still the problem exists. Any help is appreciated...
Create Custom UITableViewCell, let's say it is ListTableCell
class ListTableCell: UITableViewCell {
#IBOutlet weak var lblTemp: UILabel!
#IBOutlet weak var imgTemp: UIImage!
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
}
}
I've created UITableViewCell with xib like this and bind IBOutlets
Let's say we have struct Model and array like this
struct Model {
let image : UIImage
let name: String
}
for i in 0...10 {
let model = Model(image: #imageLiteral(resourceName: "Cat03"), name: "Temp \(i)")
array.append(model)
}
Now on ViewController viewDidLoad() method,
tableView.register(UINib(nibName: "ListTableCell", bundle: nil), forCellReuseIdentifier: "ListTableCell")
Implement UITableViewDataSource methods like this,
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return array.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "ListTableCell") as! ListTableCell
let model = array[indexPath.row]
cell.lblTemp.text = model.name
cell.imgTemp.image = model.image
return cell
}
FYI
For different tableviews, you can create different custom cell the same way and cellForRowAt indexPath and numberOfRowsInSection method will change appropriately.
Let me know in case of any queries.
UPDATE
Follow this and this to create CustomTableCell programmatically
I have a UITableView with 2 sections. In the first section I do not want the UIView I have created to appear on the left. It works fine when it initially loads but when it goes off screen and back on again it reappears.
func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath)
{
let cell = tableView.dequeueReusableCell(withIdentifier: "reuseIdentifier") as! ATableCell;
cell.delegate = self;
if (indexPath.section == 1)
{
// let height = cell.bounds.size.height;
let height = 100;
let turnsView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: height));
turnsView.backgroundColor = UIColor.purple;
cell.addSubview(turnsView);
}
else
{
let height = 100;
let turnsView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: height));
turnsView.backgroundColor = UIColor.clear;
cell.addSubview(turnsView);
}
// Configure the cell...
cell.backgroundColor = UIColor.clear;
cell.textLabel?.text = "texting";
cell.detailTextLabel?.text = "testing";
}
I don't want the purple view appearing in the first section at any point.
When using
tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell
You should use Every "if" condition with its "else" clause as when you scroll on off it reuses the cell that cause it to reappear. So if you not write else condition and if condition become false it will use old cell data.
Always avoid adding subviews to cell in cellForRow. You need to understand that the cells are reused and when you add the subView in cellForRow, the subView is not removed each time. So if the cell appears for 10 times due to scrolling on and off, 10 subViews would be added to the reused cell.
In your case same thing is happening. I would suggest you to add the view in XIB/Prototype cell. Give it a reference and change its backgroundColor property in cellForRow.
Or if you are not using XIB or prototype cell, add subview in init method in your cell class.
var turnsView = UIView()
override init(style: UITableViewCellStyle, reuseIdentifier: String!) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
turnsView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: 100))
self.contentView.addSubview(turnsView)
}
This should work for you:
func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath)
{
let cell = tableView.dequeueReusableCell(withIdentifier: "reuseIdentifier") as! ATableCell;
cell.delegate = self;
//Remove subviews before adding again
if let purpleV = cell.viewWithTag(1) {
purpleV.removeFromSuperview()
}
if let purpleV = cell.viewWithTag(2) {
purpleV.removeFromSuperview()
}
if (indexPath.section == 1)
{
// let height = cell.bounds.size.height;
let height = 100;
let turnsView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: height));
turnsView.tag = 1
turnsView.backgroundColor = UIColor.purple;
cell.addSubview(turnsView);
}
else
{
let height = 100;
let turnsView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: height));
turnsView.tag = 2
turnsView.backgroundColor = UIColor.clear;
cell.addSubview(turnsView);
}
// Configure the cell...
cell.backgroundColor = UIColor.clear;
cell.textLabel?.text = "texting";
cell.detailTextLabel?.text = "testing";
}
Read the documentation for dequeuereusablecell method to clarify.
This will be good to do as:
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "reuseIdentifier", for: indexPath)
// Config the cell...
if let turnsCell as? ATableCell {
turnsCell.turnsColor = (indexPath.section == 1 ? UIColor.purple : UIColor.clear)
}
cell.textLabel?.text = "texting"
cell.detailTextLabel?.text = "testing"
return cell
}
class ATableCell: UITableViewCell {
var turnsView = UIView()
var turnsColor: UIColor {
get {
return self.turnsView.backgroundColor
}
set {
self.turnsView.backgroundColor = newValue
}
}
override func awakeFromNib() {
super.awakeFromNib()
// let height = self.bounds.size.height;
let height = 100;
turnsView.frame = CGRect(x: 0, y: 0, width: 10, height: height)
self.contentView.addSubview(turnsView)
self.backgroundColor = UIColor.clear
}
}
I have question about the accessoryType of cells. I am using a cell with an disclosureIndicator as accessoryType and I want to change it's color but I can't.
Does anyone know if this is a bug or if Apple forces me to use the grey color?
Actually I can change the colors of other accessoryType.
My code looks like this:
let cell = tableView.dequeueReusableCell(withIdentifier: "identifier", for: indexPath) as! customCell
cell.tintColor = UIColor.red
cell.accessoryType = .disclosureIndicator
And my arrow is still grey. But if I use a checkmark accessoryType it becomes red.
Is there any way to fix this or do I have to use a colored image?
You can do something like this
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
cell.tintColor = UIColor.white
let image = UIImage(named: "Arrow.png")
let checkmark = UIImageView(frame:CGRect(x:0, y:0, width:(image?.size.width)!, height:(image?.size.height)!));
checkmark.image = image
cell.accessoryView = checkmark
let object = objects[indexPath.row] as! NSDate
cell.textLabel!.text = object.description
return cell
}
Sample Arrow Images
Output
Use SF Symbol
let image = UIImage(systemName: "chevron.right")
let accessory = UIImageView(frame:CGRect(x:0, y:0, width:(image?.size.width)!, height:(image?.size.height)!))
accessory.image = image
// set the color here
accessory.tintColor = UIColor.white
cell.accessoryView = accessory
Updated for Swift 4.2 with images attached:
cell.accessoryType = .disclosureIndicator
cell.tintColor = .black
let image = UIImage(named:"disclosureArrow")?.withRenderingMode(.alwaysTemplate)
if let width = image?.size.width, let height = image?.size.height {
let disclosureImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: width, height: height))
disclosureImageView.image = image
cell.accessoryView = disclosureImageView
}
Images you can use:
What it could look like:
Bellow Code is Swift 3.0 code, and will change the accessoryType color as per tintColor.
public func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
cell.textLabel?.text = "SOME TITLE GOES HERE"
cell.accessoryType = .disclosureIndicator
cell.tintColor = UIColor.blue
let image = UIImage(named:"arrow1")?.withRenderingMode(.alwaysTemplate)
let checkmark = UIImageView(frame:CGRect(x:0, y:0, width:(image?.size.width)!, height:(image?.size.height)!));
checkmark.image = image
cell.accessoryView = checkmark
return cell
}
Swift 5. Extension style ;)
extension UITableViewCell {
func setupDisclosureIndicator() {
accessoryType = .disclosureIndicator
let imgView = UIImageView(frame: CGRect(x: 0, y: 0, width: 7, height: 12))
imgView.contentMode = .scaleAspectFit
imgView.image = UIImage(named: "your_icon_name")
accessoryView = imgView
}
}
Swift 5 & iOS 15 & Xcode 13
Here is an extension which uses SF Symbols, so you have a chevron like the default disclosure indicator one:
extension UITableViewCell {
func addCustomDisclosureIndicator(with color: UIColor) {
let button = UIButton(frame: CGRect(x: 0, y: 0, width: 10, height: 15))
let symbolConfig = UIImage.SymbolConfiguration(pointSize: 15, weight: .regular, scale: .large)
let symbolImage = UIImage(systemName: "chevron.right",
withConfiguration: symbolConfig)
button.setImage(symbolImage?.withTintColor(color, renderingMode: .alwaysOriginal), for: .normal)
button.tintColor = color
self.accessoryView = button
}
}
You can use it like this:
public func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
cell.addCustomDisclosureIndicator(with: .white) // Here your own color
return cell
}
Swift 5 & iOS 11-15
A combination of some answers
extension UITableViewCell {
func addCustomDisclosureIndicator(with color: UIColor) {
accessoryType = .disclosureIndicator
let disclosureImage = UIImage(named: "arrow_right")?.withRenderingMode(.alwaysTemplate)
let imageWidth = (disclosureImage?.size.width) ?? 7
let imageHeight = (disclosureImage?.size.height) ?? 12
let accessoryImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: imageWidth, height: imageHeight))
accessoryImageView.contentMode = .scaleAspectFit
accessoryImageView.image = disclosureImage
accessoryImageView.tintColor = color
accessoryView = accessoryImageView
}
}
I want to ask how could I have done this feature you can see in this image:
I know the editActionsForRowAt but I think it's not the solution for the things I need to do, so I added UISwipeGestureRecognizer and my code look like this:
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "cellId", for: indexPath) as! ConnectionTableCell
let users = self.users[indexPath.section]
let user = users.userInfo[indexPath.row]
cell.userImage.image = UIImage(named: user.imageUrl)
cell.name.text = user.name
cell.work.text = user.work
cell.selectionStyle = .none
cell.addGestureRecognizer(UISwipeGestureRecognizer(target: self, action: #selector(didSwipeForRow)))
return cell
}
func didSwipeForRow(recognizer: UIGestureRecognizer) {
if recognizer.state == UIGestureRecognizerState.ended {
let swipeLocation = recognizer.location(in: self.tableView)
if let swipedIndexPath = tableView.indexPathForRow(at: swipeLocation) {
let textConstant = tableView.frame.width + 10
let imageConstant = tableView.frame.width - 20
let swipeView = UIView()
swipeView.backgroundColor = UIColor.themeColor(color: .green)
let cell = tableView.cellForRow(at: swipedIndexPath) as! ConnectionTableCell
let height = cell.frame.height
let users = self.users[swipedIndexPath.section]
let user = users.userInfo[swipedIndexPath.row]
cell.addSubview(swipeView)
swipeView.frame = CGRect(x: 0, y: 0, width: imageConstant - 60, height: height)
cell.name.leftAnchor.constraint(equalTo: self.tableView.rightAnchor, constant: textConstant).isActive = true
cell.work.leftAnchor.constraint(equalTo: self.tableView.rightAnchor, constant: textConstant).isActive = true
cell.userImage.rightAnchor.constraint(equalTo: self.tableView.rightAnchor, constant: imageConstant).isActive = true
}
}
}
But the problem is when I swipe a cell its also affecting the reused cell as you can see in this image :
Any suggestions on how to solve this issue? Thanks in advance guys.