Monday, September 3, 2018

UITableview cell cut off some messages(views)

Leave a Comment

I have messages screen and implement custom tableviewcell for the display message. A message should be text or image and some case I need to display boxes with information(see image sender and receiver). it's working fine but some time messages view cut off(see image messages). I have used many stackViews to hiding and show some views.

Please find the code here for more understanding.

sender
receiver
enter image description here

2 Answers

Answers 1

The possible cause for such a behaviour is setting up the layers of the view in cell, I can see in your cell, you are adding the corner radius to the background. I could be able to fix it in my app by using the following approach.

  1. Define a optional data varibale in your cell.

    var currentData: MessageModel? 
  2. set that value in the method you are calling to provide the data to cell.

    func loadData(_ data:MessageModel) -> Void { currentData = data  // YOUR EXISTING CODE GOES HERE.  // Move your code to the function which do the setup of corner radius.  // Call this method. setupCornerRadius() }    
  3. Add the following methods to your cells

    open override func layoutIfNeeded() { super.layoutIfNeeded() setupCornerRadius() }  open override func layoutSubviews() { super.layoutSubviews() setupCornerRadius() }  func setupCornerRadius() { if let data = currentData {     let strMsg = data.body ?? ""     lblMsgBody.text = strMsg      if strMsg != "" {         viewBG.backgroundColor = UIColor.primaryGreen         if strMsg.count > 5 {             viewBG.layer.cornerRadius = 18.0         }else{             viewBG.layer.cornerRadius = 12.0         }     }     else{         viewBG.backgroundColor = UIColor.clear     }   } } 

Try the above approach.

Along with that what I did was, I removed the stackView from the cell and managed to implement the required UI by setting up the constraints.

Label with numberOfLines = 0 and setting Leading, Trailing, Bottom and Top constraints. with value = 8 (You can set it as per your margin and spacing you needs.)

Try and share the results.

Answers 2

Use UI debugger and see what exactly is going on.

If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment