如何根据文本长度或背景图像调整按钮宽度

Posted

技术标签:

【中文标题】如何根据文本长度或背景图像调整按钮宽度【英文标题】:How to adjust button width according to textlength or backgroud image 【发布时间】:2017-08-16 11:47:10 【问题描述】:

我有一个表格视图和一个带有按钮的自定义单元格。根据我的需要,我有时会设置

1.按钮标题

2.不带标题的背景图片

在运行时。问题是我的按钮大小特别是宽度不会根据标题的文本长度或背景图像大小而改变。我尝试过 sizeToFitcell.btnChat.sizeThatFits( backgroundimage.size) 但它不反映任何变化。

“按钮”条件是设置标题和图片设置背景图片。

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


            if blockChatForLogin
                if (chatRespones[indexPath.row].type == "text")
                    //Adding rows in table
//                    let cell:ChatResponseController = self.tbChat.dequeueReusableCell(withIdentifier: "ChatResponseCell") as! ChatResponseController
                    let cell:CustLabelCell = self.tbChat.dequeueReusableCell(withIdentifier: "CustomLabelCell") as! CustLabelCell
                    cell.lblTextResponse.text = chatRespones[indexPath.row].value
                    cell.lblTextResponse.layer.masksToBounds=true
                    cell.lblTextResponse.layer.cornerRadius=5
                    return cell
                
                else if (chatRespones[indexPath.row].type == "button")
                    //Adding rows in table
                    let cell:CustButtonCell = self.tbChat.dequeueReusableCell(withIdentifier: "CustomButtonCell") as! CustButtonCell
                    cell.btnChat.setTitle(chatRespones[indexPath.row].value,for: .normal)
                    cell.btnChat.layer.masksToBounds=true
                    cell.btnChat.layer.cornerRadius=5
                    cell.btnChat.layer.borderWidth=2
                    cell.btnChat.layer.borderColor=UIColor(red:0.18, green:0.61, blue:0.49 ,alpha:1.0).cgColor
                    cell.delegete = self
                    return cell
                
                else if (chatRespones[indexPath.row].type == "image")
                    //Adding rows in table
//                    let cell:ChatButtonController = self.tbChat.dequeueReusableCell(withIdentifier: "ChatButtonCell") as! ChatButtonController
                    let cell:CustButtonCell = self.tbChat.dequeueReusableCell(withIdentifier: "CustomButtonCell") as! CustButtonCell

                    if   let image: UIImage = UIImage(named:"\(chatRespones[indexPath.row].value.replacingOccurrences(of: ":", with: "")).jpg")
                    
                        cell.btnChat.setImage(image, for: .normal)
                        cell.btnChat.setTitle("",for: .normal)
                        cell.btnChat.backgroundColor = UIColor.clear


                    
                    else
                        cell.btnChat.backgroundColor = UIColor.clear
                        cell.btnChat.setTitleColor(UIColor.red, for: .normal)
                        cell.btnChat.setTitle("Error: Image Missing with name \(chatRespones[indexPath.row].value)",for: .normal)
                    
                    cell.btnChat.layer.masksToBounds=true
                    cell.btnChat.layer.cornerRadius=5
                    cell.btnChat.layer.borderWidth=2
                    cell.btnChat.layer.borderColor=UIColor(red:0.18, green:0.61, blue:0.49 ,alpha:1.0).cgColor
                    cell.delegete = self
                    return cell
                
            
        default:
            print("No case")
        

    

【问题讨论】:

显示你的代码,你根据文本长度设置宽度 storyBoard中的按钮不给定宽度,它会根据文本自行调整。 在标题的情况下,您应该首先计算标签中的字符或文本,在 uiimageview 的情况下获取图像的高度和宽度,然后根据您的文本和图像视图动态设置按钮视图的高度和宽度。 我尝试删除恒定宽度,现在调整按钮大小,但内容太接近了。 约束有问题。您必须以按钮灵活的方式设置它们。分享带有约束条件的单元格屏幕截图,以便我们为您提供帮助 【参考方案1】:

设置单元格的文本后,您可以这样做:

cell.textLabel.intrinsicContentWidth

要获得所需的文本宽度,您可以使用检索到的大小作为宽度创建视图的框架。如果您在情节提要或其他内容中设置了任何固定宽度,请小心,因此最好也以编程方式创建您的 textLabel。

【讨论】:

以上是关于如何根据文本长度或背景图像调整按钮宽度的主要内容,如果未能解决你的问题,请参考以下文章

如何根据需要调整背景图像的大小

具有右对齐背景图像的文本字段 - 自动扩展

如何根据屏幕大小调整按钮的图像和文本大小(自动布局)

Kivy 按钮背景图像大小

在静态背景图像上调整按钮大小和位置

如何根据contentHeight不断更新图像?