it-swarm.com.de

Navigationsleiste mit UIImage für den Titel

Ich möchte das Erscheinungsbild meiner App anpassen, indem Sie ein Logo als Titel der Navigationsleiste anstelle von Text verwenden. Wenn ich diesen Code verwende

let logo = UIImage(named: "logo.png")
self.navigationItem.titleView = logo;

Ich erhalte die Fehlermeldung "UIImage ist nicht in UIView konvertierbar". Wie kann ich das richtig machen?

52
Darx

Legen Sie es in eine UIImageView

let logo = UIImage(named: "logo.png")
let imageView = UIImageView(image:logo)
self.navigationItem.titleView = imageView
133
Jack

Ich benutze das. Es funktioniert in iOS 8

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view.
    let image = UIImage(named: "YOURIMAGE")
    navigationItem.titleView = UIImageView(image: image)
}

Und hier ist ein Beispiel, wie Sie dies mit CGRect erreichen können.

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view.
    let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 38, height: 38))
    imageView.contentMode = .ScaleAspectFit
    let image = UIImage(named: "YOURIMAGE")
    imageView.image = image
    navigationItem.titleView = imageView
}

Hoffe das wird helfen.

44

Für Swift 4 können Sie die imageView-Größe anpassen 

 let logoContainer = UIView(frame: CGRect(x: 0, y: 0, width: 270, height: 30))

 let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 270, height: 30))
 imageView.contentMode = .scaleAspectFit
 let image = UIImage(named: "your_image")
 imageView.image = image
 logoContainer.addSubview(imageView)
 navigationItem.titleView = logoContainer
14
vp2698

Sie können custom UINavigationItem verwenden, so dass Sie "Navigation Item" nur als YourCustomClass im Main.storyboard ändern müssen.

In Swift 3

class FixedImageNavigationItem: UINavigationItem {

private let fixedImage : UIImage = UIImage(named: "your-header-logo.png")!
private let imageView : UIImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 50, height: 37.5))

required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    imageView.contentMode = .scaleAspectFit
    imageView.image = fixedImage
    self.titleView = imageView

}

}
9
Photon Point

Ich habe oben die Antwort von @ Jack ausprobiert, das Logo erschien, aber das Bild belegte die gesamte Navigationsleiste. Ich wollte, dass es passt.

Swift 4, Xcode 9.2

1.Wert dem Navigationscontroller den Wert UIImage zu. Passen Sie die Größe an, indem Sie Rahmen und Bildgröße teilen.

func addNavBarImage() {

        let navController = navigationController!

        let image = UIImage(named: "logo-signIn6.png") //Your logo url here
        let imageView = UIImageView(image: image)

        let bannerWidth = navController.navigationBar.frame.size.width
        let bannerHeight = navController.navigationBar.frame.size.height

        let bannerX = bannerWidth / 2 - (image?.size.width)! / 2
        let bannerY = bannerHeight / 2 - (image?.size.height)! / 2

        imageView.frame = CGRect(x: bannerX, y: bannerY, width: bannerWidth, height: bannerHeight)
        imageView.contentMode = .scaleAspectFit

        navigationItem.titleView = imageView
    }
  1. Fügen Sie die Funktion direkt unter viewDidLoad() hinzu.

        addNavBarImage() 
    

Beachten Sie das Image-Asset. Vor dem Hochladen habe ich das Logo mit zusätzlichen Rändern versehen, statt an den Rändern beschnitten.

Endergebnis:

 enter image description here

8
Cons Bulaquena

das hat für mich im September 2015 funktioniert. 

// 1
    var nav = self.navigationController?.navigationBar
    // 2 set the style 
    nav?.barStyle = UIBarStyle.Black
    nav?.tintColor = UIColor.yellowColor()
    // 3
    let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 40, height: 40))
    imageView.contentMode = .ScaleAspectFit
    // 4
    let image = UIImage(named: "logo.png")
    imageView.image = image
    // 5
    navigationItem.titleView = imageView
5
Ronaldoh1

Wenn Sie Autolayout bevorzugen und ein permanentes festes Bild in der Navigationsleiste wünschen, das nicht mit jedem Bildschirm animiert wird, funktioniert diese Lösung gut:

class CustomTitleNavigationController: UINavigationController {

override func viewDidLoad() {
    super.viewDidLoad()

    let logo = UIImage(named: "MyHeaderImage")

    let imageView = UIImageView(image:logo)
    imageView.contentMode = .scaleAspectFit
    imageView.translatesAutoresizingMaskIntoConstraints = false

    navigationBar.addSubview(imageView)

    navigationBar.addConstraint (navigationBar.leftAnchor.constraint(equalTo: imageView.leftAnchor, constant: 0))
    navigationBar.addConstraint (navigationBar.rightAnchor.constraint(equalTo: imageView.rightAnchor, constant: 0))
    navigationBar.addConstraint (navigationBar.topAnchor.constraint(equalTo: imageView.topAnchor, constant: 0))
    navigationBar.addConstraint (navigationBar.bottomAnchor.constraint(equalTo: imageView.bottomAnchor, constant: 0))
}
2
danfordham

lass es uns versuchen und auschecken

let image = UIImage(named: "Navbar_bg.png")
navigationItem.titleView = UIImageView(image: image)
let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 40, height: 40))
imageView.contentMode = .ScaleAspectFit
2

Hier ist eine praktische Funktion für Swift 4.2, die ein Bild mit Titeltext zeigt: -

 enter image description here

override func viewDidLoad() {

    super.viewDidLoad()

    //Sets the navigation title with text and image
    self.navigationItem.titleView = navTitleWithImageAndText(titleText: "Dean Stanley", imageName: "online")
}

func navTitleWithImageAndText(titleText: String, imageName: String) -> UIView {

    // Creates a new UIView
    let titleView = UIView()

    // Creates a new text label
    let label = UILabel()
    label.text = titleText
    label.sizeToFit()
    label.center = titleView.center
    label.textAlignment = NSTextAlignment.center

    // Creates the image view
    let image = UIImageView()
    image.image = UIImage(named: imageName)

    // Maintains the image's aspect ratio:
    let imageAspect = image.image!.size.width / image.image!.size.height

    // Sets the image frame so that it's immediately before the text:
    let imageX = label.frame.Origin.x - label.frame.size.height * imageAspect
    let imageY = label.frame.Origin.y

    let imageWidth = label.frame.size.height * imageAspect
    let imageHeight = label.frame.size.height

    image.frame = CGRect(x: imageX, y: imageY, width: imageWidth, height: imageHeight)

    image.contentMode = UIView.ContentMode.scaleAspectFit

    // Adds both the label and image view to the titleView
    titleView.addSubview(label)
    titleView.addSubview(image)

    // Sets the titleView frame to fit within the UINavigation Title
    titleView.sizeToFit()

    return titleView

}
1

Das hat bei mir funktioniert ... probieren Sie es aus

 let image : UIImage = UIImage(named: "LogoName")
    let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 25, height: 25))
    imageView.contentMode = .scaleAspectFit
    imageView.image = image
    navigationItem.titleView = imageView
0
Sohail

Funktioniert für mich in Swift 4 (quadratisches Bild 40x40)

let imageView = UIImageView()
        imageView.frame.size.width = 40
        imageView.frame.size.height = 40
        imageView.contentMode = .scaleAspectFit
        let image = UIImage(named: "YOUR_IMAGE_NAME")
        imageView.image = image
        navigationItem.titleView = imageView

Wenn Sie andere Maßnahmen wünschen, versuchen Sie es

let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 50, height: 100.5)))
            imageView.contentMode = .scaleAspectFit
            let image = UIImage(named: "YOUR_IMAGE_NAME")
            imageView.image = image
            navigationItem.titleView = imageView

Ich hoffe es dient dir. Für mich geht das.

0
oscar castellon

Ich habe dies für iOS 10 und iOS 11 geschrieben und es hat für mich funktioniert:

extension UINavigationBar {
    func setupNavigationBar() {
        let titleImageWidth = frame.size.width * 0.32
        let titleImageHeight = frame.size.height * 0.64
        var navigationBarIconimageView = UIImageView()
        if #available(iOS 11.0, *) {
            navigationBarIconimageView.widthAnchor.constraint(equalToConstant: titleImageWidth).isActive = true
            navigationBarIconimageView.heightAnchor.constraint(equalToConstant: titleImageHeight).isActive = true
        } else {
            navigationBarIconimageView = UIImageView(frame: CGRect(x: 0, y: 0, width: titleImageWidth, height: titleImageHeight))
        }
        navigationBarIconimageView.contentMode = .scaleAspectFit
        navigationBarIconimageView.image = UIImage(named: "image")
        topItem?.titleView = navigationBarIconimageView
    }
}
0
    let imageView = UIImageView(frame: (CGRect(x: 0, y: 0, width: 40, height: 
    40)))
    imageView.contentMode = .scaleAspectFit
    let image = UIImage (named: "logo") // logo is your NPG asset 
    imageView.image = image
    self.navigationItem.titleView = imageView
0
mila kohen