You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在UITextView文本后放置视频,或滚动完文本后显示外部视频

嘿,我来帮你搞定这两个需求!在iOS开发里,这两种场景都有成熟的实现思路,我给你详细拆解下:

一、在UITextView的文本后嵌入视频

UITextView本身支持富文本,我们可以通过NSTextAttachment把视频播放器作为附件插入到文本末尾。这里有个实用技巧:先给附件设置静态占位图,再通过代理点击触发视频播放(如果需要直接在文本区域播放,就得额外处理视图层级)。

具体实现步骤(Swift代码示例):

import UIKit
import AVKit

// 给UITextView追加视频附件的方法
func appendVideoToTextView(textView: UITextView, videoURL: URL) {
    // 1. 创建视频播放器和图层
    let player = AVPlayer(url: videoURL)
    let playerLayer = AVPlayerLayer(player: player)
    let videoHeight: CGFloat = 200 // 自定义视频高度
    playerLayer.frame = CGRect(x: 0, y: 0, width: textView.bounds.width, height: videoHeight)
    
    // 2. 用UIView承载播放器图层,方便转成占位图
    let videoPlaceholderView = UIView(frame: playerLayer.frame)
    videoPlaceholderView.layer.addSublayer(playerLayer)
    
    // 3. 将View转成静态图片作为附件占位
    UIGraphicsBeginImageContextWithOptions(videoPlaceholderView.bounds.size, false, UIScreen.main.scale)
    videoPlaceholderView.layer.render(in: UIGraphicsGetCurrentContext()!)
    let placeholderImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    
    // 4. 创建文本附件并设置尺寸
    let videoAttachment = NSTextAttachment()
    videoAttachment.image = placeholderImage
    videoAttachment.bounds = CGRect(x: 0, y: 0, width: textView.bounds.width, height: videoHeight)
    
    // 5. 把附件转成富文本,追加到原有文本后面
    let attachmentString = NSAttributedString(attachment: videoAttachment)
    let mutableText = NSMutableAttributedString(attributedString: textView.attributedText)
    mutableText.append(NSAttributedString(string: "\n\n")) // 加换行分隔文本和视频
    mutableText.append(attachmentString)
    
    // 6. 赋值回UITextView
    textView.attributedText = mutableText
    textView.isUserInteractionEnabled = true
    textView.delegate = self // 记得设置ViewController为代理
}

// UITextView代理:处理附件点击播放视频
extension YourViewController: UITextViewDelegate {
    func textView(_ textView: UITextView, shouldInteractWith attachment: NSTextAttachment, in characterRange: NSRange, interaction: UITextItemInteraction) -> Bool {
        // 这里可以直接播放视频,或者弹出全屏播放器
        let playerVC = AVPlayerViewController()
        playerVC.player = AVPlayer(url: yourVideoURL)
        present(playerVC, animated: true) {
            playerVC.player?.play()
        }
        return false // 阻止默认的交互行为
    }
}

注意:如果想要视频在UITextView里直接播放,需要自定义UITextView,手动把播放器View添加到UITextView的子视图中,并且监听文本布局变化,实时调整播放器的位置(因为富文本的附件占位是静态的,动态播放需要单独处理视图层级)。

二、滚动完所有文本后才显示外部视频

这个需求更适合用容器视图来实现,推荐两种简单方案:

方案1:UITableView(最省心)

把文本和视频分成两个TableViewCell,第一个cell放自适应高度的UITextView,第二个cell放视频播放器。用户滚动完文本cell后,自然就会看到视频cell。

关键代码(计算文本cell的高度):

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    if indexPath.row == 0 {
        // 计算文本内容的高度
        let text = yourTextContent
        let maxWidth = tableView.bounds.width - 20 // 减去左右边距
        let textSize = text.boundingRect(
            with: CGSize(width: maxWidth, height: .greatestFiniteMagnitude),
            options: .usesLineFragmentOrigin,
            attributes: [.font: UIFont.systemFont(ofSize: 16)],
            context: nil
        ).size
        return textSize.height + 20 // 加上上下内边距
    } else {
        return 200 // 视频cell的固定高度
    }
}

这种方案的好处是自带滚动逻辑,不需要手动处理滚动监听,适配不同屏幕也更简单。

方案2:UIScrollView容器

把UITextView和视频View都放在UIScrollView里,先计算文本的高度,然后固定视频View在文本的下方,设置ScrollView的contentSize即可:

// 初始化ScrollView、TextView和视频View
let scrollView = UIScrollView(frame: view.bounds)
view.addSubview(scrollView)

let textView = UITextView()
textView.text = yourTextContent
textView.isScrollEnabled = false // 禁止TextView自身滚动
scrollView.addSubview(textView)

let videoPlayerView = UIView(frame: CGRect(x: 0, y: 0, width: scrollView.bounds.width, height: 200))
// 给videoPlayerView添加AVPlayerLayer...
scrollView.addSubview(videoPlayerView)

// 布局计算
let textHeight = textView.sizeThatFits(CGSize(width: scrollView.bounds.width, height: .greatestFiniteMagnitude)).height
textView.frame = CGRect(x: 10, y: 10, width: scrollView.bounds.width - 20, height: textHeight)
videoPlayerView.frame = CGRect(x: 0, y: textView.frame.maxY + 20, width: scrollView.bounds.width, height: 200)

// 设置ScrollView的内容大小
scrollView.contentSize = CGSize(width: scrollView.bounds.width, height: videoPlayerView.frame.maxY + 10)

这样用户滚动ScrollView时,只有滑到最底部才会看到视频View。


内容的提问来源于stack exchange,提问作者bixbow

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.14 09:17:39