頭と尻尾はくれてやる!

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


ナビゲーションバーの色(png画像)を即時変える

フラットデザインっぽいナビゲーションバーってどんな感じかな?
と思って、いろいろとナビゲーションバーの色を変えようとしたんだ。

頭と尻尾はくれてやる! ナビゲーションバーをフラットデザインっぽくしてみる
↑に書いたようにtintColorで色を設定してもグラデーションがかかってフラットデザインっぽくないのでpng画像が欲しい、と。ところがいちいちイラストレータやiDrawみたいなツールで作るのも面倒なのでコードでなんとかならないのん?と思ってさ。
いろいろとやり方はあるんだろうけど、とりあえずコードでpng画像を実際に作成してそれを適用させるみたいなことをやってみたんだよ。
ほら、アプリの雰囲気を変えるのにカラーテーマを選択したらあっちこっちの色が変わる、とかそういうのね。

それじゃ、ボタンをタップしたらpng画像を作るってところの基本的な流れ。
{
    UIView *view = [[[UIView alloc] initWithFrame:CGRectMake(0, 0,size.width, size.height)] autorelease];
    view.backgroundColor = color;

    UIGraphicsBeginImageContextWithOptions(size,NO, 0);

    CGContextRef context = UIGraphicsGetCurrentContext();
    [view.layer renderInContext:context];
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    
    NSData *data = UIImagePNGRepresentation(image);

    if ([data writeToFile:filePath atomically:YES]) {
        NSLog(@"OK");
    } else {
        NSLog(@"Error");
    }
}
ここでsizeは作りたい画像のサイズ。iPhoneのナビゲーションバーなら通常320x44だよね(Retinaでもこのサイズ)。colorは作りたい画像の色を示すUIColorオブジェクト。
filePathは保存する場所。

前からスクリーンショット撮影なんかでこの辺りの処理は使っていたんだけど、今回「そうなんだ?」って思ったのがpng画像の元となるviewってオブジェクトを別にどこかへaddSubview:する必要はないってこと。上のコードでもしてないでしょ?
どこかへaddSubview:して実際に描画したところに対してrenderInContext:してやらないとだめって漠然と思っていただけに意外。

ともかく、次にこうやって作った画像をすぐに適用させなくちゃいけないよね。

さっきの続き。
{
    UIImage *barImage = [UIImage imageWithContentsOfFile: filePath];
    [[UINavigationBar appearance] setBackgroundImage: barImage forBarMetrics:UIBarMetricsDefault];
}
実はファイル名がわかってて、そこからUIImageオブジェクトを作るのってどうするんだろう?って思ったんだ。 だって普段imageNamed:@ファイル名 みたいなのしか使ってなかったからさ。
調べたらちゃんとあるんだね(そりゃそうだろう)。imageWithContentsOfFile:メソッドなんてのがあるんだ。
そうやって作ったUIImageオブジェクトを適用させるってのが上のコードなんだけど、これだと具合がちょっと悪いんだよね。
というのもユーザーがボタンをタップして、その処理を記述してるところに上のコードを書いても見ている画面のナビゲーションバーには反映されないんだ。画面を遷移させるとOKなんだけどさ。
これって微妙でしょ?
できることなら、このカラーテーマ!ってボタンをタップしたらすぐに切り替わって欲しいじゃない。
{
    [self.navigationController.navigationBar setBackgroundImage: barImage forBarMetrics:UIBarMetricsDefault];
}
↑そういうことで追加。これならボタンタップした瞬間に色が変わる。二度手間って気がしないでもないけど仕方ないよね。



<< iPadを横向きで起動するとself.view.boundsが意図通りに取れない   TopPage  iOSデバイスのカメラで得る画像データのサイズを知る方法 >>

コメント


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

トラックバック

トラックバックURL
http://ringsbell.blog117.fc2.com/tb.php/787-5a348d87




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

FC2Ad