it-swarm.com.ru

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

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

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

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

Правка: теперь опубликовано в Apple BugReporter

70
stk

Панель будет корректировать ваши значения цвета.

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

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

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

Правка: Обратите внимание, что эти расчеты для белого фона и для более светлых цветов (более 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

Snippet:

@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]];
80
SomeGuy

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

navigationBar.translucent = NO;

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

14
malex

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

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

4
Allen Hsu

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

 enter image description here

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

3
Elethier

Просто используйте этот простой калькулятор barTintColor:

http://htmlpreview.github.io/?https://github.com/tparry/Miscellaneous/blob/master/UINavigationBar_UIColor_calculator.html

enter image description here

2
Damien Romito

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

2
Matthew Crenshaw

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

Сначала выберите панель навигации в контроллере навигации 
Navigation Bar

А затем нажмите инспектор атрибутов справа и затем установите оттенок панели 
Bar tint

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

1
Markymark

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

1
IvanRublev

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

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

1
gleb.kudr

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

0
DisableR

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

UINavigationBar.appearance().translucent = false
0
icekomo

Я расширил 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 выполнил свою работу, но вы можете поиграть с ней.

0
avishic

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

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

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

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

0
SuperGuyAbe
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, чтобы получить нужный цвет. Кроме того, конечно, цвета зависят от цвета фона вашего контента (например, белого).

0
bobics

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

 enter image description here

0
Vladimir