重新创建Apple Music UINavigationController标题箭头

Question

我正在尝试从Apple新音乐应用中的“新建”标签创建外观：

起初，我认为箭头只是一个unicode字符，但我找到的最接近的符号是：﹀，这不是垂直对齐的，所以这段代码会生成以下内容

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

你有什么建议我会这样做吗？

Answer 1

我使用@ 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：

Answer 2

我是通过使用UIButton来做到这一点的。将其图像设置为箭头图像，其标题为All Genres。无论如何，当你点击它时，你想要一个回调，所以按钮在功能上也能很好地发挥作用。

将按钮分配给navigationItem的titleView。

Answer 3

以上的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