From 51411f66189bbd7bc325eeb2a4a73fcd866a33d5 Mon Sep 17 00:00:00 2001 From: Michael Kirk Date: Fri, 6 Jul 2018 11:33:08 -0600 Subject: [PATCH 1/4] circular corners --- .../ConversationView/Cells/OWSBubbleView.m | 49 ++++++++++++++++--- 1 file changed, 41 insertions(+), 8 deletions(-) diff --git a/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m b/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m index 268dfa328..15c40fb61 100644 --- a/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m +++ b/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m @@ -161,19 +161,52 @@ const CGFloat kOWSMessageCellCornerRadius_Small = 2; CGFloat bottomRounding = (useSmallCorners_Bottom ? kOWSMessageCellCornerRadius_Small : kOWSMessageCellCornerRadius_Large); + const CGFloat topAngle = 3.0f * M_PI / 2.0f; + const CGFloat rightAngle = 0.0f; + const CGFloat bottomAngle = M_PI / 2.0f; + const CGFloat leftAngle = M_PI; + [bezierPath moveToPoint:CGPointMake(bubbleLeft + topRounding, bubbleTop)]; + + // top line [bezierPath addLineToPoint:CGPointMake(bubbleRight - topRounding, bubbleTop)]; - [bezierPath addQuadCurveToPoint:CGPointMake(bubbleRight, bubbleTop + topRounding) - controlPoint:CGPointMake(bubbleRight, bubbleTop)]; + + // top right corner + [bezierPath addArcWithCenter:CGPointMake(bubbleRight - topRounding, bubbleTop + topRounding) + radius:topRounding + startAngle:topAngle + endAngle:rightAngle + clockwise:true]; + + // right line [bezierPath addLineToPoint:CGPointMake(bubbleRight, bubbleBottom - bottomRounding)]; - [bezierPath addQuadCurveToPoint:CGPointMake(bubbleRight - bottomRounding, bubbleBottom) - controlPoint:CGPointMake(bubbleRight, bubbleBottom)]; + + // bottom right corner + [bezierPath addArcWithCenter:CGPointMake(bubbleRight - bottomRounding, bubbleBottom - bottomRounding) + radius:bottomRounding + startAngle:rightAngle + endAngle:bottomAngle + clockwise:true]; + + // bottom line [bezierPath addLineToPoint:CGPointMake(bubbleLeft + bottomRounding, bubbleBottom)]; - [bezierPath addQuadCurveToPoint:CGPointMake(bubbleLeft, bubbleBottom - bottomRounding) - controlPoint:CGPointMake(bubbleLeft, bubbleBottom)]; + + // bottom left corner + [bezierPath addArcWithCenter:CGPointMake(bubbleLeft + bottomRounding, bubbleBottom - bottomRounding) + radius:bottomRounding + startAngle:bottomAngle + endAngle:leftAngle + clockwise:true]; + + // left line [bezierPath addLineToPoint:CGPointMake(bubbleLeft, bubbleTop + topRounding)]; - [bezierPath addQuadCurveToPoint:CGPointMake(bubbleLeft + topRounding, bubbleTop) - controlPoint:CGPointMake(bubbleLeft, bubbleTop)]; + + // top left corner + [bezierPath addArcWithCenter:CGPointMake(bubbleLeft + topRounding, bubbleTop + topRounding) + radius:topRounding + startAngle:leftAngle + endAngle:topAngle + clockwise:true]; return bezierPath; } From 1f6668d8652a3e28fb145ec8a94eded3be960206 Mon Sep 17 00:00:00 2001 From: Michael Kirk Date: Fri, 6 Jul 2018 12:11:29 -0600 Subject: [PATCH 2/4] corner radius to spec --- .../src/ViewControllers/ConversationView/Cells/OWSBubbleView.m | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m b/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m index 15c40fb61..178dae83e 100644 --- a/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m +++ b/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m @@ -7,7 +7,7 @@ NS_ASSUME_NONNULL_BEGIN -const CGFloat kOWSMessageCellCornerRadius_Large = 16; +const CGFloat kOWSMessageCellCornerRadius_Large = 18; const CGFloat kOWSMessageCellCornerRadius_Small = 2; @interface OWSBubbleView () From b301dba4ba34d2cdddb316cf7387bedc19c7f118 Mon Sep 17 00:00:00 2001 From: Michael Kirk Date: Fri, 6 Jul 2018 12:11:40 -0600 Subject: [PATCH 3/4] cell height to spec --- SignalMessaging/utils/ConversationStyle.swift | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) diff --git a/SignalMessaging/utils/ConversationStyle.swift b/SignalMessaging/utils/ConversationStyle.swift index 4f534d501..03d69ba32 100644 --- a/SignalMessaging/utils/ConversationStyle.swift +++ b/SignalMessaging/utils/ConversationStyle.swift @@ -97,16 +97,25 @@ public class ConversationStyle: NSObject { maxMessageWidth = floor(contentWidth - 48) let messageTextFont = UIFont.ows_dynamicTypeBody + + let baseFontOffset: CGFloat = 11 + // Don't include the distance from the "cap height" to the top of the UILabel // in the top margin. - textInsetTop = max(0, 12 - (messageTextFont.ascender - messageTextFont.capHeight)) + textInsetTop = max(0, round(baseFontOffset - (messageTextFont.ascender - messageTextFont.capHeight))) // Don't include the distance from the "baseline" to the bottom of the UILabel // (e.g. the descender) in the top margin. Note that UIFont.descender is a // negative value. - textInsetBottom = max(0, 12 - abs(messageTextFont.descender)) + textInsetBottom = max(0, round(baseFontOffset - abs(messageTextFont.descender))) + + if _isDebugAssertConfiguration(), UIFont.ows_dynamicTypeBody.pointSize == 17 { + assert(textInsetTop == 7) + assert(textInsetBottom == 7) + } + textInsetHorizontal = 12 - lastTextLineAxis = CGFloat(round(12 + messageTextFont.capHeight * 0.5)) + lastTextLineAxis = CGFloat(round(baseFontOffset + messageTextFont.capHeight * 0.5)) self.primaryColor = ConversationStyle.primaryColor(thread: thread) } From 40df1c8c3fab26f74ae05f62e65e70c318214940 Mon Sep 17 00:00:00 2001 From: Michael Kirk Date: Fri, 6 Jul 2018 14:56:03 -0600 Subject: [PATCH 4/4] CR: simplify --- .../ConversationView/Cells/OWSBubbleView.m | 16 ++-------------- 1 file changed, 2 insertions(+), 14 deletions(-) diff --git a/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m b/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m index 178dae83e..2a36a6a78 100644 --- a/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m +++ b/Signal/src/ViewControllers/ConversationView/Cells/OWSBubbleView.m @@ -161,16 +161,13 @@ const CGFloat kOWSMessageCellCornerRadius_Small = 2; CGFloat bottomRounding = (useSmallCorners_Bottom ? kOWSMessageCellCornerRadius_Small : kOWSMessageCellCornerRadius_Large); - const CGFloat topAngle = 3.0f * M_PI / 2.0f; + const CGFloat topAngle = 3.0f * M_PI_2; const CGFloat rightAngle = 0.0f; - const CGFloat bottomAngle = M_PI / 2.0f; + const CGFloat bottomAngle = M_PI_2; const CGFloat leftAngle = M_PI; [bezierPath moveToPoint:CGPointMake(bubbleLeft + topRounding, bubbleTop)]; - // top line - [bezierPath addLineToPoint:CGPointMake(bubbleRight - topRounding, bubbleTop)]; - // top right corner [bezierPath addArcWithCenter:CGPointMake(bubbleRight - topRounding, bubbleTop + topRounding) radius:topRounding @@ -178,9 +175,6 @@ const CGFloat kOWSMessageCellCornerRadius_Small = 2; endAngle:rightAngle clockwise:true]; - // right line - [bezierPath addLineToPoint:CGPointMake(bubbleRight, bubbleBottom - bottomRounding)]; - // bottom right corner [bezierPath addArcWithCenter:CGPointMake(bubbleRight - bottomRounding, bubbleBottom - bottomRounding) radius:bottomRounding @@ -188,9 +182,6 @@ const CGFloat kOWSMessageCellCornerRadius_Small = 2; endAngle:bottomAngle clockwise:true]; - // bottom line - [bezierPath addLineToPoint:CGPointMake(bubbleLeft + bottomRounding, bubbleBottom)]; - // bottom left corner [bezierPath addArcWithCenter:CGPointMake(bubbleLeft + bottomRounding, bubbleBottom - bottomRounding) radius:bottomRounding @@ -198,9 +189,6 @@ const CGFloat kOWSMessageCellCornerRadius_Small = 2; endAngle:leftAngle clockwise:true]; - // left line - [bezierPath addLineToPoint:CGPointMake(bubbleLeft, bubbleTop + topRounding)]; - // top left corner [bezierPath addArcWithCenter:CGPointMake(bubbleLeft + topRounding, bubbleTop + topRounding) radius:topRounding