Use dark blur for navbar

In the light theme, using the "light" blur allows the bar to seem invisible
when over white content. Similarly for the "dark" blur over black content.
pull/1/head
Michael Kirk 7 years ago
parent 76fbec8997
commit 7a0d74c17e

@ -92,8 +92,7 @@ const CGFloat kMaxTextViewHeight = 98;
CGFloat alpha = OWSNavigationBar.backgroundBlurMutingFactor; CGFloat alpha = OWSNavigationBar.backgroundBlurMutingFactor;
self.backgroundColor = [Theme.toolbarBackgroundColor colorWithAlphaComponent:alpha]; self.backgroundColor = [Theme.toolbarBackgroundColor colorWithAlphaComponent:alpha];
UIBlurEffect *blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight]; UIVisualEffectView *blurEffectView = [[UIVisualEffectView alloc] initWithEffect:Theme.barBlurEffect];
UIVisualEffectView *blurEffectView = [[UIVisualEffectView alloc] initWithEffect:blurEffect];
[self addSubview:blurEffectView]; [self addSubview:blurEffectView];
[blurEffectView autoPinEdgesToSuperviewEdges]; [blurEffectView autoPinEdgesToSuperviewEdges];
} }

@ -40,57 +40,76 @@ public class OWSNavigationBar: UINavigationBar {
@objc @objc
public static let backgroundBlurMutingFactor: CGFloat = 0.5 public static let backgroundBlurMutingFactor: CGFloat = 0.5
var blurEffectView: UIView? var blurEffectView: UIVisualEffectView?
override init(frame: CGRect) { override init(frame: CGRect) {
super.init(frame: frame) super.init(frame: frame)
if !UIAccessibilityIsReduceTransparencyEnabled() { applyTheme()
NotificationCenter.default.addObserver(self, selector: #selector(callDidChange), name: .OWSWindowManagerCallDidChange, object: nil)
NotificationCenter.default.addObserver(self, selector: #selector(didChangeStatusBarFrame), name: .UIApplicationDidChangeStatusBarFrame, object: nil)
NotificationCenter.default.addObserver(self,
selector: #selector(themeDidChange),
name: .ThemeDidChange,
object: nil)
}
// MARK: Theme
private func applyTheme() {
if UIAccessibilityIsReduceTransparencyEnabled() {
self.blurEffectView?.removeFromSuperview()
let color = Theme.navbarBackgroundColor
let backgroundImage = UIImage(color: color)
self.setBackgroundImage(backgroundImage, for: .default)
} else {
// Make navbar more translucent than default. Navbars remove alpha from any assigned backgroundColor, so // Make navbar more translucent than default. Navbars remove alpha from any assigned backgroundColor, so
// to achieve transparency, we have to assign a transparent image. // to achieve transparency, we have to assign a transparent image.
let color = Theme.navbarBackgroundColor.withAlphaComponent(OWSNavigationBar.backgroundBlurMutingFactor) let color = Theme.navbarBackgroundColor.withAlphaComponent(OWSNavigationBar.backgroundBlurMutingFactor)
let backgroundImage = UIImage(color: color) let backgroundImage = UIImage(color: color)
self.setBackgroundImage(backgroundImage, for: .default) self.setBackgroundImage(backgroundImage, for: .default)
let blurEffect = UIBlurEffect(style: .light)
let blurEffectView = UIVisualEffectView(effect: blurEffect) let blurEffect = Theme.barBlurEffect
blurEffectView.isUserInteractionEnabled = false
self.blurEffectView = blurEffectView let blurEffectView: UIVisualEffectView = {
if let existingBlurEffectView = self.blurEffectView {
return existingBlurEffectView
}
let blurEffectView = UIVisualEffectView()
blurEffectView.isUserInteractionEnabled = false
self.blurEffectView = blurEffectView
self.insertSubview(blurEffectView, at: 0)
// navbar frame doesn't account for statusBar, so, same as the built-in navbar background, we need to exceed
// the navbar bounds to have the blur extend up and behind the status bar.
blurEffectView.autoPinEdgesToSuperviewEdges(with: UIEdgeInsets(top: -statusBarHeight, left: 0, bottom: 0, right: 0))
return blurEffectView
}()
blurEffectView.effect = blurEffect
// remove hairline below bar. // remove hairline below bar.
self.shadowImage = UIImage() self.shadowImage = UIImage()
self.insertSubview(blurEffectView, at: 0)
// On iOS11, despite inserting the blur at 0, other views are later inserted into the navbar behind the blur, // On iOS11, despite inserting the blur at 0, other views are later inserted into the navbar behind the blur,
// so we have to set a zindex to avoid obscuring navbar title/buttons. // so we have to set a zindex to avoid obscuring navbar title/buttons.
blurEffectView.layer.zPosition = -1 blurEffectView.layer.zPosition = -1
// navbar frame doesn't account for statusBar, so, same as the built-in navbar background, we need to exceed
// the navbar bounds to have the blur extend up and behind the status bar.
blurEffectView.autoPinEdgesToSuperviewEdges(with: UIEdgeInsets(top: -statusBarHeight, left: 0, bottom: 0, right: 0))
} }
NotificationCenter.default.addObserver(self, selector: #selector(callDidChange), name: .OWSWindowManagerCallDidChange, object: nil)
NotificationCenter.default.addObserver(self, selector: #selector(didChangeStatusBarFrame), name: .UIApplicationDidChangeStatusBarFrame, object: nil)
NotificationCenter.default.addObserver(self,
selector: #selector(themeDidChange),
name: .ThemeDidChange,
object: nil)
} }
// MARK: Layout
@objc @objc
public func themeDidChange() { public func themeDidChange() {
Logger.debug("\(self.logTag) in \(#function)") Logger.debug("\(self.logTag) in \(#function)")
applyTheme()
guard self.backgroundImage(for: .default) != nil else {
return
}
let color = Theme.navbarBackgroundColor.withAlphaComponent(OWSNavigationBar.backgroundBlurMutingFactor)
let backgroundImage = UIImage(color: color)
self.setBackgroundImage(backgroundImage, for: .default)
} }
// MARK: Layout
@objc @objc
public func callDidChange() { public func callDidChange() {
Logger.debug("\(self.logTag) in \(#function)") Logger.debug("\(self.logTag) in \(#function)")

@ -47,6 +47,7 @@ extern NSString *const ThemeDidChangeNotification;
@property (class, readonly, nonatomic) UIBarStyle barStyle; @property (class, readonly, nonatomic) UIBarStyle barStyle;
@property (class, readonly, nonatomic) UISearchBarStyle searchBarStyle; @property (class, readonly, nonatomic) UISearchBarStyle searchBarStyle;
@property (class, readonly, nonatomic) UIColor *searchBarBackgroundColor; @property (class, readonly, nonatomic) UIColor *searchBarBackgroundColor;
@property (class, readonly, nonatomic) UIBlurEffect *barBlurEffect;
@end @end

@ -123,6 +123,12 @@ NSString *const ThemeKeyThemeEnabled = @"ThemeKeyThemeEnabled";
return (Theme.isDarkThemeEnabled ? [UIColor colorWithWhite:0.35f alpha:1.f] : UIColor.ows_light02Color); return (Theme.isDarkThemeEnabled ? [UIColor colorWithWhite:0.35f alpha:1.f] : UIColor.ows_light02Color);
} }
+ (UIBlurEffect *)barBlurEffect
{
return Theme.isDarkThemeEnabled ? [UIBlurEffect effectWithStyle:UIBlurEffectStyleDark]
: [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
}
#pragma mark - #pragma mark -
+ (UIBarStyle)barStyle + (UIBarStyle)barStyle

Loading…
Cancel
Save