ios - 导航栏添加标题和副标题，类似于 iOS 11 中的 Apple Music

Question

这是一个IOS 11问题。我不确定我们是否可以谈论这个，IOS 处于测试阶段。

但我在 Apple Music 中查看了这个导航栏：

我知道他们介绍了大标题IOS 11：

navigationController?.navigationBar.prefersLargeTitles = true

“为你”的文字看起来像标题，但他们是如何添加日期的？这是一个API吗？

起初我以为这是prompt属性，但它仍然将文本设置在中心和顶部。

我想知道这是否是一些特殊IOS 11的 API，或者他们只是使用了一个带有两个标签的视图。

Answer 1

根据WWDC 2017 Session 301 - Introducing the New App Store大约 10:30，就在显示 Today 交互时，它只是集合视图的部分标题，而不是 UINavigationBar 的一部分（没有）。同样，这适用于 AppStore，但它看起来与音乐的 UI 相同。

另一个关于重新创建 UI 的有趣读物：重新构建新的应用商店应用程序 - 今日视图

Answer 2

对于所有搜索如何为 LargeTitle 设置字幕的人：

步骤1

将导航控制器添加到您的场景中：

1. 打开你的故事板（Main.storyboard）。

2. 选择场景。

3. 选择编辑器 > 嵌入 > 导航控制器。

第2步

打开大标题：

1. 选择项目场景 > 项目 > 导航栏。

2. 在属性检查器上勾选“首选大标题”。

第 3 步

将此函数添加到您的代码中：

 func setTitle(title:String, subtitle:String) -> UIView {

        //Get navigation Bar Height and Width
        let navigationBarHeight = Int(self.navigationController!.navigationBar.frame.height)
        let navigationBarWidth = Int(self.navigationController!.navigationBar.frame.width)

        //Y position for Title and Subtitle
        var y_Title = 0.0
        var y_SubTitle = 0.0

        //Set Y position
        if UIDevice().userInterfaceIdiom == .phone {
            switch UIScreen.main.nativeBounds.height {
            //If screen height equal iPhone 5S and SE
            case 1136:
                y_Title = 46
                y_SubTitle = 36
                print("iPhone 5S and SE")
            //If screen height equal iPhone 6, 6+, 6S, 6S+, 7, 7+, 8, 8+ and X
            case 1334, 1920, 2208, 2436:
                y_Title = 48
                y_SubTitle = 38
                print("iPhone 6, 6+, 6S, 6S+, 7, 7+, 8, 8+ and X")
            default:
                y_Title = 46
                y_SubTitle = 36
                print("Default")
            }
        }

        //Set Font size and weight for Title and Subtitle
        let titleFont = UIFont.systemFont(ofSize: 33, weight: UIFont.Weight.bold)
        let subTitleFont = UIFont.systemFont(ofSize: 12, weight: UIFont.Weight.semibold)

        //Title label
        let titleLabel = UILabel(frame: CGRect(x: 8.5, y: y_Title, width: 0, height: 0))
        titleLabel.backgroundColor = UIColor.clear
        titleLabel.textColor = UIColor.black
        titleLabel.font = titleFont
        titleLabel.text = title
        titleLabel.sizeToFit()

        //SubTitle label
        let subtitleLabel = UILabel(frame: CGRect(x: 8.5, y: y_SubTitle, width: 0, height: 0))
        subtitleLabel.backgroundColor = UIColor.clear
        subtitleLabel.textColor = UIColor.gray
        subtitleLabel.font = subTitleFont
        subtitleLabel.text = subtitle
        subtitleLabel.sizeToFit()

        //Add Title and Subtitle to View
        let titleView = UIView(frame: CGRect(x: 0, y: 0, width: navigationBarWidth, height: navigationBarHeight))
        titleView.addSubview(titleLabel)
        titleView.addSubview(subtitleLabel)

        return titleView

    }

然后在中调用此函数viewDidLoad()：

override func viewDidLoad() {
        super.viewDidLoad()
        self.navigationItem.titleView = setTitle(title: "Title", subtitle: "SUBTITLE")
    }