I have three buttons link, share and favourites in my cell. I have manually set the images in my custom cell class. In the willDisplay method of tableview delegate I want favourites image to update after the user taps on it. The service is working fine on the backend and the object is being added/removed from the favourites but the image is not updating. I have tried setting up the background image instead of image and also deployed various techniques prescribed for Objective-C but nothing seems to workout in my case. Initially I was setting up the image as the same in the DealsFullTableViewCell
This is willdisplay code snippet I'm talking about
if (self.dealArray[indexPath.row].imageUrl.characters.count > 0){
let cell = tableView.dequeueReusableCell(withIdentifier: "DealsFullTableViewCell", for: indexPath) as! DealsFullTableViewCell
if DataBaseReadServices().getFavourtiesforItemId(self.dealArray[indexPath.row].dealId) == nil {
cell.favouritesButton.setImage(UIImage(named: "Favourites Blue Outline 20x20"), for: .selected)
} else {
cell.favouritesButton.setImage(UIImage(named: "Favourite Icon Blue 20x20"), for: .selected)
print ("=============")
}
}
I am initializing the image in the DealsFullTableViewCell as
let favouritesButtonImage = UIImage.fontAwesomeIcon(name: .starEmpty, textColor: Constants.AppColours().primaryColour, size: CGSize(width: 20, height: 20), backgroundColor: UIColor.clear)
self.favouritesButton.setImage(favouritesButtonImage, for: .normal)
Please check with below answer, if it is not working please change the thread.
if(DataBaseReadServices().getFavourtiesforItemId(self.dealArray[indexPath.row].dealId) == nil){
cell.favouritesButton.setImage(UIImage(named: "Favourites Blue Outline 20x20"), for: .selected)
} else {
cell.favouritesButton.setImage(UIImage(named: "Favourite Icon Blue 20x20"), for: .normal)
print ("=============")
}`
Change the thread if above code is not working.
DispatchQueue.main.async {
//your code
}
Thanks
Related
I'm trying to save button image inside button view. Here is briefly what my code looks like:
I have a UITableView with button in it. Whenever I press the button the image changes. I change the image using this code:
First I use:
cell.checkmarkButton.addTarget(self, action:
#selector(subscribeTapped(_:)), for: .touchUpInside)
to recognize when the image is tapped. Then I use:
#objc func subscribeTapped(_ sender: UIButton) {
selectedButton = String(sender.tag)
if let ButtonImage = sender.image(for: .normal),
let Image = UIImage(named: "WhiteCheckMarkButton"),
ButtonImage.pngData() == Image.pngData()
{
sender.setImage( UIImage.init(named: "GreenCheckMarkButton"), for: .normal)
} else {
sender.setImage( UIImage.init(named: "WhiteCheckMarkButton"), for: .normal)
}
Inside my subscribeTapped function to change the image. All good it changes the image but I can't seem to find out how to save once the image has changed. It seems really confusing to me. I can definitely do it if the image is not in a tableView using UserDefaults. But inside a tableView I have no idea what should I do.
I am trying to implement favorite and unfavorite functionality into my cell. Here, Initially I am showing in collection view cell button icon favorite (gray), its mean unfavorite but after clicked the button it will show green, its mean favorite. From JSON I am getting response which cells are already favorite and others unfavorite icon. Its working fine but when I click JSON favorite enabled green button it’s not changing gray by single click, its working fine double click but every click I am calling JSON so 3rd click it will be add again favorite.
Here, below my code -
var checked = false
#IBAction func favoritesTapped(_ sender: Any) {
if checked {
favbutton.setImage(UIImage(named: "item_grayfav.png"), for: .normal)
checked = false
delegate?.unfavoriteButtonPressed(cell: self)
} else {
favbutton.setImage(UIImage(named: "item_greenfav.png"), for: .normal)
checked = true
delegate?.favoriteButtonPressed(cell: self)
}
}
Above code I am using for button click to change image and also initially I fixed gray checked = false
Into collection view cell at item
if indexPath.row < cfavoritesIDData.count {
if let i = cfavoritesIDData[indexPath.item] {
cell.favbutton.setImage(UIImage(named: "item_greenfav.png"), for: .normal)
}
else {
print("id is nil")
cell.favbutton.setImage(UIImage(named: "item_grayfav.png"), for: .normal)
}
}
Issues: If I click JSON enabled green button (favorite), its calling to unfavorite well but button icon not changing green after 3’rd click only its changing gray.
You need to store your cell model in your View Controller, the cell should not have a checked boolean, when you are configuring your cell in cellForRow: you should tell it there wether it is checked or not.
When pressing the button you should have a delegate callback or closure to tell the View Controller that the cell at IndexPath 'x' has pressed its favourite button and check the model as to wether or not the reaction would be checked or not, then reconfigure the cell again.
You can use the UIButton's selected property instead of checked variable:
if indexPath.row < favoritesIDData.count {
if let i = cfavoritesIDData[indexPath.item] {
cell.favbutton.setImage(UIImage(named: "item_greenfav.png"), for: .normal)
cell.favbutton.setSelected = true
}
else {
print("id is nil")
cell.favbutton.setImage(UIImage(named: "item_grayfav.png"), for: .normal)
cell.favbutton.setSelected = false
}
}
#IBAction func favoritesTapped(_ UIButton: favButton) {
if favButton.isSelected {
favbutton.setImage(UIImage(named: "item_grayfav.png"), for: .normal)
checked = false
delegate?.unfavoriteButtonPressed(cell: self)
} else {
favbutton.setImage(UIImage(named: "item_greenfav.png"), for: .normal)
checked = true
delegate?.favoriteButtonPressed(cell: self)
}
}
Note: Don't copy paste change according to correct syntax.
Here is my code in cell for row method:-
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeue(.journalListingCell, for: indexPath) as! JournalListViewCell
cell.delegate = self
//fetching the category model as per the category id
if let category = categories?.first(where: { $0.categoryID == dreamJournalArray[indexPath.row].categoryID }) {
cell.configureCell(dreamJournalArray[indexPath.row], category)
}
return cell
}
This code is just matching a category id from a array of categories to the category id in the main data model and passing along that category to the configure cell model along with the data model.
The configure cell method is as follows:-
typealias Model = DreamJournalModel
func configureCell(_ model: Model, _ category: CategoryModel) {
//setting the gradient colors
verticalView.backgroundColor = category.categoryGradientColor(style: .topToBottom, frame: verticalView.frame, colors: [UIColor.init(hexString: category.initialGradientColor)!, UIColor.init(hexString: category.lastGradientColor)!])
horizontalVIew.backgroundColor = category.categoryGradientColor(style: .leftToRight, frame: self.frame, colors: [ UIColor.init(hexString: category.lastGradientColor)!, UIColor.init(hexString: category.initialGradientColor)!])
timelineCircleView.backgroundColor = category.categoryGradientColor(style: .topToBottom, frame: timelineCircleView.frame, colors: [UIColor.init(hexString: category.initialGradientColor)!, UIColor.init(hexString: category.lastGradientColor)!])
// setting the intention matching image as per the rating
intentionImageView.image = UIImage.init(named: "Match\(model.intentionMatchRating)")
// setting up the date of the journal recorded
let date = Date(unixTimestamp: model.createdAt!)
dateMonthLabel.text = (date.monthName(ofStyle: .threeLetters)).uppercased()
dateNumberLabel.text = String(date.day)
//setting the titles and labels
dreamTitleLabel.text = model.title
dreamTagsLabel.text = model.tags
// setting the lucid icon
gotLucidImageview.isHidden = !(model.isLucid!)
//setting the buttons text or image
if model.recordingPath != nil {
addRecordButton.setTitle(nil, for: .normal)
addRecordButton.backgroundColor = UIColor.clear
addRecordButton.layer.cornerRadius = 0
addRecordButton.setImage(LRAsset.cardRecording.image, for: .normal)
}
else{
addRecordButton.setTitle(" + RECORD ", for: .normal)
addRecordButton.backgroundColor = UIColor.blackColorWithOpacity()
addRecordButton.layer.cornerRadius = addRecordButton.bounds.height/2
addRecordButton.setImage(nil, for: .normal)
}
if model.note != nil {
addNoteButton.setTitle(nil, for: .normal)
addNoteButton.backgroundColor = UIColor.clear
addNoteButton.layer.cornerRadius = 0
addNoteButton.setImage(LRAsset.cardNote.image, for: .normal)
}
else{
addNoteButton.setTitle(" + NOTE ", for: .normal)
addNoteButton.backgroundColor = UIColor.blackColorWithOpacity()
addNoteButton.layer.cornerRadius = addRecordButton.bounds.height/2
addNoteButton.setImage(nil, for: .normal)
}
if model.sketchPath != nil {
addSketchButton.setTitle(nil, for: .normal)
addSketchButton.backgroundColor = UIColor.clear
addSketchButton.layer.cornerRadius = 0
addSketchButton.setImage(LRAsset.CardSketch.image, for: .normal)
}
else{
addSketchButton.setTitle(" + SKETCH ", for: .normal)
addSketchButton.backgroundColor = UIColor.blackColorWithOpacity()
addSketchButton.layer.cornerRadius = addSketchButton.bounds.height/2
addSketchButton.setImage(nil, for: .normal)
}
}
In this method I am setting the gradient colors in the cell as per the category. And then I am setting the button states at the bottom according to the mentioned conditions.
Here's what my tableview looks like:-
The 3 buttons at the bottom of the cell are in a Stackview and their appearance is changing dynamically as per the conditions.
The tableview is not scrolling smooth and the lag is very visible to the naked eye. The height for the cell is fixed at 205.0 and is defined in the height for the row index method.
I don't know where my fetching and feeding the data to the cell logic is mistaken.
Please guide if the scrolling can be improved here.
Thanks in advance.
You are writing too much code inside func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell which should not be there Examples can be setting corner radius, background colors, gradients. These are called each time. You can implement these when the cell is created inside awakeFromNib method.
But this is not that much of a reason your tableview is having scrolling issues. It is because of images that you are adding inside that method. You can use iOS 10 new tableView(_:prefetchRowsAt:) method which will be a better place to load images or preparing data for your cells before being displayed taking things like images there which is called prior to dequeue method.
Here is the link form Apple documentation:
https://developer.apple.com/documentation/uikit/uitableviewdatasourceprefetching/1771764-tableview
The table view calls this method as the user scrolls, providing the index paths for cells it is likely to display in the near future. Your implementation of this method is responsible for starting any expensive data loading processes. The data loading must be performed asynchronously, and the results made available to the tableView(_:cellForRowAt:) method on the table view’s data source.The collection view does not call this method for cells it requires immediately, so your code must not rely on this method to load data. The order of the index paths provided represents the priority.
https://developer.apple.com/documentation/uikit/uitableviewdatasourceprefetching
I have two buttons within each TableView cell. When one button is tapped I want to change its appearance AND the appearance of the other button. I figured out how to change the tapped button using the approach outlined here, but am struggling with adjusting the other button.
Current relevant code:
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell:FeedbackTableViewCell = self.feedbackTableView.dequeueReusableCell(withIdentifier: "cell") as! FeedbackTableViewCell
// Setup YES / NO Buttons
cell.feedbackYesButton.addTarget(self, action: #selector(MainSearchViewController.feedbackYesButtonTapped(sender:)), for: .touchUpInside)
cell.feedbackNoButton.addTarget(self, action: #selector(MainSearchViewController.feedbackNoButtonTapped(sender:)), for: .touchUpInside)
cell.feedbackYesButton.tag = indexPath.row
cell.feedbackNoButton.tag = indexPath.row
return cell
}
func feedbackYesButtonTapped (sender:UIButton) {
let yesButtonTag = sender.tag
switch yesButtonTag {
case 0:
// If YES button was not selected or was NO, then save value as YES and turn button "on", plus turn NO button "off".
turnFeedbackButtonOn(sender)
turnFeedbackButtonOff(NOT SURE HOW TO HANDLE THIS?)
}
// Other cases handled accordingly.
default:
return
}
}
//MARK: - Functions to change the appearances of feedback buttons
func turnFeedbackButtonOn(_ button: UIButton) {
button.setTitleColor(UIColor(red: 157/255, green: 249/255, blue: 88/255, alpha: 1 ), for: UIControlState())
button.titleLabel?.font = UIFont(name: "Avenir-Black", size: 18)
}
func turnFeedbackButtonOff(_ button: UIButton) {
button.setTitleColor(UIColor.black, for: UIControlState())
button.titleLabel?.font = UIFont(name: "Avenir", size: 17)
}
I tried passing the other button through with the target buttons, but I get an error when trying this. It feels like this should work, but I'm no expert at Swift so would appreciate any help!
cell.feedbackYesButton.addTarget(self, action: #selector(MainSearchViewController.feedbackYesButtonTapped(cell.feedbackYesButton, otherButton:cell.feedbackNoButton)), for: .touchUpInside)
func feedbackYesButtonTapped (sender:UIButton, otherButton:UIButton) {
//...
}
It would be a little easier if you handled the button events within the UITableViewCell's class instead, since you'd be able to easily reference the two buttons within there, but it's still possible to do what you want the way you're doing it:
First you'll want to get a reference to the cell after the button is pushed. It looks like you're setting the cell's row to be the button's tag, so I assume you've only got 1 section in that tableView. In that case you can get a reference to the cell by saying let cell = tableView.cellForRowAtIndexPath(NSIndexPath(forRow: button.tag, inSection: 0)). This return an optional, for obvious reasons, so you'll want to make sure to unwrap it safely. Then you can say turnFeedbackButtonOff(cell.feedbackNoButton) in the spot you were not sure how to handle it.
My tableview displays podcast data. All cells are reused fine and display podcasts in the right order. I add download and play buttons as subviews of each cell. When I scroll down the list, the play button which is meant to be hidden for non-downloaded episodes will be shown and will hold the data of the cell which previously initiated a download. For example if I tap download button in cell 1, it will download the right episode and the play button will play the episode perfectly. If I scroll down to cell 10, the same play button will appear and will play episode from button 1. What's wrong with my code?
override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath, object: PFObject?) -> PFTableViewCell? {
let cell: PFTableViewCell = tableView.dequeueReusableCellWithIdentifier("Cell", forIndexPath: indexPath) as! PFTableViewCell
if let title = object?["title"] as? String {
cell.textLabel?.text = title
let downloadButton = UIButton(type: UIButtonType.Custom)
downloadButton.frame = CGRectMake(cell.contentView.bounds.width - 100, cell.contentView.bounds.height / 2, 100, 35)
downloadButton.setTitle("Download", forState: .Normal)
downloadButton.setTitleColor(UIColor.blueColor(), forState: .Normal)
downloadButton.tag = indexPath.row
downloadButton.addTarget(self, action: "downloadEpisode:", forControlEvents: .TouchUpInside)
cell.addSubview(downloadButton)
let playButton = UIButton(type: UIButtonType.Custom)
playButton.frame = CGRectMake(cell.contentView.bounds.width - 100, cell.contentView.bounds.height - 89, 100, 35)
playButton.setTitle("Play", forState: .Normal)
playButton.setTitleColor(UIColor.blueColor(), forState: .Normal)
playButton.tag = indexPath.row
playButton.addTarget(self, action: "playEpisode:", forControlEvents: .TouchUpInside)
if let isDownloaded = object?["isDownloaded"] as? String {
if isDownloaded == "yes" {
playButton.hidden = false
} else {
playButton.hidden = true
}
}
cell.addSubview(playButton)
}
return cell
}
Edit:
I've also tried this but it doesn't work and still creates 1 more button per cell:
override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath, object: PFObject?) -> PFTableViewCell? {
let cell: PFTableViewCell = tableView.dequeueReusableCellWithIdentifier("Cell", forIndexPath: indexPath) as! PFTableViewCell
if let title = object?["title"] as? String {
cell.textLabel?.text = title
}
if let button = cell.viewWithTag(indexPath.row) {
print(button)
} else {
if let isDownloaded = object?["isDownloaded"] as? String {
if isDownloaded == "yes" {
let downloadButton = UIButton(type: UIButtonType.Custom)
downloadButton.frame = CGRectMake(cell.contentView.bounds.width - 100, cell.contentView.bounds.height / 2, 100, 35)
downloadButton.setTitle("Play", forState: .Normal)
downloadButton.setTitleColor(UIColor.blueColor(), forState: .Normal)
downloadButton.tag = indexPath.row
downloadButton.addTarget(self, action: "playEpisode:", forControlEvents: .TouchUpInside)
cell.addSubview(downloadButton)
} else {
let downloadButton = UIButton(type: UIButtonType.Custom)
downloadButton.frame = CGRectMake(cell.contentView.bounds.width - 100, cell.contentView.bounds.height / 2, 100, 35)
downloadButton.setTitle("Download", forState: .Normal)
downloadButton.setTitleColor(UIColor.blueColor(), forState: .Normal)
downloadButton.tag = indexPath.row
downloadButton.addTarget(self, action: "downloadEpisode:", forControlEvents: .TouchUpInside)
cell.addSubview(downloadButton)
}
}
}
return cell
}
Edit2:
Added download method:
func downloadEpisode(sender: UIButton) {
print("Downloading..")
let indexPath = NSIndexPath(forRow: sender.tag, inSection: 0)
let object = self.objectAtIndexPath(indexPath)
if let result = object {
let urlstring = result["downloadURL"] as? String
if urlstring != nil {
let episodeURL = NSURL(string: urlstring!)
downloader.downloadPodcastEpisode(episodeURL!, podcast: result)
}
}
}
Answer:
Although all answers were right, I have decided to remove the button download/play on cell taps in the end. Many thanks!
The problem is that you're adding a new button every time. When your cell is reused, it will already have a button. You need to write code that guarantees a button will only be created once, and after that, modify the existing button instead of creating a new one.
There are two common approaches to this:
Use viewWithTag to check if a button exists (create a button and set its tag if it doesn't)
Subclass UITableViewCell, create the button in the initializer, and configure the button each time the cell is used.
Searching for "uitableviewcell viewwithtag" or "subclass uitableviewcell" should give you plenty of sample code, so I won't rehash that here.
This happens because placement of a button in a cell in your code is a one-way street: once a button is added to the cell, it is never removed or made invisible.
You need to add an else to your if statement to remove the button from the recycled cell, if that button exists.
Better yet, make the button a permanent part of the "Cell", and control its visibility in the same if statement: instead of adding the button, make it visible; instead of removing the button, make it invisible. As an added bonus, this would let you set up the visual appearance for your button in interface builder, and set some constraints, which would help avoiding "magic numbers" such as 100, 89, and 35 in the body of your code.
Looking at your code its clear you are already subclassing UITableViewCell and have custom UI, then its recommended add button in side UITableViewCell either in initialization or if you have xib for cell then add UIButton in xib (via interface builder) and create an IBOutlet for newly added button .
Now when a cell will be reused you will have that button as well, when cell is being reused its your responsibility to keep its state right (means updating its UI), for that override prepareForReuse method inside custom tableViewCell class and reset UI of cell, and in cellForRowAtIndexPath you can update UI as per new data object.