頭と尻尾はくれてやる!

パソコンおやじのiPhoneアプリ・サイト作成・運営日記


ナビゲーションバー用のボタンをいじってみた

前記事「ナビゲーションバーをいじってみた」に続いて、ボタンをいじってみました。
以下の内容はナビゲーションバーに置くボタンについてです。
つまり、viewController内で
self.navigationItem.rightBarButtonItem = barButtonItem;
などとする場合を想定しています。

(1)ボタンの表示方法
上記コードの右辺はUIButtonではなく、UIBarButtonItemクラスのオブジェクトだよね!(とわざわざ書くのは私がよく間違えるから)
、、、ともかく、コードの流れはこんな感じになるはず。
UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
button.frame = CGRectMake(0.f, 0.f, 100.0f, 40.0f);
[button setTitle:@"ボタン" forState:UIControlStateNormal];
UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] initWithCustomView:button];
self.navigationItem.rightBarButtonItem = barButtonItem;
[barButtonItem release];
↓UIButtonTypeRoundedRectの場合の結果がこれ。

ナビゲーションバーのボタン1

↑まあサイズとかはおいといて、とりあえず表示はできた、ということで。

(2)100~102番のボタン
上のボタンなんかよりは100~102あたりのボタンが美しいかな、と思ったりしてまして。
最初のコードの1行目を変えて、frameの設定は不要。
UIButton *button = [UIButton buttonWithType:100];

ナビゲーションバーのボタン2

↑すると、結果がこんな感じ。
文字の量で勝手にボタンのサイズを変えてくれるのでframeを設定する必要がないみたい。

ナビゲーションバーのボタン3

↑101番だとこんな風になる。
ナビゲーションでpushして画面遷移したら左上に出る"戻るボタン"と同じ形だな。

ナビゲーションバーのボタン4

↑102番はこんなの。100番と少し色が違うな。

(3)ナビゲーションバーの色を設定してみると
ナビゲーションバーの色を
self.navigationController.navigationBar.tintColor = [UIColor 略
って感じで設定すると、この時の100~102番のボタンは以下のようになりました。

ナビゲーションバーのボタン5

↑100番の場合。
ほー、ボタンの色がそれらしく変わってくれたじゃあーりませんか!
自分で設定しなくても、ナビゲーションバーの色にあわせてテキトウに変えてくれるんですな。

ナビゲーションバーのボタン6

↑101番の場合、、、あれ?
左が尖ってないよ?
尖ろうとしているのか文字は右に寄ってるんですがね、、、
ちなみにleftBarButtonItemに設定しても尖ってくれませんでした。

ナビゲーションバーのボタン7

↑102番だと、、、なるほど、これもナビゲーションバーの色に合わせてボタンの色を変えてくれるのですが、100番より少し濃く表示されるんですね。

なお、前記事にあったようにカテゴリーを使って、ナビゲーションバーの背景に画像を設定してみたところ、100番のボタンは下のようになりました↓

ナビゲーションバーのボタン8

↑ああ、そうなの、この色になるのか。
ということは、ナビゲーションバーに画像を使うと、ボタンのデザインも必要になるんだな、、、

<< ステータスバーの見た目を変えてみる  TopPage  ナビゲーションバーをいじってみた >>

コメント


管理者にだけ表示を許可する
 

トラックバック

トラックバックURL
http://ringsbell.blog117.fc2.com/tb.php/449-e85213a6




Copyright ©頭と尻尾はくれてやる!. Powered by FC2 Blog. Template by eriraha.

FC2Ad