简体   繁体   English

Tableview-标题重叠的明细(快速)

[英]Tableview - Title overlapping Detail (Swift)

The image attached says it all. 所附图片说明了一切。 Is there any way to prevent the title from overlapping such as automatically moving to a second line whenever it reaches its limit? 有什么方法可以防止标题重叠,例如,每当标题达到极限时自动移动到第二行? programatically/through interface builder. 以编程方式/通过界面构建​​器。

PS: im retrieving the names from firebase database. PS:我正在从Firebase数据库中检索名称。 this is a voting page and title are the booth names 这是投票页,标题是展位名称

TableView Controller TableView控制器

import UIKit
import FirebaseDatabase

var pitchData = [String]()
var myIndex = 0
class PitchTableViewController: UITableViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        self.navigationController?.setNavigationBarHidden(false, animated: true)

        self.navigationController?.navigationBar.titleTextAttributes = [ NSAttributedStringKey.font: UIFont(name: "Gotham Rounded", size: 19)!]
        ref = Database.database().reference() //set the firebase reference
        // Retrieve the post and listen for changes
        databaseHandle = ref?.child("Afternoon13").queryOrdered(byChild: "BoothPosition").observe(.value, with: { (snapshot) in
            pitchData.removeAll()

            for child in snapshot.children {
                let snap = child as! DataSnapshot
                let key = snap.key


                pitchData.append(key)

            }
            self.tableView.reloadData()
        })
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    // MARK: - Table view data source

    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        // #warning Incomplete implementation, return the number of rows
        return pitchData.count
    }


    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
        cell.textLabel?.font = UIFont(name: "Gotham Rounded", size: 20)
        cell.detailTextLabel?.font = UIFont(name: "Gotham Rounded", size: 20)
        cell.textLabel?.text = pitchData[indexPath.row]

        switch (pitchData[indexPath.row]) {
        case "ARC - attract, retain and cultivate":
            let returnValue: Int = UserDefaults.standard.integer(forKey: "voting")
            if (returnValue == 1)
            {
                cell.detailTextLabel?.text = "Completed ✓"
                cell.detailTextLabel?.textColor = UIColor.green
                cell.isUserInteractionEnabled = false
            }
            else {
                cell.detailTextLabel?.text = "Vote ᐳ"
                cell.detailTextLabel?.textColor = UIColor.blue
            }
        case "Anytime RCs":
            let returnValue: Int = UserDefaults.standard.integer(forKey: "voting1")
            if (returnValue == 1)
            {
                cell.detailTextLabel?.text = "Completed ✓"
                cell.detailTextLabel?.textColor = UIColor.green
                cell.isUserInteractionEnabled = false
            }
            else {
                cell.detailTextLabel?.text = "Vote ᐳ"
                cell.detailTextLabel?.textColor = UIColor.blue
            }

在此处输入图片说明

You need to set lines to 0: 您需要将行设置为0:

在此处输入图片说明

You can set it directly from StoryBoard: 您可以直接从StoryBoard进行设置:

or you can set Programmatically: 或者您可以通过编程方式设置:

cell.textLabel?.numberOfLines = 0
cell.detailTextLabel?.numberOfLines = 0

Hope this Help. 希望这个帮助。

Edit : Demo of the TableView Constraints 编辑:TableView约束的演示

I have taken two labels in the cell next to each other: 我在单元格中相邻放置了两个标签:

This is my Output of TableView: 这是我的TableView输出:

在此处输入图片说明

This is constraint of label First: 这是标签First的约束:

在此处输入图片说明

This is the Constraints of label 2: 这是标签2的约束:

在此处输入图片说明

And yes it worked for me, The text is multi line with no text cutting, please double Check your constraints with this. 是的,它对我有用,文本是多行,没有文本剪切,请仔细检查您的约束。

Edit To see the Constraints 编辑以查看约束

Select the label and then Select the Show the Size Inspector: 选择标签,然后选择“显示尺寸检查器”:

Scroll Down and you can see the given constraints. 向下滚动,您可以看到给定的约束。

在此处输入图片说明

Edit 2 编辑2

As per you description you have Auto resizing: 根据您的描述,您具有自动调整大小:

So you can use the following : 因此,您可以使用以下代码:

For label One 对于标签一

在此处输入图片说明

For label second: 对于第二标签:

在此处输入图片说明

Since you are using default UITableViewCell 's textLabel , this should fix everything : 由于您使用的是默认的UITableViewCelltextLabel ,因此应该可以解决所有问题:

cell.textLabel.numberOfLines = 0;
cell.textLabel.lineBreakMode = .byWordWrapping;  

You set your UILabel property numberOfLines = 0 您设置UILabel属性numberOfLines = 0

在此处输入图片说明

  1. set UILabel Top , bottom , leading , trailing Constraints . 设置UILabel顶部,底部,前导,尾随约束

在此处输入图片说明

  1. add UITableViewDelegate method. 添加UITableViewDelegate方法。

     func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat { return UITableViewAutomaticDimension } 
  2. also set your vote Constraints like this. 还可以这样设置您的投票约束

在此处输入图片说明

  1. select your vote UIButton set Constraints 选择您的投票UIButton设置约束

    1. step set Top , bottom , leading , trailing and fix width. 设置顶部,底部,前导,尾随和固定宽度。

在此处输入图片说明

  1. step set vertically center Constraints 步骤设置垂直居中约束

在此处输入图片说明

Make sure three things:- 确保三件事:

  • Title label has bottom, top and leading constraint with cell content view as well as horizontal spacing with Vote >, and Vote > button has all constraint like top bottom leading and horizontal space with title. 标题标签具有单元格内容视图的底部,顶部和开头约束,以及具有Vote>的水平间距,并且Vote>按钮具有所有约束,例如带有标题的顶部,底部开头和水平空间。
  • Title label has set numberOfLines = 0 标题标签已设置numberOfLines = 0
  • Set dynamic height of cell using UITableViewAutomaticDimension in heightForRowAt 使用heightForRowAt中的UITableViewAutomaticDimension设置单元格的动态高度

     func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat { return UITableViewAutomaticDimension } 

Let try with code 让我们尝试一下代码

// in view did load:
self.tableView.rowHeight = UITableViewAutomaticDimension

// cell row at indexpath
let reuseIdentifier = "cell"
        var cell:UITableViewCell? =
            tableView.dequeueReusableCell(withIdentifier: reuseIdentifier)
        if (cell == nil)
        {
            cell = UITableViewCell(style: .value1,
                                   reuseIdentifier: reuseIdentifier)
        }

        // your customize font, color... here

        cell!.textLabel?.numberOfLines = 0;
        cell!.detailTextLabel?.numberOfLines = 0;

        return cell!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 Swift-使用tableView进行大标题转换 - Swift - Large title transition with tableView swift ios 8 更改表格视图中部分的字体标题 - swift ios 8 change font title of section in a tableview 将tableview行标题传递给ViewController Swift - Pass tableview row title to viewcontroller swift 从TableViewCell获取TableView节标题,快速 - Getting the TableView Section Title from TableViewCell, swift 更改 TableView Swift 中选定行的按钮标题 - Change button title for selected row in TableView Swift 将导航栏标题快速更改为选定的表视图单元格的标题 - Swift Change navigation bar title to the title of the tableview cell that was selected iOS / Swift:将表视图中的对象传递给详细视图控制器 - IOS/Swift: Pass Object in tableview to detail view controller SplitView-根据迅速更改的详细信息在主tableView中重新加载数据 - SplitView - reload data in master tableView based on detail changed in swift Swift-self.tableview.reloaddata()在Master Detail应用程序上不起作用 - Swift - self.tableview.reloaddata() not working on Master Detail Application Swift 4-填充表格视图并将数组/字典数据传递到详细信息视图控制器 - Swift 4 - Populate tableview and pass array/dictionary data to detail view controller
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM