ios swift 3 delete contents of each cell when reloading tableView - ios

I am creating a quizApp using DLRadioButton with a label in each cell of tableView, the label is set from the storyBoard(with a tag) but I have set radioButtons programmatically for better design when I click next button to pass to next question new Radiobutton overlaps with the old Radiobutton
here is the first question
here is the second image
Below is my code
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell : UITableViewCell = tableView.dequeueReusableCell(withIdentifier: "cell")!
var reponse = rep[(indexPath as NSIndexPath).row]
let content:UILabel=cell.viewWithTag(111) as! UILabel
//var ra:UIButton=cell.viewWithTag(112) as! UIButton
content.text=reponse["rep"] as? String
content.sizeToFit()
let repiii = reponse["rep"] as? String
// var radio = DLRadioButton()
if (self.type=="case à cocher"){
// cell.contentView.delete(radioButtons)
let frame = CGRect(x: 50, y: 20, width: 200, height: 40)
let squareButton = self.createRadioButton(frame: frame, title:repiii!, color: UIColor.red,compt: squareButtons.count,sqaure:1);
squareButtons.append(squareButton)
cell.contentView.addSubview(squareButton)
}
else{
let frame = CGRect(x: 50, y: 20, width: 200, height: 40)
let radioButton = self.createRadioButton(frame: frame, title:repiii!, color: UIColor.blue,compt: radioButtons.count,sqaure:0);
//radioButton.isMultipleSelectionEnabled = true
print(radioButtons.count)
radioButtons.append(radioButton)
cell.contentView.addSubview(radioButton)
}
return cell
}
any suggestion is appreciated

in your code, just after the line
let cell : UITableViewCell = tableView.dequeueReusableCell(withIdentifier: "cell")!
add this:
for subview in cell.contentView.subviews {
subview.removeFromSuperView()
}

Related

Corner radius not properly fit in dynamic grouped tableView swift

I have created a Grouped TableView dynamically based on data. Based on data tableView cell generated automatic height so every cell has different rowHeight. I have set it accordingly by using self.tableView.rowHeight = 50
But Issue is I am using corner radius, but I don't want to use corner radius on every cell.
I am using grayBox UIView and all cells displayed in it. Corner radius apply to start of cell or grayBox and only at end of cell of grayBox but it applied to every cell. How can I do that corner radıus apply on start and bottom?
viewDidLoad() code for tableView Row Height
self.tableView.rowHeight = 50
Dynamic Grouped TableView code:
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = UITableViewCell()
cell.backgroundColor = UIColor.clear
cell.selectionStyle = .none
let grayBox = UIView(frame: CGRect(x: 5, y: 0, width: self.view.frame.size.width - 11, height: 50))
grayBox.backgroundColor = ("#cfd8dc").toColor()
grayBox.layer.cornerRadius = 5
grayBox.layer.borderColor = UIColor(red:0.80, green:0.80, blue:0.80, alpha:1.0).cgColor
grayBox.layer.borderWidth = 1.0
cell.contentView.addSubview(grayBox)
return cell
}
1- Use dequeue
let cell = tableView.dequeueReusableCell(withIdentifier: "cell")!
Instead of
let cell = UITableViewCell()
2- Clear subviews here by removing with tag
let grayBox = UIView(frame: CGRect(x: 5, y: 0, width: self.view.frame.size.width - 11, height: 50))
grayBox.tag = 333
cell.contentView.subviews.forEach {
if $0.tag == 333 {
$0.removeFromSuperview()
}
}
cell.contentView.addSubview(grayBox)
3- For corner raduis
if indexPath.row == 0 || indexPath.row == arr.count - 1 {
grayBox.layer.cornerRadius = 5
}
else {
grayBox.layer.cornerRadius = 0
}

Resizing icon using imageView

I've got the following code (updated):
// Set cell row height
override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat
{
return UITableViewAutomaticDimension // Auto-size cell based on content
}
// Set cell content
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
// Configure the cell...
let weatherObject = forecastData[indexPath.section]
// Convert UNIX time into readable format
let sunriseUNIX = weatherObject.sunriseTime
let sunriseDate = Date(timeIntervalSince1970: Double(sunriseUNIX))
let sunsetUNIX = weatherObject.sunsetTime
let sunsetDate = Date(timeIntervalSince1970: Double(sunsetUNIX))
let dateFormatter = DateFormatter()
dateFormatter.dateFormat = "h:mm a"
let sunriseConv = dateFormatter.string(from: sunriseDate)
let sunsetConv = dateFormatter.string(from: sunsetDate)
cell.textLabel?.text = weatherObject.summary
cell.detailTextLabel?.text = "Max: \(Int(round(weatherObject.temperatureMax))) °F / Min: \(Int(round(weatherObject.temperatureMin))) °F \nWill feel like \(Int(round(weatherObject.apparentTemperatureMax))) °F \nSunrise: \(sunriseConv) Sunset: \(sunsetConv) \nRelative Humidity: \(Int((weatherObject.humidity)*100))% \nMoon Phase: \(round(weatherObject.moonPhase))"
cell.detailTextLabel!.numberOfLines = 0
cell.imageView?.image = UIImage(named: weatherObject.icon)
cell.imageView?.frame = CGRect(x: 0, y: 0, width: 10, height: 10)
cell.imageView?.contentMode = .scaleAspectFit
cell.imageView?.clipsToBounds = true // clipping will help check actual frame of image
cell.layoutIfNeeded()
cell.setNeedsDisplay() // try to reset display, if not updating your image scale automatically
return cell
}
...(Still) yielding the following result:
I'm trying to get the 'icon' images sized 10 x 10 pixels, yet the above code doesn't work. Regardless of the values in CGRect, the 'icons' remain the same size.
Any pointers, alternatives would be appreciated!!
Thanks in advance.
You can use code as shown under:
var newImgThumb : UIImageView
newImgThumb = UIImageView(frame:CGRectMake(0, 0, 100, 70))
newImgThumb.contentMode = .ScaleAspectFit
Hope u got it!!!
You should set up the content mode of the images properly in order to scale them to the correct size.
cell.imageView.contentMode = .scaleAspectFit
Set content mode of cell image view as scaleAspectFit
cell.imageView?.image = UIImage(named: weatherObject.icon)
cell.imageView?.frame = CGRect(x: 0, y: 0, width: 50, height: 50)
cell.imageView?.contentMode = .scaleAspectFit
cell.imageView?.clipsToBounds = true // clipping will help check actual frame of image
cell.layoutIfNeeded()
//cell.setNeedsDisplay() // try to reset display, if not updating your image scale automatically
A good advice for you, Use Custom tableview cell and set all elements according to your choice/requirement.
Here is reference tutorial for Custom Tableview cell. Let me know, if you face any problem with Custom Tableview Cell.
Custom tableview cell, gives flexibility to arrange all cell elements according to your need.

UICollectionView Data not displaying correctly

func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
let cell: MaterialCollectionViewCell = collectionView.dequeueReusableCellWithReuseIdentifier(reuseIdentifier, forIndexPath: indexPath) as! MaterialCollectionViewCell
let item = items()[indexPath.item]
//print(cell.contentView.subviews)
for view in cell.contentView.subviews{
view.removeFromSuperview()
}
//print(cell.contentView.subviews)
let colors = [UIColor.grayColor(), UIColor.darkGrayColor()]
cell.backgroundColor = colors[indexPath.item % 2]
let showTitle: UILabel = UILabel(frame: CGRect(x: 0, y: 0, width: cell.frame.width, height: cell.frame.height))
showTitle.text = item.title
showTitle.textAlignment = .Center
showTitle.font = UIFont(name: "HelveticaNeue", size: 25.0)
showTitle.textColor = MaterialColor.white
showTitle.center = cell.center
showTitle.hidden = true
//print(showTitle.text)
cell.contentView.addSubview(showTitle)
let imageView: UIImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: cell.frame.width, height: cell.frame.height))
imageView.kf_setImageWithURL(NSURL(string: item.banner)!,
placeholderImage: nil,
optionsInfo: nil,
progressBlock: { (receivedSize, totalSize) -> () in
//print("Download Progress: \(receivedSize)/\(totalSize)")
},
completionHandler: { (image, error, cacheType, imageURL) -> () in
//print("Downloaded and set!")
if (image != nil) {
showTitle.removeFromSuperview()
}
else {
showTitle.hidden = false
}
}
)
cell.contentView.addSubview(imageView)
//print(cell.contentView.subviews)
return cell
}
this is the code I am using to display data into show title label. For the moment imageView doesn't ever show
issue with mine is the complete data is not displayed instead a part of it
current output
Should have shown these in the same order
Game of Thrones
Orange Is the New Black
Marco Polo (2014)
Person of Interest
Dark Matter
I think the problem is that the UILabel view and the UIImageView are overlapped 。 You should shrink the size of UILabel, and put the UIImageView behind the UILabel.

How to design custom collection view programatically?

In my project I want to design custom View Cell programatically with SVGKImageView & UILabel like this
here square is an SVGKImageView & "Dadar" is an UILabel.
But now I am getting output like this
This is my code
func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell
{
// intialize collection cell with media collection cell
let cell = collectionView.dequeueReusableCellWithReuseIdentifier("mediaCell", forIndexPath: indexPath) as! ViewContentMediaCollectionCell
// get the data from view model
let viewModelobj = mViewContentViewModelObj!.getViewContentData()
// set the page imageview frame with default size
var mSVGImageView = SVGKFastImageView(frame: CGRect(x: 0, y: 0, width: cell.frame.width, height: (50)))
// set the pageImageview with actual pageImage
mSVGImageView = SVGKFastImageView(SVGKImage: viewModelobj[indexPath.row].mContentPage)
// add page imageview in the cell
cell.contentView.addSubview(mSVGImageView)
// add the title label
let titleLabel : UILabel = UILabel(frame: CGRect(x: 0, y: cell.frame.height - 20, width: cell.frame.width, height: 20))
// set the page title
titleLabel.text = viewModelobj[indexPath.row].mPageTitle
// add title label to the collection view cell
cell.contentView.addSubview(titleLabel)
// return the cell
return cell
}
You should create a custom view that contains an ImageView and a label like your design then add to the contentView

Image and scrollView rendering making my tableview choppy

There may be no good solution for my problem, but I want to ask just in case.
I have a tableview in which each cell contains a horizontal scrollview of variable width. The width of each cell's scrollview depends on the number and sizes of the images for that cell. Everything works pretty well, but the tableview scrolls less smoothly than it could. I'm using Parse to retrieve the images (and pfquertableviewcontroller), but this question should apply to tableviews in general.
Here is my tableview code:
override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath, object: PFObject?) -> PFTableViewCell? {
if var cell:MainFeedTableViewCell? = tableView.dequeueReusableCellWithIdentifier(self.cellIdentifier) as? MainFeedTableViewCell{
if(cell == nil) {
cell = NSBundle.mainBundle().loadNibNamed("MainFeedTableViewCell", owner: self, options: nil)[0] as? MainFeedTableViewCell
}
cell?.parseObject = object
return cell
}
}
override func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {
if let c = (cell as? MainFeedTableViewCell){
c.setUpObject()//this is where images are set
}
}
override func tableView(tableView: UITableView, didEndDisplayingCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {
if let c = (cell as? MainFeedTableViewCell){
c.resetObject() //this sets most of the properties to nil
}
}
And here is the function in my cell where images are set
func setUpObject(){
//I left out several lines of code where label text is set from the parseObject that is set when the cell is created
//setting images **problems here**
if let numImages = self.parseObject?["numImages"] as? Int{
self.newWidth1 = self.parseObject?["width1"] as? CGFloat
self.newWidth2 = self.parseObject?["width2"] as? CGFloat
self.newWidth3 = self.parseObject?["width3"] as? CGFloat
self.newWidth4 = self.parseObject?["width4"] as? CGFloat
self.newWidth5 = self.parseObject?["width5"] as? CGFloat
if numImages == 1{
self.containerView = UIView(frame: CGRect(x: self.scrollView.frame.minX, y: self.scrollView.bounds.minY - 90, width: self.scrollView.frame.width, height: self.scrollView.frame.height))
self.image1 = PFImageView(frame: CGRect(x: self.scrollView.frame.minX , y: self.scrollView.frame.minY, width: self.scrollView.frame.width, height: self.scrollView.frame.height))
self.image1?.contentMode = UIViewContentMode.ScaleAspectFit
self.image1!.file = self.parseObject?["image"] as? PFFile
self.image1!.loadInBackground()
self.containerView!.addSubview(self.image1!)
self.scrollView.contentSize = self.containerView!.bounds.size
self.scrollView.addSubview(self.containerView!)
}
else if numImages == 2{
if self.newWidth1 + self.newWidth2 < self.scrollView.frame.width{
self.containerView = UIView(frame: CGRect(x: self.scrollView.frame.midX - (self.newWidth1 + self.newWidth2)/2, y: self.scrollView.bounds.minY - 90, width: (self.newWidth1 + self.newWidth2), height: self.scrollView.frame.height))
}
else{
self.containerView = UIView(frame: CGRect(x: self.scrollView.frame.minX, y: self.scrollView.bounds.minY - 90, width: (self.newWidth1 + self.newWidth2), height: self.scrollView.frame.height))
}
self.image1 = PFImageView(frame: CGRect(x: self.scrollView.frame.minX , y: self.scrollView.frame.minY, width: self.newWidth1, height: self.scrollView.frame.height))
self.image1!.file = self.parseObject?["image"] as? PFFile
self.image1!.loadInBackground()
self.containerView!.addSubview(self.image1!)
self.image2 = PFImageView(frame: CGRect(x: (self.scrollView.frame.minX + self.newWidth1), y: self.scrollView.frame.minY, width: self.newWidth2, height: self.scrollView.frame.height))
self.image2!.file = self.parseObject?["image2"] as? PFFile
self.image2!.loadInBackground()
self.containerView!.addSubview(self.image2!)
self.subLayer = CALayer()
self.subLayer.backgroundColor = UIColor.whiteColor().CGColor
self.subLayer.frame = CGRect(x: self.newWidth1, y: self.scrollView.frame.minY, width: 1, height: self.scrollView.frame.height)
self.containerView!.layer.addSublayer(self.subLayer)
self.scrollView.contentSize = self.containerView!.bounds.size
self.scrollView.addSubview(self.containerView!)
}
//repeat similar code for cases where there are 3, 4, or 5 images
There might be a fundamental issue with dynamically adjusting the size of the scrollview and adding it to superview just in time, but I'm trying to follow the design mockup that my designer gave me.
Here is what the scrollview on the cell looks like (with each image in the scrollview separated by a thin white line)
Remove your willDisplayCell and didEndDisplayingCell. That will fire as you scroll and your setUpObject code, while not huge, will block the main thread slightly. Instead move setUpObject() to right before returning the cell in cellForRowAtIndexPath.
Depending on how many rows you have and performance requirements you could also adjust the viewController to download all of the images ahead of time and pass them to the cell instead of loading them inside the cell.

Resources