iOS - 在导航栏的标题中添加图片和文字

Question

我想创建一个类似于所附图片中的内容的导航栏。

导航栏的标题将是图片和文字的组合。

1. 这应该按照任何最佳实践来完成吗？

2. 这怎么办？

Answer 1

由于this answer shows，最简单的解决方案是将文本图像添加到您的形象，增加了导航栏，如下所示：

var image = UIImage(named: "logo.png") 
self.navigationItem.titleView = UIImageView(image: image) 

但是，如果你要加文本和图像（例如就本地化而言），您可以将导航栏的标题视图设置为包含图像和文本，方法是将它们添加到UIView，并将navigationItem的标题视图设置为UIView，例如（假设导航栏是一个导航控制器的一部分）：

// Only execute the code if there's a navigation controller 
if self.navigationController == nil { 
    return 
} 

// Create a navView to add to the navigation bar 
let navView = UIView() 

// Create the label 
let label = UILabel() 
label.text = "Text" 
label.sizeToFit() 
label.center = navView.center 
label.textAlignment = NSTextAlignment.Center 

// Create the image view 
let image = UIImageView() 
image.image = UIImage(named: "Image.png") 
// To maintain the image's aspect ratio: 
let imageAspect = image.image!.size.width/image.image!.size.height 
// Setting the image frame so that it's immediately before the text: 
image.frame = CGRect(x: label.frame.origin.x-label.frame.size.height*imageAspect, y: label.frame.origin.y, width: label.frame.size.height*imageAspect, height: label.frame.size.height) 
image.contentMode = UIViewContentMode.ScaleAspectFit 

// Add both the label and image view to the navView 
navView.addSubview(label) 
navView.addSubview(image) 

// Set the navigation bar's navigation item's titleView to the navView 
self.navigationItem.titleView = navView 

// Set the navView's frame to fit within the titleView 
navView.sizeToFit() 

Answer 2

这里是我的雨燕4 2美分，因为公认的答案并没有为我工作（主要是关闭屏幕）：

// .. in ViewController 
var navBar = CustomTitleView() 

override func viewWillAppear(_ animated: Bool) { 
    super.viewWillAppear(animated) 


    // =================== navBar ===================== 
    navBar.loadWith(title: "Budget Overview", leftImage: Images.pie_chart) 
    self.navigationItem.titleView = navBar 

} 

class CustomTitleView: UIView 
{ 

var title_label = CustomLabel() 
var left_imageView = UIImageView() 

override init(frame: CGRect){ 
    super.init(frame: frame) 
    setup() 
} 

required init?(coder aDecoder: NSCoder){ 
    super.init(coder: aDecoder) 
    setup() 
} 

func setup(){ 
    self.addSubview(title_label) 
    self.addSubview(left_imageView) 

} 

func loadWith(title: String, leftImage: UIImage?) 
{ 

    //self.backgroundColor = .yellow 

    // =================== title_label ================== 
    //title_label.backgroundColor = .blue 
    title_label.text = title 
    title_label.font = UIFont.systemFont(ofSize: FontManager.fontSize + 5) 


    // =================== imageView =================== 
    left_imageView.image = leftImage 

    setupFrames() 
} 

func setupFrames() 
{ 

    let height: CGFloat = Navigation.topViewController()?.navigationController?.navigationBar.frame.height ?? 44 
    let image_size: CGFloat = height * 0.8 

    left_imageView.frame = CGRect(x: 0, 
            y: (height - image_size)/2, 
            width: (left_imageView.image == nil) ? 0 : image_size, 
            height: image_size) 

    let titleWidth: CGFloat = title_label.intrinsicContentSize.width + 10 
    title_label.frame = CGRect(x: left_imageView.frame.maxX + 5, 
           y: 0, 
           width: titleWidth, 
           height: height) 



    contentWidth = Int(left_imageView.frame.width) 
    self.frame = CGRect(x: 0, y: 0, width: CGFloat(contentWidth), height: height) 
} 


var contentWidth: Int = 0 //if its CGFloat, it infinitely calls layoutSubviews(), changing franction of a width 
override func layoutSubviews() { 
    super.layoutSubviews() 

    self.frame.size.width = CGFloat(contentWidth) 

} 

}