如何将图片设置为导航栏标题

59

我想把一个.png图像放在导航栏中间,代替文本标题。请问您能告诉我如何实现吗?

谢谢。

7个回答

126

设置navigationItem的titleView

UIImage *image = [UIImage imageNamed:@"image.png"];
self.navigationItem.titleView = [[UIImageView alloc] initWithImage:image];

2
UIImage的尺寸应该是多大适合作为标题?我试过180*40,但是图片变得模糊了。 - Krunal
这在iOS 7.1中完美运行(当然没有使用'autorelease')。我的图像大小为296x40px(2倍),显示得很完美。谢谢! - Alex
在Swift中,代码如下:let imgTitleBar = UIImage(named: "iphone-menu.png") self.navItem.titleView = UIImageView(image: imgTitleBar)只需添加一个提示。 - Alessandro Garcez

42

Swift 4.2
包括建议的框架/缩放

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

谢谢 @Michael-R ....但是在我添加了以下代码之后,我的导航项标题没有显示出来。 - Cloy
自从发布这个答案以来,Swift和iOS已经有所改变,我会尽快查看并更新。 - Michael Ramos
伙计,你太棒了。 - Naveed Ahmad

14
您可以更改UINavigationBar中的所有视图。如果您正在尝试更改导航控制器中的navigationBar,请执行以下操作:
self.navigationItem.titleView = [[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image.png"] autorelease];
如果你正在自己创建navigationBar,那么做同样的事情,但是不要调用`self.navigationItem`,而是调用:`navigationBar.topItem`

4
标题所需的UIImage大小应该是多少?我尝试使用180*40,但它变得模糊。 - Krunal

4

如果有人需要在 Swift 4.2 中在导航栏标题视图中同时显示图像和文本,请尝试使用以下函数:

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

}

enter image description here


太棒了,我一直在寻找这个。 - Francisco Peters

3

已更新至Swift 2.x

navigationItem.titleView = UIImageView.init(image: UIImage(named:"yourImageName"))

2

Swift 5 版本:

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

0
在寻找这个问题的答案时,我在Apple Discussions论坛中找到了一个漂亮而简单的解决方案,覆盖-(void)drawRect:(CGRect)rect用于UINavigationBar
@implementation UINavigationBar (CustomImage)
- (void)drawRect:(CGRect)rect {
    UIImage *image = [UIImage imageNamed: @"NavigationBar.png"];
    [image drawInRect:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
}
@end

我会说这不是最好的解决方案,因为标题可以随意设置,更像是一种技巧,但它可以轻松解决问题并且有效。 - Michal Cichon

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接