重新创建 Apple Music UINavigationController 标题箭头

Recreating Apple Music UINavigationController title arrow

我正在尝试从 Apple 新音乐应用程序的 "New" 选项卡创建外观:

起初,我以为箭头只是一个 unicode 字符,但我找到的最接近的符号是:﹀,而且它不是垂直对齐的,所以这段代码产生以下内容

navigationItem.title = "All Genres﹀"
navigationController!.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.redColor()]

你对我如何着手做这件事有什么建议吗?

我会使用 UIButton 来执行此操作。将其图像设置为箭头图像,并将其标题设置为所有流派。无论如何,当它被点击时你会想要一个回调,所以一个按钮在功能上也能很好地发挥作用。

将按钮分配给 navigationItem 的 titleView。

我使用@rounak 的解决方案成功了。这是任何想知道的人的代码

let arrow = UIImage(named: "titleArrow")!.imageWithRenderingMode(.AlwaysOriginal)

let titleButton = UIButton(type: .System)
titleButton.addTarget(self, action: "pickGenre", forControlEvents: .TouchUpInside)

titleButton.setTitle("All Genres", forState: .Normal)
titleButton.setTitleColor(UIColor.redColor(), forState: .Normal)
titleButton.titleLabel!.font = UIFont.systemFontOfSize(16)

titleButton.setImage(arrow, forState: .Normal)
titleButton.sizeToFit()

titleButton.titleEdgeInsets = UIEdgeInsetsMake(0, -titleButton.imageView!.frame.width, 0, titleButton.imageView!.frame.width)
titleButton.imageEdgeInsets = UIEdgeInsetsMake(0, titleButton.titleLabel!.frame.width + 2.5, 0, -titleButton.titleLabel!.frame.width)

navigationItem.titleView = titleButton

titleArrow@2x.png:

Swift 以上3个版本:

    let arrow = UIImage(named: "titleArrow")!.withRenderingMode(.alwaysOriginal)

    let titleButton = UIButton(type: .system)
    titleButton.addTarget(self, action: #selector(pickGenre), for: .touchUpInside)

    titleButton.setTitle("All Genres", for: .normal)
    titleButton.setTitleColor(.red, for: .normal)
    titleButton.titleLabel!.font = UIFont.systemFont(ofSize: 16)

    titleButton.setImage(arrow, for: .normal)
    titleButton.sizeToFit()

    titleButton.titleEdgeInsets = UIEdgeInsetsMake(0, -titleButton.imageView!.frame.width, 0, titleButton.imageView!.frame.width)
    titleButton.imageEdgeInsets = UIEdgeInsetsMake(0, titleButton.titleLabel!.frame.width + 2.5, 0, -titleButton.titleLabel!.frame.width)

    navigationItem.titleView = titleButton