Interface Builderで置いたBarButtonItemにアイコン画像を設定する

UIBarButtonItemのアイコンを独自のものに差し替えたい場合の手段です。若干はまったのでメモ書き。下の画像のように2つのBarButtonItemが配置されているとします。

facebookのいいね！の画像をアイコンとして設定することとします。

like40x36.png

コードから指定する場合

    UIImage *image = [UIImage imageNamed:@"like40x36.png"];
    [_item1 setImage:image];

僕はsetImageではなくsetBackgroundImageを使用してたためBarButtonItem.titleが表示されてしまい途方にくれていました。setBackgroundImageではなくsetImageを使用します。

Interface Builderから指定する場合

対象のUIBarButtonItemオブジェクトを選択した状態でimageを指定します。画像ファイルがプロジェクトに正しく追加されていれば右側の矢印ボタンから選択できます。ここではitem2の方の画像をいいね画像に差し替えます。

ここまでの状態でInterface Builder上では下のような見え方になります。

実行すると両方いいね！の画像にアイコン画像が変更されているはずです。

コードからアイコン画像を指定する場合はBarButtonItemをアウトレット接続しないといけないのでInterface Builderから指定する方法の方がスマートだと思います。

ソース全文

//
//  BBIViewController.m
//  barButtonIcon
//
//  Created by 島田克弥 on 2014/03/08.
//  Copyright (c) 2014年 shimada-k. All rights reserved.
//

#import "BBIViewController.h"

@interface BBIViewController ()
@property (weak, nonatomic) IBOutlet UIBarButtonItem *item1;
- (IBAction)tabItem1:(UIBarButtonItem *)sender;
- (IBAction)tabItem2:(UIBarButtonItem *)sender;

@end

@implementation BBIViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
	// Do any additional setup after loading the view, typically from a nib.
    UIImage *image = [UIImage imageNamed:@"like40x36.png"];
    [_item1 setImage:image];
}

- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

- (IBAction)tabItem1:(UIBarButtonItem *)sender {
    NSLog(@"item1が押されたよ");
}

- (IBAction)tabItem2:(UIBarButtonItem *)sender {
    NSLog(@"item2が押されたよ");
}
@end