How do I make this UITableView clear (transparent) in Swift 3

19
votes

How do I make this UITableView and it's cells clear in Swift 3.

I have gone through the previous threads but I am still getting a white background.

As you can see from my code I have tried the various methods mentioned:

override func viewDidLoad() {

    self.communitiesTableView.delegate = self
    self.communitiesTableView.dataSource = self

    let background = CAGradientLayer().bespokeColor()
    background.frame = self.view.bounds
  //      view.addSubview(background)
    super.viewDidLoad()

    // Do any additional setup after loading the view.
}

and in my cell table function:

  func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {


    let title = self.communities[indexPath.row]
    let cell = UITableViewCell()


    cell.textLabel?.text = title
    cell.textLabel?.font = UIFont(name: "Avenir", size: 12)
    cell.textLabel?.textColor = UIColor.red
    cell.textLabel?.backgroundColor = UIColor.clear


    cell.contentView.backgroundColor = UIColor.clear
    communitiesTableView.backgroundColor = UIColor.clear
    cell.layer.backgroundColor = UIColor.clear.cgColor

    return cell

}

This gif shows the problem - notice the black lines showing the table is present just not populated (as no-one is logged in)

But for a second it is clear, then turns white. Where am I going wrong?

This is from another post that I have found:

Apple document says

... In iOS 7, cells have a white background by default; in earlier versions of iOS, cells inherit the background color of the enclosing table view. If you want to change the background color of a cell, do so in the tableView:willDisplayCell:forRowAtIndexPath: method of your table view delegate.

You might need to use willDisplayCell UITableView delegate method to have a transparent background for your table view .

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cellforRowAtIndexPath:(NSIndexPath *)indexPath

{
  [cell setBackgroundColor:[UIColor clearColor]];
}

How do I apply the code above as it says its for iOS 7?

13
iosswiftuitableviewswift3
Code looks good. For debug, set cell.textLabel.backgroundColor = UIColor.clear. If the issue persists, there is another view involved. In this case, show how the view and the cell is stacked in storyboard. This: cell.isOpaque = falseis not needed, the views alpha has nothing to do with your issue. – shallowThought
The issue has remained after adding peoples suggestions. I have updated the code to reflect this. The table is contained within a StackView. If I remove the table from this StackView, the problem remains... – RDowns
I have take the Table out of the StackView though and the problem persists. – RDowns
Try once cell.backgroundColor = .clear in cellForRowAt indexPath. ` – Nirav D
It's clear for about a second, and the it goes white – RDowns

13 Answers

53
votes

Note: Below code been tested in Swift 3.

Method 1:

Select your tableViewCell from your storyboard and goto Attributes Inspector under View change Background to clear

Method 2: Try below code inside your cellForRowAt

  cell.layer.backgroundColor = UIColor.clear.cgColor

enter image description here

Note : If above method didn't works.try clear your project build by pressing shift + option + command + k

Update: Update your cellForRowAt from below code...

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

    let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath as IndexPath)
    cell.textLabel?.text = communities[indexPath.row]
    cell.textLabel?.font = UIFont(name: "Avenir", size: 12)
    cell.textLabel?.textColor = UIColor.red // set to any colour 
    cell.layer.backgroundColor = UIColor.clear.cgColor

    return cell
}
14
votes

You can try this

In viewDidLoad: 

tableView.backgroundColor = UIColor.clear

In cellForRowAt: 

cell.contentView.backgroundColor = UIColor.clear

It's work for me.

8
votes

You have to set both table and cell background clear.

Inside tableView function:

tableView.backgroundColor = .clear
cell.backgroundColor = .clear
tableView.tableFooterView = UIView()
7
votes

The two first answer doesn't work for me so I add a clear background everywhere and the white bg go away.

cell.layer.backgroundColor = UIColor.clear.cgColor
cell.backgroundColor = .clear
tableView.layer.backgroundColor = UIColor.clear.cgColor
tableView.backgroundColor = .clear

SWIFT 5.3.3

4
votes

For this to work you have to implement a new tableview method:

func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell,
               forRowAt indexPath: IndexPath) {
    cell.backgroundColor = UIColor.clear
}
2
votes

You are missing setting the background colour of contentView of the cell.

cell.contentView.backgroundColor = UIColor.clear

1
votes

Maybe, you can check your table view's alpha.

1
votes

Setting these wont be enough as you have not applied clear color to the contentView of the tableView and so it is coloring white in it. Try this in cellForRowAtIndexPath

cell.contentView.backgroundColor = UIColor .clearColor()

1
votes

Make sure in the Identity Inspector you have Custom Class -> Class "YourCustomClassCellName" selected in the Drop Down Menu. With your UITableViewCell selected in Interface Builder, make sure your Identifier is "YourCellName" and then in the func tableView(_ tableViewL UITableView, cellForRowAt) method before the return cell that you have cell.backgroundColor = UIColor.clear i.e, 

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    if let cell = tableView.dequeueReusableCell(withIdentifier: "YourCellName", for: indexPath) as? YourCellNameClass {
        cell.configureCell(parameter: ClassDataModel[indexPath.row])
        cell.backgroundColor = UIColor.clear
        return cell
    } else {
        return UITableViewCell()
    }

I had the same issue and wrote all the code before I checked to see make sure my CellClass was selected and face palmed when I spent an hour wondering why it worked on another viewController and not in this instance. Even if you use IB to clear out the default white backgrounds, you still have to write the cell.backgroundColor = UIColor.clear. I was like yep, I found another bug in 8.2.1, but no just an iD10t operator bug.

1
votes

I tested using swift 3. It's working 

uiTableName.backgroundView = nil
uiTableName.backgroundColor = UIColor.clear
1
votes

In the Storyboard for the TableView and TableViewCell, instead of setting the background to "Clear/Default" set the background to white (or any color) with an opacity of 0.

enter image description here

Also make sure you set the ContentView background to clear, but the TableViewCell is what was tripping me up. By doing this you shouldn't need to do anything in the code.

0
votes

In Swift 4, Write the following code under viewDidLoad of your desired class:-

tableView.backgroundColor = UIColor.clear

Write the following code under the cellForRowAt i.e dataSource of your tableView:-

let cell = tableView.dequeueReusableCell(withIdentifier: "CellIdentifierName", for: indexPath) as! UITableViewCell //Cell ClassName
cell.layer.backgroundColor = UIColor.clear.cgColor
return cell
0
votes

Why nobody said about this?:

@IBOutlet weak var tableView: UITableView!
// Drag and drop the tableView from the storyboard

override func viewDidLoad() {
   super.viewDidLoad()      
   tableView.isHidden = true
}

The result gives you an opportunity to hide the whole tableView with a single line.