ios 以全屏视频为主要内容的滚动视图

Question

this is the layout i want to acheive

我正在想办法让这个布局在不同的屏幕上工作。我试图获取屏幕高度并以编程方式将视频层高度设置为等于它。音量按钮约束距离右边距为 25，距离视频底部为 25。问题是，当我尝试运行应用程序时，音量按钮显示在屏幕的右中部，而不是底角的右侧。此外，图像视图与视频重叠，而不是显示在视频下方。我的假设是这些元素的约束看到故事板中视频层的高度，而不是我在 ViewController.swift.

中以编程方式设置的高度

Answer 1

首先，您使用的是 ScrollView，因此您需要为屏幕中的每个项目提供一个高度，这样您就可以为视频屏幕提供“固定高度”高度，然后您也可以为您的按钮提供一个固定高度并连接它来自尾随、前导、底部和顶部，我认为它会与你一起工作，如果出现任何问题，请随时对其发表评论

Answer 2

您可以使用 table 视图实现更连贯的布局，并在另一个部分中包含全屏视频部分和其余图像视图部分。您视频的部分将有 UIScreen.main.bounds.height 作为单元格高度，这样您就可以拥有动态的全屏高度，而不管设备如何。

class ViewController: UITableViewController {
    var arr: [[String]] = {
        var arr = [[String]]()
        arr.append(["Video"])
        var imageArr = [String]()
        for index in 1...20 {
            imageArr.append(String(index))
        }
        arr.append(imageArr)
        return arr
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        tableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
    }
    
    override func numberOfSections(in tableView: UITableView) -> Int {
        return arr.count
    }
    
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return arr[section].count
    }
    
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
        cell.textLabel?.text = arr[indexPath.section][indexPath.row]
        return cell
    }
    
    override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        if indexPath.section == 0 {
            return UIScreen.main.bounds.height
        } else {
            return 100
        }
    }
}

至于音量按钮，您可以为视频部分创建自定义单元格并在cellForRowAt 方法中加载它。确保您使用的是 Autolayout 而不是 CGRect 来定位它。

ios 以全屏视频为主要内容的滚动视图

ios scrollview with a full screen video as main content

layout

xcode

scrollview

ios

swift