71

How can I get the right coloring for my translucent navigation bars in iOS 7? The navigation bar just adjusts the given color to a much brighter one. Changing brightness or saturation of the color also doesn´t deliver the right result.

Anyone having the same trouble? It seems to work somehow, looking at Facebook: they´re having their colors and translucent navigation bars.

Edit: Just to make it clear: I need the Bar to be translucent, not transparent (with some alpha), not solid! http://en.wikipedia.org/wiki/Transparency_and_translucency

Edit: Now posted to Apple BugReporter

4

20 に答える 20

81

バーは色の値を調整します。

RGB >= 40 のみの推奨方法は、最もぼやけます。

この計算機を使用して、画面にレンダリングされたときの色を入力すると、barTintColor の色を設定する内容がわかるため、Apple が調整すると、意図したとおりに表示されます。

https://www.transpire.com/insights/blog/bar-color-calculator/

編集：これらの計算は白い背景と明るい色の場合であることに注意してください（40を超えるrgb、より暗くする必要がある場合は、他の人が言及したように背景レイヤーを追加する必要があります-それはバーのぼかしを減らします）

詳細ガイド: https://www.transpire.com/insights/blog/custom-ui-navigationbar-colors-ios7/

スニペット:

@interface UnderlayNavigationBar : UINavigationBar

@end

.

@interface UnderlayNavigationBar ()
{
    UIView* _underlayView;
}

- (UIView*) underlayView;

@end

@implementation UnderlayNavigationBar

- (void) didAddSubview:(UIView *)subview
{
    [super didAddSubview:subview];

    if(subview != _underlayView)
    {
        UIView* underlayView = self.underlayView;
        [underlayView removeFromSuperview];
        [self insertSubview:underlayView atIndex:1];
    }
}

- (UIView*) underlayView
{
    if(_underlayView == nil)
    {
        const CGFloat statusBarHeight = 20;    //  Make this dynamic in your own code...
        const CGSize selfSize = self.frame.size;

        _underlayView = [[UIView alloc] initWithFrame:CGRectMake(0, -statusBarHeight, selfSize.width, selfSize.height + statusBarHeight)];
        [_underlayView setAutoresizingMask:(UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight)];
        [_underlayView setBackgroundColor:[UIColor colorWithRed:0.0f green:0.34f blue:0.62f alpha:1.0f]];
        [_underlayView setAlpha:0.36f];
        [_underlayView setUserInteractionEnabled:NO];
    }

    return _underlayView;
}

@end

.

UIViewController* rootViewController = ...;
UINavigationController* navigationController = [[UINavigationController alloc] initWithNavigationBarClass:[UnderlayNavigationBar class] toolbarClass:nil];
[navigationController.navigationBar setBarTintColor:[UIColor colorWithRed:0.0f green:0.0f blue:90.0f/255.0f alpha:1]];
[navigationController setViewControllers:@[rootViewController]];
于 2013-09-27T05:13:40.027 に答える
13

translucentプロパティを変更するだけです

navigationBar.translucent = NO;

これは、ナビゲーション バーの透明なサブビュー/サブレイヤーを削除/作成することと事実上同じです。

于 2014-09-19T09:20:55.217 に答える
4

フォークの iOS 7 半透明 UINavigationBar の明るく鮮やかな色の実現 のコードを改善しました: https://github.com/allenhsu/CRNavigationController

私の変更により、画面上の結果の色 (白い背景で選択) は、setBarTintColor に渡された値とまったく同じになります。素晴らしい解決策だと思います。

于 2013-10-23T06:59:45.350 に答える
3

この回答が少し遅れていることは承知していますが、Interface Builder を使用している場合、Interface Builder が間違った色空間を使用するように設定されているため、16 進値を使用すると間違った色になる可能性があります。Xcode 6.4 では、カラー ピッカー ダイアログの右上にある小さな歯車を押して、使用しているカラー スペースを選択できます。

ここに画像の説明を入力

私は、実際にはジェネリック RGB を使用する必要があったときに、sRGB IEC6196-2.1 に設定されていました。

于 2015-08-17T20:05:03.633 に答える
2

色が非常に鮮やかでない場合は、アルファ付きの同等の色を計算できます。これは iOS 7.0.3 以降でうまく機能します。7.0.3 より前では、自動的に 0.5 アルファが適用されました。

このコードは、入力色が RGB で不透明であり、背景色が白であることを前提としています。

- (UIColor *) colorByInterpolatingForBarTintWithMinimumAlpha: (CGFloat) alpha
{
    NSAssert(self.canProvideRGBComponents, @"Self must be a RGB color to use arithmatic operations");
    NSAssert(self.alpha == 1, @"Self must be an opaque RGB color");

    CGFloat r, g, b, a;
    if (![self getRed:&r green:&g blue:&b alpha:&a]) return nil;

    CGFloat r2,g2,b2,a2;
    r2 = g2 = b2 = a2 = 1;

    CGFloat red,green,blue;

    alpha -= 0.01;
    do {
        alpha += 0.01;
        red = (r - r2 + r2 * alpha) / alpha;
        green = (g - g2 + g2 * alpha) / alpha;
        blue = (b - b2 + b2 * alpha) / alpha;
    } while (alpha < 1 && (red < 0 || green < 0 || blue < 0 || red > 1 || green > 1 || blue > 1));

    UIColor *new = [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
    return new;
}

誰かがアルファを計算するよりエレガントな方法を持っている場合 (私はその do-while ループにうんざりしています)、私はそれを見てみたいです: https://gist.github.com/sgtsquiggs/7206385

于 2013-10-28T23:17:28.570 に答える
1

私のために働いたシンプルで高速なソリューション。背景ではなくストーリーボードでバーの色合いを設定するだけです。

まず、ナビゲーション コントローラーでナビゲーション バーを選択します。
ナビゲーションバー

次に、右側の属性インスペクターをクリックして、バーの色合いを設定します
バーティント

定義済みの色を選択するか、色をクリックして別の色に設定できます。
ここに画像の説明を入力

于 2016-11-30T06:48:13.997 に答える
1

上記のコメントをすべて読んだことがあると思います。カスタムの背景と半透明性を取得したい場合は、ナビゲーション バー クラスをオーバーライドし、独自の layoutsubviews メソッドを実装する必要があります。ここにサブビューを追加するだけです。重要: NavigationBar の背景サブビューのすぐ上に追加する必要があります。すべてのサブビューの上に配置すると、ヘッダーまたはボタンが非表示になります。

また、この質問をチェックしてください

于 2013-09-25T19:30:59.107 に答える
0

色合いを暗くするには、ナビゲーション バーの backgroundColor を変更します。

UIColor *color1 = [UIColor colorWithRed:55.0f/256.0f green:0.0f blue:1.0f alpha:1.0f];
[navBar setBarStyle:UIBarStyleBlackTranslucent];
[navBar setBarTintColor:color1];
UIColor *color2 = [UIColor colorWithWhite:0 alpha:0.3];
[navBar setBackgroundColor:color2];

color1 と color2 をいじってみて、自分に合った結果が得られるようにしてください。それ以外は、フレームワークと戦うことになります。

于 2013-09-24T09:15:54.550 に答える
0

シミュレーターでアプリケーションを実行し、スポイト ツールを使用してナビゲーション バーの色を取得できます。

ここに画像の説明を入力

于 2017-07-11T13:07:41.900 に答える
0

UINavigationController を拡張
し、その viewDidLoad に同じ色合いの背景を追加しました。

また、ステータスバー領域を覆うように背景フレームを設定しました:

    self.navigationBar.barTintColor = navBackgroundColor;
    CGRect bgFrame = self.navigationBar.bounds;
    bgFrame.origin.y -= 20.0;
    bgFrame.size.height += 20.0;
    UIView *backgroundView = [[UIView alloc] initWithFrame:bgFrame];
    backgroundView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
    backgroundView.backgroundColor = navBackgroundColor;
    backgroundView.alpha = 0.6;
    [self.navigationBar addSubview:backgroundView];
    [self.navigationBar sendSubviewToBack:backgroundView];

私の場合、アルファ 0.6 で問題は解決しましたが、それで遊ぶこともできます。

于 2013-09-24T10:37:54.410 に答える
-1

これはうまくいくはずです：

UIColor *barColour = [UIColor colorWithRed:0.13f green:0.14f blue:0.15f alpha:1.00f];

UIView *colourView = [[UIView alloc] initWithFrame:CGRectMake(0.f, -20.f, 320.f, 64.f)];
colourView.opaque = NO;
colourView.alpha = .7f;
colourView.backgroundColor = barColour;

self.navigationBar.barTintColor = barColour;

[self.navigationBar.layer insertSublayer:colourView.layer atIndex:1];

ここから撮影

于 2013-09-20T12:52:44.477 に答える
-4

これは、navigationBar.translucent == YES が原因で発生します。このプロパティを NO に設定すると、正しい色になります。ただし、この半透明の設定を各ナビゲーション バーで明示的に呼び出さずにすべてのナビゲーション バーに適用する方法がわかりません。このように、ステータス バーもナビゲーション バーと同じ色のままです。

于 2013-09-22T00:01:46.633 に答える