iOS - Bild und Text in Titel der Navigationsleiste hinzufügen

Question

Ich möchte eine Navigationsleiste ähnlich wie im Bild, das angehängt ist, erstellen.

Der Titel der Navigationsleiste wird eine Kombination aus Bild und Text sein.

1. Sollte dies nach Best Practice geschehen?

2. Wie kann es gemacht werden?

Answer 1

Als this answer shows, ist die einfachste Lösung, um den Text zu Ihrem Bild hinzuzufügen und das Bild auf die Navigationsleiste hinzufügen, etwa so:

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

Aber wenn man hinzufügen Text und ein Bild getrennt (z. B. bei der Lokalisierung), können Sie die Titelansicht Ihrer Navigationsleiste so einstellen, dass sie sowohl Bild als auch Text enthält, indem Sie sie zu einer UIView hinzufügen und die Titelansicht navigationItem darauf setzen UIView, zum Beispiel (die Navigationsleiste unter der Annahme ist Teil einer Navigationssteuerung):

// 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

hier ist mein 2 Cent für Swift 4, da akzeptierte Antwort nicht für mich arbeitet (war vor allem aus dem Bildschirm):

// .. 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) 

} 

}