Ios 如何将UILabel与UITableViewCell'中的SF符号和自定义图像对齐；什么是图像视图？

我想实现的是类似文件应用程序中的列表视图。文档将显示一个小缩略图（如果有）。否则，将显示带有textStyle

.callout

的SF符号所有行的标签都应该左对齐。但当前缩略图比SF符号大得多，因此它们会将标签推开

我强调textStyle，因为我的应用程序支持动态类型，这意味着

imageView

的帧计算应该基于SF符号

我尝试覆盖

布局子视图

。但是我不知道怎么计算

文件应用程序

我的应用程序

---

为了最大限度地控制单元格外观，您应该创建一个自定义单元格。但是，如果您想使用标准的

字幕

单元格，可以在设置图像时调整图像大小

此堆栈溢出答案中有一些出色的图像缩放功能：

将该答案的扩展添加到项目中。具体来说，根据您的需要，我们将使用

scaledSpectFit（）

因此，假设您有一个

Subtitle

单元原型，标识符为“cell”，您的

cellForRowAt

将如下所示：

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

    let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
    
    // however you have your data stored
    let title = "IMG_0001.JPG"
    let subtitle = "Today at 10:15 AM, 2.5 MB"
    let imgName = "IMG_0001"
    
    cell.textLabel?.text = title
    cell.detailTextLabel?.text = subtitle
    
    if let img = UIImage(named: imgName) {
        // default cell image size is 56x56 (points)
        //  so we'll proportionally scale the image,
        //  using screen scale to get the best resolution
        let widthHeight = UIScreen.main.scale * 56
        let scaledImg = img.scaledAspectFit(to: CGSize(width: widthHeight, height: widthHeight))
        cell.imageView?.image = scaledImg
    }
    return cell

}

---

编辑

只需要一点研究就可以实现SF符号的使用

将此func添加到表视图控制器-它将返回指定点大小的SF符号的

UIImage

，以指定大小为中心：

private func drawSystemImage(_ sysName: String, at pointSize: CGFloat, centeredIn size: CGSize) -> UIImage? {
    let cfg = UIImage.SymbolConfiguration(pointSize: pointSize)
    guard let img = UIImage(systemName: sysName, withConfiguration: cfg) else { return nil }
    let x = (size.width - img.size.width) * 0.5
    let y = (size.height - img.size.height) * 0.5
    let renderer = UIGraphicsImageRenderer(size: size)
    return renderer.image { context in
        img.draw(in: CGRect(origin: CGPoint(x: x, y: y), size: img.size))
    }
}

然后根据需要更改

cellForRowAt

func：

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    
    let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
    
    // however you have your data stored
    let title = "IMG_0001.JPG"
    let subtitle = "Today at 10:15 AM, 2.5 MB"
    let imgName = "IMG_0001"
    
    cell.textLabel?.text = title
    cell.detailTextLabel?.text = subtitle

    // defalt image view size
    let wh = UIScreen.main.scale * 56
    let targetSize = CGSize(width: wh, height: wh)

    // for this example, if it's the first row, generate an image from SF Symbol
    if indexPath.row == 0 {
        if let img = drawSystemImage("doc.text", at: UIScreen.main.scale * 24, centeredIn: targetSize) {
            cell.imageView?.image = img
        }
    } else {
        if let img = UIImage(named: imgName) {
            // default cell image size is 56x56 (points)
            //  so we'll proportionally scale the image,
            //  using screen scale to get the best resolution
            let scaledImg = img.scaledAspectFit(to: targetSize)
            cell.imageView?.image = scaledImg
        }
    }
    return cell
    
}

---

我将让您根据需要调整点大小（并配置SF符号图像的任何其他属性，如重量、比例、颜色等）。

如果您使用SF符号，您已经需要iOS 13+。您是否在iOS 14的UICollectionView中查看了新功能？IIRC，其中一个“列表”功能将这样的东西对齐。使用苹果开发者应用程序-我想-看看现代手机配置。不太清楚你想要什么。。。在您的“我的应用”图像中，您是否希望这4幅图像与第一行的

doc.text

符号大小相同？@DonMag I应该更清楚。每行的文本应对齐。第一行是所有行的外观示例。@dfd我刚刚看了WWDC 20的一节，看起来很有希望。但我有点不愿意采用，因为这看起来需要做更多的工作。@francisfeng你必须给出固定的宽度和高度，使它们对齐。我知道如何调整图像大小。但这个答案并不涉及SF符号，在我的例子中，将它们与图像对齐是至关重要的。@francisfeng-相当容易做到。。。请参阅我编辑的答案。（通过一点搜索，你可能在我发布编辑的时间内自己做了更改）。