Получите правильный цвет в прозрачной навигационной панели iOS7

Как я могу получить правильную окраску для своих полупрозрачных навигационных панелей в iOS 7? Панель навигации просто настраивает данный цвет на гораздо более яркий. Изменение яркости или насыщенности цвета также не дает правильного результата.

У кого есть такая же проблема? Кажется, что-то работает, глядя на Facebook: у них есть их цвета и полупрозрачные навигационные панели.

Изменить: просто, чтобы было ясно: мне нужно, чтобы панель была полупрозрачной, а не прозрачной (с некоторой альфой), а не сплошной! http://en.wikipedia.org/wiki/Transparency_and_translucency

Изменить: теперь отправлено в Apple BugReporter

Ответ 1

Строка изменит ваши значения цвета.

Предпочтительный метод, только для RGB >= 40, даст наибольшее размытие

Вы можете использовать этот калькулятор и поместить то, что хотите, чтобы цвет отображался на экране, он скажет вам, что нужно установить цвет barTintColor, поэтому, когда Apple его подстраивает, он будет отображаться как предполагается

http://b2cloud.com.au/how-to-guides/bar-color-calculator-for-ios7-and-ios8/

Изменить: обратите внимание, что эти вычисления предназначены для белого фона, а для более светлых цветов (rgb более 40, если вам нужно более темное, вам нужно добавить фоновый слой, как упомянуты другие, хотя это уменьшит размытость полосы)

Альтернативный темный вид подложек, например, с темно-синим цветом Facebook: (65,96,156) http://img707.imageshack.us/img707/3151/482w.png

В руководстве по глубине: http://b2cloud.com.au/how-to-guides/custom-uinavigationbar-colors-in-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]];

Ответ 2

Вам просто нужно изменить свойство translucent

navigationBar.translucent = NO;

Это фактически то же самое, что удаление/создание прозрачных подзонов/подслоев панели навигации.

Ответ 3

Я улучшил код из Достигая ярких, ярких цветов для полупрозрачного UINavigationBar iOS 7 в моей вилке: https://github.com/allenhsu/CRNavigationController

С моей модификацией, цвет результата на экране (выбранный на белом фоне) будет точно таким же значением, которое передается в setBarTintColor. Я считаю это удивительным решением.

Ответ 4

Я знаю, что этот ответ немного запоздалый, но если вы используете Interface Builder, вы можете получить неправильный цвет при использовании шестнадцатеричного значения, потому что Interface Builder настроен на использование неправильного цветового пространства. В Xcode 6.4 вы можете нажать маленькую шестерню в правом верхнем углу диалогового окна выбора цвета, чтобы выбрать, какое цветовое пространство вы используете:

введите описание изображения здесь

Шахта была установлена ​​в sRGB IEC6196-2.1, когда я действительно должен был использовать Generic RGB.

Ответ 5

Если ваш цвет не является исключительно ярким, вы можете рассчитать эквивалентный цвет w/alpha. Это хорошо работает в 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

Ответ 6

Я полагаю, вы прочитали все комментарии выше. Если вы хотите получить собственный фон и полупрозрачность, вы должны переопределить класс навигационной панели и реализовать свой собственный метод layoutsubviews. Просто добавьте дополнительное subview здесь. ВАЖНО: вы должны добавить его чуть выше фонового поднабора навигационной панели. Он скроет ваш заголовок или кнопки, если вы просто поместите его над всеми областями.

Кроме того, проверьте этот вопрос

Ответ 8

Простое/быстрое решение, которое сработало для меня. Просто установите оттенок панели в раскадровке, а не на фоне.

Сначала выберите свою навигационную панель в своем навигационном контроллере
Панель навигации

И затем щелкните указатель атрибутов справа, а затем настройте оттенок бара
Оттенок

Вы можете выбрать предопределенный цвет или щелкнуть по цвету, чтобы установить его на что-то еще.

введите описание изображения здесь

Ответ 9

Чтобы цвет оттенка выглядел темнее, вы можете изменить 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, чтобы достичь результата, который вам подходит. Все остальное будет бороться с каркасом.

Ответ 10

navBar.barTintColor = [UIColor orangeColor];
navBar.translucent = YES;
UIColor *backgroundLayerColor = [[UIColor redColor] colorWithAlphaComponent:0.7f];
static CGFloat kStatusBarHeight = 20;

CALayer *navBackgroundLayer = [CALayer layer];
navBackgroundLayer.backgroundColor = [backgroundLayerColor CGColor];
navBackgroundLayer.frame = CGRectMake(0, -kStatusBarHeight, navBar.frame.size.width,
        kStatusBarHeight + navBar.frame.size.height);
[navBar.layer addSublayer:navBackgroundLayer];
// move the layer behind the navBar
navBackgroundLayer.zPosition = -1;

Обратите внимание, что вам все равно придется гадать с barTintColor и backgroundLayerColor, чтобы получить точный цвет, который вы хотите. Также, конечно, цвета зависят от цвета фона вашего контента (например, белого).

Ответ 11

Я расширил 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];

В моем случае alpha 0.6 выполнила свою работу, но вы можете играть с ней.

Ответ 12

Вот еще один способ получить правильный цвет полупрозрачной навигационной панели в iOS 7.x и более поздних версиях. Для некоторых цветов можно найти оптимальный цвет оттенка штриха, который делает полупрозрачный брусок для отображения с цветом, соответствующим желаемому.

Например, для цвета Facebook rgb: 65,96,156 или #41609c оптимальный цвет #21458c. Следующий код устанавливает, что все панели навигации в приложении имеют цвет Facebook с собственным API cocoa -touch:

UIColor* barColor = [UIColor colorWithRed:0.129995 green:0.273324 blue:0.549711 alpha:1.0]; // #21458c to make bars actual color match the #41609c color.
[[UINavigationBar appearance] setBarTintColor:barColor];

Единственное ограничение метода заключается в том, что оптимизированный цвет не может быть найден для каждого возможного цвета. Обычно это невозможно для темных цветов.

Я сделал утилиту BarTintColorOptimizer, которая должна быть запущена на устройстве для поиска оптимального цвета штриха для любого цвета, который вы вводите.

Ответ 13

Если вы используете Swift 2.0, вы можете использовать это, это приведет к удалению размытия и правильному отображению цвета.

UINavigationBar.appearance().translucent = false

Ответ 14

От сравнения моих до цветов после того, как я обнаружил, что насыщенность была снижена на 21%, тогда как оттенок и яркость остались прежними.

Добавив 21% обратно, я смог значительно улучшить соответствие цвета. К сожалению, у нашего цвета было насыщенность выше 80, чтобы начать с так, что его нагрузка выше 100% уменьшила отдачу и отлично не соответствовала, но стала намного ближе.

Для цветов с насыщенностью ниже 80 он должен сделать еще лучше.

Информация о том, как настроить насыщенность вашего цвета Как изменить оттенок, яркость и насыщенность UIColor?

Ответ 15

Вы можете запустить приложение в симуляторе и взять цвет панели навигации с помощью инструмента "Пипетка".

введите описание изображения здесь

Ответ 16

Это должно работать:

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];

Взято из здесь

Ответ 17

Это работает для меня:

CALayer *layer = [CALayer layer];
layer.frame = CGRectMake(0, -20,navigationBar.frame.size.width,navigationBar.frame.size.height + 20);
layer.backgroundColor = [[UIColor blueColor] colorWithAlphaComponent:0.75].CGColor;
layer.zPosition = -5;
[navigationBar.layer addSublayer:layer];

Ответ 18

Это происходит потому, что navigationBar.translucent == YES. Установите для этого свойства значение НЕТ, и это будет правильный цвет. Тем не менее, я не узнал, как применить эту полупрозрачную настройку ко всем навигационным панелям, не называя их явно для каждого. Строка состояния также остается тем же цветом, что и панель навигации.

Ответ 19

Попробуйте отобразить соответствующее фоновое изображение для панели навигации. Это сработало для моего тестового приложения.

UIGraphicsBeginImageContext(CGSizeMake(1, 1));
CGContextRef context = UIGraphicsGetCurrentContext();
[[UIColor colorWithRed:55.0f/256.0f green:0.0f blue:1.0f alpha:0.5f] set];
CGContextFillRect(context, CGRectMake(0, 0, 1, 1));

UIImage *navBarBackgroundImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

[[UINavigationBar appearance] setBackgroundImage:navBarBackgroundImage forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setBackgroundImage:navBarBackgroundImage forBarMetrics:UIBarMetricsLandscapePhone];