Setting attributed label as navigation title

问题

I am working on IOS using swift 4. I have to make the Navigation controller, with the center Aligned App title with Image at its left. But I am not getting how to attach image to its left. The attributed Image always goes to its right.

For this I am appending the string twice. below is the code

   //Get image and set it's size
    let image = UIImage(named: "user2")
    let newSize = CGSize(width: 30, height: 30)

    //Resize image
    UIGraphicsBeginImageContextWithOptions(newSize, false, 0.0)
    image?.draw(in: CGRect(x: 0, y: 0, width: newSize.width, height: newSize.height))
    let imageResized = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()

    //Create attachment text with image
    let attachment = NSTextAttachment()
    attachment.image = imageResized
    let attachmentString = NSAttributedString(attachment: attachment)
    let myString = NSMutableAttributedString(string: "")
    myString.append(attachmentString)
    let strAttachment = NSAttributedString(string: "My Ios App" )
    myString.append(strAttachment)

    navLabel.attributedText = myString

    self.navigationItem.titleView = navLabel

What I am getting is some thing like below image is on left

what I want :

I just want the image to be shown with the space between text and Image. I want the image to be look good and nice. Text should be center vertically to the image. what is good way of achieving this ?.

回答1:

Using this code you will get your output :

        let navgationView = UIView()

        let label = UILabel()
        label.text = " My Ios App"
        label.sizeToFit()
        label.center = navgationView.center
        label.textAlignment = NSTextAlignment.center

        let image = UIImageView()
        image.image = UIImage(named: "user")
        let imageAspect = image.image!.size.width/image.image!.size.height
        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

        navgationView.addSubview(label)
        navgationView.addSubview(image)

        self.navigationItem.titleView = navgationView
        navgationView.sizeToFit()

Output:-

Hope it's helps.!!

回答2:

If you want to adjust your attachment position you must use the attachment.bounds property and if you want to adjust the text vertical alignment you need to use NSAttributedString baselineOffset key

Update

Swift 3 code

        let normalNameString = NSMutableAttributedString.init(string: "")

        let attachment = NSTextAttachment()
        attachment.image = imageHelper.pgImage(textValue: "PG-13")
        attachment.bounds = CGRect(x: 0, y: 0, width: (attachment.image?.size.width)!, height: (attachment.image?.size.height)!)
        normalNameString.append(NSAttributedString(attachment: attachment))
        normalNameString.append(NSAttributedString(string: " My Ios App", attributes: [NSBaselineOffsetAttributeName :6]))
        self.lblText.attributedText = normalNameString

Swift 4 code

        let normalNameString = NSMutableAttributedString.init(string: "")

        let attachment = NSTextAttachment()
        attachment.image = imageHelper.pgImage(textValue: "PG-13")
        attachment.bounds = CGRect(x: 0, y: 0, width: (attachment.image?.size.width)!, height: (attachment.image?.size.height)!)
        normalNameString.append(NSAttributedString(attachment: attachment))
        normalNameString.append(NSAttributedString(string: " My Ios App", attributes: [NSAttributedStringKey.baselineOffset :6]))
        self.lblText.attributedText = normalNameString

Swift 5 Update

    let normalNameString = NSMutableAttributedString.init(string: "")

    let attachment = NSTextAttachment()
    attachment.image = imageHelper.pgImage(textValue: "PG-13")
    attachment.bounds = CGRect(x: 0, y: 0, width: (attachment.image?.size.width)!, height: (attachment.image?.size.height)!)
    normalNameString.append(NSAttributedString(attachment: attachment))
    normalNameString.append(NSAttributedString(string: " My Ios App", attributes: [NSAttributedString.Key.baselineOffset :6]))
    self.lblText.attributedText = normalNameString

来源：https://stackoverflow.com/questions/50040115/setting-attributed-label-as-navigation-title

标签

ios

uinavigationcontroller

uilabel