iOS中如何生成含展开单元格的自定义视图图片并分享

我之前也碰到过类似的需求，要把带展开/折叠单元格的TableView连同顶部Logo一起生成完整图片分享，下面是我验证过的实现方案，分步骤来：

1. 确保所有单元格处于展开状态 #

首先得让你的TableView所有单元格都展开，不然截图会是部分折叠的状态。你需要先更新数据源里的展开标记（比如把isExpanded字段全部设为true），然后刷新TableView，并且等待布局完成：

// 更新数据源，设置所有单元格为展开状态
yourDataSource.forEach { $0.isExpanded = true }
// 刷新TableView
tableView.reloadData()
// 强制完成布局，避免后续计算高度出错
tableView.layoutIfNeeded()

2. 计算整体内容的总尺寸 #

我们需要计算Logo高度 + TableView所有内容的高度（包括section头/尾、所有行），宽度可以用TableView的宽度或者屏幕宽度：

// 假设你的Logo视图是logoHeaderView
let logoHeight = logoHeaderView.frame.height
// TableView的总内容高度（已经包含所有行、section头/尾的高度）
let tableViewContentHeight = tableView.contentSize.height
// 整体图片尺寸
let totalSize = CGSize(width: tableView.bounds.width, height: logoHeight + tableViewContentHeight)

3. 创建图形上下文并绘制内容 #

这里推荐手动遍历所有元素绘制，避免drawHierarchy漏掉未加载的单元格。步骤如下：

// 开启图形上下文，scale用屏幕当前缩放系数，保证图片清晰
UIGraphicsBeginImageContextWithOptions(totalSize, true, UIScreen.main.scale)
guard let context = UIGraphicsGetCurrentContext() else {
    UIGraphicsEndImageContext()
    return
}

// 1. 绘制顶部Logo
logoHeaderView.frame = CGRect(x: 0, y: 0, width: totalSize.width, height: logoHeight)
logoHeaderView.drawHierarchy(in: logoHeaderView.bounds, afterScreenUpdates: true)

// 2. 绘制TableView的所有内容（section头、行、section尾）
var currentY = logoHeight

// 遍历所有section
for section in 0..<tableView.numberOfSections {
    // 绘制section header（如果有的话）
    if let headerView = tableView.headerView(forSection: section) {
        let headerFrame = CGRect(x: 0, y: currentY, width: totalSize.width, height: headerView.frame.height)
        headerView.drawHierarchy(in: headerFrame, afterScreenUpdates: true)
        currentY += headerView.frame.height
    }
    
    // 遍历当前section的所有行
    for row in 0..<tableView.numberOfRows(inSection: section) {
        let indexPath = IndexPath(row: row, section: section)
        // 获取或加载对应的单元格
        var cell = tableView.cellForRow(at: indexPath)
        if cell == nil {
            // 如果单元格未加载，先让TableView加载它
            tableView.scrollToRow(at: indexPath, at: .top, animated: false)
            cell = tableView.cellForRow(at: indexPath)
            // 如果还是nil，用dequeue并手动配置（确保数据源已更新为展开状态）
            if cell == nil {
                cell = tableView.dequeueReusableCell(withIdentifier: "YourCellIdentifier", for: indexPath)
                // 这里调用你的单元格配置方法，比如：
                configureCell(cell!, for: indexPath)
            }
        }
        // 计算单元格的frame
        let cellHeight = tableView.rectForRow(at: indexPath).height
        let cellFrame = CGRect(x: 0, y: currentY, width: totalSize.width, height: cellHeight)
        // 绘制单元格
        cell?.drawHierarchy(in: cellFrame, afterScreenUpdates: true)
        currentY += cellHeight
    }
    
    // 绘制section footer（如果有的话）
    if let footerView = tableView.footerView(forSection: section) {
        let footerFrame = CGRect(x: 0, y: currentY, width: totalSize.width, height: footerView.frame.height)
        footerView.drawHierarchy(in: footerFrame, afterScreenUpdates: true)
        currentY += footerView.frame.height
    }
}

// 从上下文获取生成的图片
let finalImage = UIGraphicsGetImageFromCurrentImageContext()
// 结束上下文
UIGraphicsEndImageContext()

4. 分享生成的图片 #

拿到finalImage后，就可以用系统的分享控件进行分享了：

guard let imageToShare = finalImage else { return }
let activityVC = UIActivityViewController(activityItems: [imageToShare], applicationActivities: nil)
// iPad需要设置弹出源（如果支持的话）
if let popoverPresentationController = activityVC.popoverPresentationController {
    popoverPresentationController.sourceView = yourShareButton
}
present(activityVC, animated: true)

注意事项 #

• 所有UI操作必须在主线程执行，避免崩溃或绘制异常。
• 如果TableView有大量单元格，绘制过程可能会有点耗时，建议添加加载指示器（比如UIActivityIndicatorView），提升用户体验。
• 确保你的单元格配置方法configureCell(_:for:)能正确处理展开状态的UI，比如显示展开后的内容。

内容的提问来源于stack exchange，提问作者Haroon