From c8fc47c08c2701b3b9d188c3728b6b325c3c3169 Mon Sep 17 00:00:00 2001 From: Matthew Chen Date: Thu, 1 Jun 2017 14:36:00 -0400 Subject: [PATCH] Rework appearance of the unread indicator. // FREEBIE --- Signal/src/views/OWSUnreadIndicatorCell.m | 89 +++++++++++------------ 1 file changed, 43 insertions(+), 46 deletions(-) diff --git a/Signal/src/views/OWSUnreadIndicatorCell.m b/Signal/src/views/OWSUnreadIndicatorCell.m index a98b43f93..87a5321c9 100644 --- a/Signal/src/views/OWSUnreadIndicatorCell.m +++ b/Signal/src/views/OWSUnreadIndicatorCell.m @@ -12,10 +12,10 @@ @interface OWSUnreadIndicatorCell () -@property (nonatomic) UIView *titleBackgroundView; -@property (nonatomic) UIView *titleTopHighlightView; -@property (nonatomic) UIView *titleBottomHighlightView; -@property (nonatomic) UIView *titlePillView; +@property (nonatomic) UIView *bannerView; +@property (nonatomic) UIView *bannerTopHighlightView; +@property (nonatomic) UIView *bannerBottomHighlightView1; +@property (nonatomic) UIView *bannerBottomHighlightView2; @property (nonatomic) UILabel *titleLabel; @property (nonatomic) UILabel *subtitleLabel; @@ -35,32 +35,32 @@ self.backgroundColor = [UIColor whiteColor]; if (!self.titleLabel) { - self.titleBackgroundView = [UIView new]; - self.titleBackgroundView.backgroundColor = [UIColor colorWithRGBHex:0xe2e2e2]; - [self.contentView addSubview:self.titleBackgroundView]; + self.bannerView = [UIView new]; + self.bannerView.backgroundColor = [UIColor colorWithRGBHex:0xf6eee3]; + [self.contentView addSubview:self.bannerView]; - self.titleTopHighlightView = [UIView new]; - self.titleTopHighlightView.backgroundColor = [UIColor whiteColor]; - [self.titleBackgroundView addSubview:self.titleTopHighlightView]; + self.bannerTopHighlightView = [UIView new]; + self.bannerTopHighlightView.backgroundColor = [UIColor colorWithRGBHex:0xf9f3eb]; + [self.bannerView addSubview:self.bannerTopHighlightView]; - self.titleBottomHighlightView = [UIView new]; - self.titleBottomHighlightView.backgroundColor = [UIColor colorWithRGBHex:0xd1d1d1]; - [self.titleBackgroundView addSubview:self.titleBottomHighlightView]; + self.bannerBottomHighlightView1 = [UIView new]; + self.bannerBottomHighlightView1.backgroundColor = [UIColor colorWithRGBHex:0xd1c6b8]; + [self.bannerView addSubview:self.bannerBottomHighlightView1]; - self.titlePillView = [UIView new]; - self.titlePillView.backgroundColor = [UIColor whiteColor]; - [self.titleBackgroundView addSubview:self.titlePillView]; + self.bannerBottomHighlightView2 = [UIView new]; + self.bannerBottomHighlightView2.backgroundColor = [UIColor colorWithRGBHex:0xebe7e2]; + [self.bannerView addSubview:self.bannerBottomHighlightView2]; self.titleLabel = [UILabel new]; self.titleLabel.text = [OWSUnreadIndicatorCell titleForInteraction:self.interaction]; - self.titleLabel.textColor = [UIColor blackColor]; - self.titleLabel.font = [OWSUnreadIndicatorCell textFont]; - [self.titlePillView addSubview:self.titleLabel]; + self.titleLabel.textColor = [UIColor colorWithRGBHex:0x403e3b]; + self.titleLabel.font = [OWSUnreadIndicatorCell titleFont]; + [self.bannerView addSubview:self.titleLabel]; self.subtitleLabel = [UILabel new]; self.subtitleLabel.text = [OWSUnreadIndicatorCell subtitleForInteraction:self.interaction]; self.subtitleLabel.textColor = [UIColor ows_infoMessageBorderColor]; - self.subtitleLabel.font = [OWSUnreadIndicatorCell textFont]; + self.subtitleLabel.font = [OWSUnreadIndicatorCell subtitleFont]; self.subtitleLabel.numberOfLines = 0; self.subtitleLabel.lineBreakMode = NSLineBreakByWordWrapping; self.subtitleLabel.textAlignment = NSTextAlignmentCenter; @@ -68,14 +68,20 @@ } } -+ (UIFont *)textFont ++ (UIFont *)titleFont { - return [UIFont ows_mediumFontWithSize:12.f]; + return [UIFont ows_regularFontWithSize:12.f]; +} + ++ (UIFont *)subtitleFont +{ + return [UIFont ows_regularFontWithSize:12.f]; } + (NSString *)titleForInteraction:(TSUnreadIndicatorInteraction *)interaction { - return NSLocalizedString(@"MESSAGES_VIEW_UNREAD_INDICATOR", @"Indicator that separates read from unread messages."); + return NSLocalizedString(@"MESSAGES_VIEW_UNREAD_INDICATOR", @"Indicator that separates read from unread messages.") + .uppercaseString; } + (NSString *)subtitleForInteraction:(TSUnreadIndicatorInteraction *)interaction @@ -111,15 +117,11 @@ return 10.f; } -+ (CGFloat)titleInnerVMargin ++ (CGFloat)titleVMargin { return 5.f; } -+ (CGFloat)titleOuterVMargin -{ - return 5.f; -} + (CGFloat)topVMargin { @@ -143,23 +145,18 @@ // // This layout logic assumes that the cell insets are symmetrical and can be deduced // from the cell frame. - CGRect titleBackgroundViewFrame = CGRectMake(-self.left, + CGRect bannerViewFrame = CGRectMake(-self.left, OWSUnreadIndicatorCell.topVMargin, self.width + self.left * 2.f, - self.titleLabel.height + OWSUnreadIndicatorCell.titleInnerVMargin * 2.f - + OWSUnreadIndicatorCell.titleOuterVMargin * 2.f); - self.titleBackgroundView.frame = [self convertRect:titleBackgroundViewFrame toView:self.contentView]; - - self.titleTopHighlightView.frame = CGRectMake(0, 0, self.titleBackgroundView.width, 1.f); - self.titleBottomHighlightView.frame - = CGRectMake(0, self.titleBackgroundView.height - 1.f, self.titleBackgroundView.width, 1.f); + self.titleLabel.height + OWSUnreadIndicatorCell.titleVMargin * 2.f); + self.bannerView.frame = [self convertRect:bannerViewFrame toView:self.contentView]; - self.titlePillView.frame = CGRectMake(0, - 0, - self.titleLabel.width + OWSUnreadIndicatorCell.titleInnerHMargin * 2.f, - self.titleLabel.height + OWSUnreadIndicatorCell.titleInnerVMargin * 2.f); - self.titlePillView.layer.cornerRadius = self.titlePillView.height * 0.5f; - [self.titlePillView centerOnSuperview]; + const CGFloat kHighlightThickness = 0.5f; + self.bannerTopHighlightView.frame = CGRectMake(0, 0, self.bannerView.width, kHighlightThickness); + self.bannerBottomHighlightView1.frame + = CGRectMake(0, self.bannerView.height - kHighlightThickness * 2.f, self.bannerView.width, kHighlightThickness); + self.bannerBottomHighlightView2.frame + = CGRectMake(0, self.bannerView.height - kHighlightThickness * 1.f, self.bannerView.width, kHighlightThickness); [self.titleLabel centerOnSuperview]; @@ -168,7 +165,7 @@ sizeThatFits:CGSizeMake( self.contentView.width - [OWSUnreadIndicatorCell subtitleHMargin] * 2.f, CGFLOAT_MAX)]; self.subtitleLabel.frame = CGRectMake(round((self.contentView.width - subtitleSize.width) * 0.5f), - round(self.titleBackgroundView.bottom + OWSUnreadIndicatorCell.subtitleVSpacing), + round(self.bannerView.bottom + OWSUnreadIndicatorCell.subtitleVSpacing), ceil(subtitleSize.width), ceil(subtitleSize.height)); } @@ -178,8 +175,7 @@ collectionViewWidth:(CGFloat)collectionViewWidth { CGSize result = CGSizeMake(collectionViewWidth, 0); - result.height += self.titleInnerVMargin * 2.f; - result.height += self.titleOuterVMargin * 2.f; + result.height += self.titleVMargin * 2.f; result.height += self.topVMargin; result.height += self.bottomVMargin; @@ -189,13 +185,14 @@ // Creating a UILabel to measure the layout is expensive, but it's the only // reliable way to do it. Unread indicators should be rare, so this is acceptable. UILabel *label = [UILabel new]; - label.font = [self textFont]; + label.font = [self titleFont]; label.text = title; result.height += ceil([label sizeThatFits:CGSizeZero].height); if (subtitle.length > 0) { result.height += self.subtitleVSpacing; + label.font = [self subtitleFont]; label.text = subtitle; // The subtitle may wrap to a second line. label.lineBreakMode = NSLineBreakByWordWrapping;